HTML (HyperText Markup Language) est le langage de balisage standard utilisé pour créer des pages web. Il permet de structurer le contenu d’une page, notamment les titres, les paragraphes, les images, les liens, les listes et d’autres éléments essentiels à l’organisation d’une page web. HTML est la base de toutes les pages web, et il est souvent combiné avec d’autres technologies comme CSS (Cascading Style Sheets) pour la mise en forme et JavaScript pour l’interactivité.
HTML utilise des balises (ou tags en anglais) pour définir les différents éléments d’une page. Ces balises sont généralement entourées de chevrons (par exemple, <p>
pour un paragraphe, <a>
pour un lien) et peuvent contenir des attributs qui spécifient des informations supplémentaires sur l’élément. Par exemple, la balise <img>
utilisée pour insérer une image peut avoir un attribut src
pour indiquer le chemin du fichier image.
Structure de base d’une page HTML
Une page HTML typique commence avec une déclaration de type de document (DOCTYPE) qui indique la version d’HTML utilisée. Ensuite, elle contient deux sections principales : l’en-tête (head) et le corps (body).
- DOCTYPE et élément
<html>
:- L’élément
<!DOCTYPE html>
au début du fichier indique que la page utilise HTML5, la dernière version d’HTML. - L’élément
<html>
enveloppe tout le contenu de la page.
- L’élément
- En-tête (
<head>
) :- La section
<head>
contient des métadonnées qui ne sont pas affichées sur la page elle-même, mais qui sont essentielles pour le navigateur ou les moteurs de recherche. Par exemple, le titre de la page est défini avec la balise<title>
, et des fichiers externes comme des feuilles de style CSS ou des scripts JavaScript sont liés avec les balises<link>
et<script>
.
- La section
- Corps (
<body>
) :- La section
<body>
contient le contenu visible de la page, comme les textes, les images, les vidéos et les liens. Les éléments courants dans cette section incluent :<h1>
à<h6>
pour les titres (de niveau 1 à 6),<p>
pour les paragraphes,<a>
pour les liens hypertextes,<img>
pour les images,<ul>
,<ol>
et<li>
pour les listes non ordonnées, ordonnées et les éléments de liste.
- La section
Exemple simple de page HTML
<!DOCTYPE html> <html lang="fr"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Exemple de Page HTML</title> </head> <body> <header> <h1>Bienvenue sur ma page web</h1> </header> <section> <p>Ce texte est un exemple d’une page HTML simple. <a href="https://www.example.com">Cliquez ici</a> pour visiter un autre site.</p> <img src="image.jpg" alt="Exemple d'image"> </section> </body> </html>
Attributs HTML
Les attributs sont utilisés dans les balises HTML pour fournir des informations supplémentaires. Par exemple :
src
: utilisé pour spécifier le chemin d’un fichier (par exemple, une image ou une vidéo),href
: utilisé dans la balise<a>
pour définir l’URL d’un lien,alt
: fournit une description alternative d’une image (important pour l’accessibilité),id
: identifie de manière unique un élément sur la page (utilisé pour les styles CSS et l’interactivité JavaScript),class
: permet d’attribuer une ou plusieurs classes à un élément pour appliquer des styles CSS.
Conclusion
HTML est un langage fondamental pour la création de pages web. Il permet de structurer le contenu de manière logique et d’ajouter des éléments interactifs. Même s’il est souvent utilisé avec d’autres technologies comme CSS et JavaScript, comprendre les bases de HTML est essentiel pour tout développeur web. Il permet de concevoir des pages web accessibles, bien structurées et faciles à maintenir.