Une page HTML de base suit une structure définie que tous les documents HTML doivent respecter. Cette structure est composée de plusieurs éléments fondamentaux.
Voici les principaux éléments :
<!DOCTYPE html>: Indique que le document est en HTML5.
<html>: Balise racine du document.
<head>: Contient des métadonnées sur le document (titre, liens vers des fichiers CSS, etc.).
<title>: Définit le titre qui apparaîtra dans l'onglet du navigateur.
<body>: Contient tout le contenu visible de la page (texte, images, vidéos, etc.).
Définitions
Definitions
HTML
HTML (HyperText Markup Language) est un langage de balisage utilisé pour créer des pages web. Il permet de structurer le contenu d'une page en définissant des éléments comme des titres, des paragraphes, des liens, des images, etc.
Balise
Une balise est une instruction dans un document HTML qui indique au navigateur comment afficher le contenu. Les balises sont généralement composées d'une balise d'ouverture et d'une balise de fermeture.
Attribut
Un attribut fournit des informations supplémentaires à une balise. Les attributs sont placés dans la balise d'ouverture et en général, ils se composent d'un nom et d'une valeur.
Structure de base d'une page HTML
Balises HTML courantes
Certaines balises HTML sont plus couramment utilisées que d'autres. Voici une liste de balises importantes :
<p>: Balise de paragraphe.
<h1> à <h6>: Balises de titres (h1 étant le plus important et h6 le moins important).
<a>: Crée un lien hypertexte vers une autre page ou une ressource.
<img>: Permet d'insérer une image dans votre document.
<ul>: Définit une liste non ordonnée (puces).
<ol>: Définit une liste ordonnée (numérotée).
<li>: Chaque élément d'une liste (utilisé avec <ul> ou <ol>).
<p>: Balise de paragraphe.
<h1> à <h6>: Balises de titres (h1 étant le plus important et h6 le moins important).
<a>: Crée un lien hypertexte vers une autre page ou une ressource.
<img>: Permet d'insérer une image dans votre document.
<ul>: Définit une liste non ordonnée (puces).
<ol>: Définit une liste ordonnée (numérotée).
<li>: Chaque élément d'une liste (utilisé avec <ul> ou <ol>).
CSS et HTML
CSS (Cascading Style Sheets) est un langage utilisé pour décrire l'apparence et la mise en forme des documents HTML. Tandis qu'HTML s'occupe de la structure d'une page, CSS s'occupe de son style. Vous pouvez intégrer le CSS directement dans le fichier HTML ou le lier à un fichier externe.
Voici des méthodes pour inclure CSS :
In-line: Utilisation de l'attribut "style" directement dans une balise HTML.
Internal CSS: Inclusion à l'intérieur de la balise <head> à l'aide d'une balise <style>.
External CSS: Lien vers un fichier .css externe en utilisant <link>.
Voici des méthodes pour inclure CSS :
In-line: Utilisation de l'attribut "style" directement dans une balise HTML.
Internal CSS: Inclusion à l'intérieur de la balise <head> à l'aide d'une balise <style>.
External CSS: Lien vers un fichier .css externe en utilisant <link>.
Accessibilité et bonnes pratiques
L'accessibilité est essentielle dans le développement web. Voici quelques bonnes pratiques pour rendre les sites HTML accessibles :
Utilisation de balises sémantiques: Utiliser des balises appropriées pour signaler des structures de contenu (par exemple, <header>, <nav>, <article>, <footer>).
Attributs alt pour les images: Toujours fournir un texte alternatif (attribut "alt") pour les images afin que les lecteurs d'écran puissent décrire le contenu des images.
Contraste de couleur: S'assurer que le texte est lisible sur son fond.
Utilisation de balises sémantiques: Utiliser des balises appropriées pour signaler des structures de contenu (par exemple, <header>, <nav>, <article>, <footer>).
Attributs alt pour les images: Toujours fournir un texte alternatif (attribut "alt") pour les images afin que les lecteurs d'écran puissent décrire le contenu des images.
Contraste de couleur: S'assurer que le texte est lisible sur son fond.
To remember :
Résumé des concepts importants :
- HTML est le langage de balisage essentiel pour la création de pages web, fondé sur des balises qui structurent le contenu.
- Chaque page HTML doit suivre une structure de base incluant <html>, <head>, <title>, et <body>.
- Les balises comme <p>, <a>, et <h1> à <h6> sont fondamentales pour le formatage et l'accès au contenu.
- CSS complète HTML en offrant des outils de style, et des méthodes d'inclusion existent pour garantir flexibilité et organisation.
- L'accessibilité est cruciale, et des pratiques comme l'utilisation de balises sémantiques et d'attributs alt améliorent l'expérience utilisateur.
- HTML est le langage de balisage essentiel pour la création de pages web, fondé sur des balises qui structurent le contenu.
- Chaque page HTML doit suivre une structure de base incluant <html>, <head>, <title>, et <body>.
- Les balises comme <p>, <a>, et <h1> à <h6> sont fondamentales pour le formatage et l'accès au contenu.
- CSS complète HTML en offrant des outils de style, et des méthodes d'inclusion existent pour garantir flexibilité et organisation.
- L'accessibilité est cruciale, et des pratiques comme l'utilisation de balises sémantiques et d'attributs alt améliorent l'expérience utilisateur.
