Qu’est-ce que le HTML ? Définition, structure et exemples

Le HTML (HyperText Markup Language) est le langage de balisage qui structure le contenu des pages web : il indique au navigateur ce qui est un titre, un paragraphe, une image, un lien ou un formulaire. Ce n’est pas un langage de programmation, il ne calcule rien : il décrit. Toute page web, et de nombreuses applications, reposent sur lui, complété par le CSS pour l’apparence et le JavaScript pour l’interactivité.

Ci-dessous : comment le navigateur utilise le HTML, l’anatomie d’un élément (balises, contenu, attributs), la structure minimale d’une page, les balises à connaître, l’histoire du langage jusqu’au « standard vivant » actuel, son rôle en référencement et en accessibilité, et les ressources pour l’apprendre.

Qu’est-ce que le HTML, exactement ?

HTML signifie HyperText Markup Language, « langage de balisage hypertexte ». Deux mots expliquent tout :

• Balisage : on entoure des morceaux de texte de balises qui disent ce qu’ils sont. <h1> annonce un titre principal, <p> un paragraphe, <img> une image.
• Hypertexte : les documents sont reliés entre eux par des liens (<a>), ce qui forme le web.

Le HTML n’est pas un langage de programmation : il n’a ni variables, ni conditions, ni boucles. Il décrit la structure et le sens du contenu. C’est pour cela qu’on dit qu’on « écrit » ou qu’on « intègre » du HTML plutôt qu’on ne le « programme ». On l’utilise principalement pour créer des sites web, mais aussi dans les applications web, les e-mails, certaines applications mobiles hybrides et les documents générés par des logiciels.

Comment le navigateur utilise-t-il le HTML ?

Quand vous ouvrez une page, votre navigateur web (Chrome, Firefox, Safari, Edge) télécharge un fichier HTML envoyé par le serveur. Il le lit de haut en bas, construit une représentation en mémoire de la page (le DOM, un arbre d’éléments), charge les feuilles de style et les scripts indiqués, puis affiche le résultat. Le visiteur voit une page mise en forme ; derrière, il n’y a que du texte balisé.

Voici une page web telle que le navigateur l’affiche, puis le code HTML qui la compose. Vous pouvez faire l’expérience sur n’importe quel site : clic droit, puis « Afficher le code source de la page ».

Le navigateur est tolérant : si une balise est mal fermée, il tente de corriger seul. C’est pratique, mais le résultat peut varier et casser la mise en page ou l’accessibilité. D’où l’intérêt de valider son code.

De quoi est composé un élément HTML ?

Un document HTML est une suite d’éléments. Chaque élément se compose de balises, d’un contenu et, éventuellement, d’attributs.

<p id="paragraphe">Contenu de l'élément p</p>

• La balise ouvrante <p> indique le début du paragraphe.
• La balise fermante </p>, avec une barre oblique, en indique la fin.
• Le contenu est ce qui se trouve entre les deux : du texte, d’autres éléments ou des commentaires. Ici, « Contenu de l’élément p ».
• Les attributs se placent toujours dans la balise ouvrante et associent un nom à une valeur : ici l’attribut id a pour valeur paragraphe. D’autres attributs courants : href (destination d’un lien), src (source d’une image), alt (texte alternatif), class (pour le CSS), lang (langue).

Certains éléments n’ont pas de balise fermante, car ils n’ont pas de contenu : on les appelle éléments vides. C’est le cas de <img>, <br> (retour à la ligne), <input> (champ de formulaire) ou <meta>.

À quoi ressemble la structure d’une page HTML ?

Voici le squelette minimal d’une page valide :

<!DOCTYPE html>
<html lang="fr">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Titre de la page</title>
    <meta name="description" content="Résumé affiché dans les moteurs de recherche">
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <header>
      <nav><a href="/">Accueil</a> <a href="/contact/">Contact</a></nav>
    </header>
    <main>
      <h1>Titre principal</h1>
      <p>Un paragraphe avec un <a href="https://exemple.fr">lien</a>.</p>
      <img src="photo.jpg" alt="Description de la photo">
    </main>
    <footer><p>Mentions légales</p></footer>
  </body>
</html>

• <!DOCTYPE html> indique au navigateur qu’il s’agit de HTML moderne.
• <head> contient les informations sur la page, invisibles dans la page elle-même : encodage, titre de l’onglet, description, feuilles de style.
• <body> contient tout ce qui s’affiche.
• <header>, <nav>, <main>, <article>, <section> et <footer> sont des balises dites sémantiques : elles décrivent le rôle de chaque zone (en-tête, navigation, contenu principal, pied de page).

Quelle différence entre HTML, CSS et JavaScript ?

Langage	Rôle	Analogie
HTML	Structure et sens du contenu	Les murs et les pièces d’une maison
CSS	Apparence : couleurs, polices, mise en page, adaptation au mobile	La peinture et la décoration
JavaScript	Comportement : menus, formulaires dynamiques, contenus chargés à la volée	L’électricité et les équipements

Des frameworks comme Bootstrap combinent ces trois langages et fournissent des composants prêts à l’emploi pour gagner du temps sur un site responsive. Les CMS comme WordPress, eux, génèrent le HTML à partir de modèles : vous rédigez dans un éditeur, le système produit le code. Pour situer le HTML parmi les autres technologies, voir notre panorama des langages de développement web.

D’où vient le HTML et quelle est sa version actuelle ?

Le HTML a été conçu par Tim Berners-Lee, l’informaticien britannique à l’origine du World Wide Web, qui a également posé les premières spécifications des URL et du protocole HTTP. Le document « HTML Tags », conservé dans les archives du W3C, décrit la poignée de balises du tout premier HTML. Tim Berners-Lee a ensuite fondé le W3C (World Wide Web Consortium) en 1994.

Date	Étape
Novembre 1995	HTML 2.0, publié par l’IETF (RFC 1866), premier standard officiel
14 janvier 1997	HTML 3.2, première recommandation HTML du W3C
24 décembre 1999	HTML 4.01, recommandation du W3C
28 octobre 2014	HTML5 devient recommandation du W3C
2019	Accord entre le W3C et le WHATWG : le HTML est désormais développé principalement au WHATWG, sous forme de « standard vivant »

Depuis, il n’y a plus de « HTML 6 » à attendre : la référence est le HTML Living Standard du WHATWG, mis à jour en continu (dernière mise à jour le 25 septembre 2026 au moment où nous écrivons). Quand on parle de « HTML5 » aujourd’hui, on désigne en pratique ce HTML moderne.

Pourquoi le HTML compte-t-il pour le référencement et l’accessibilité ?

Les moteurs de recherche et les lecteurs d’écran utilisés par les personnes aveugles lisent le HTML, pas le rendu visuel. Un HTML propre les aide à comprendre la page :

• La balise <title> et la meta description fournissent le titre et souvent le résumé affichés dans les résultats de recherche.
• Une hiérarchie de titres logique (un <h1>, puis des <h2> et <h3>) donne le plan de la page.
• L’attribut alt des images décrit l’image pour qui ne la voit pas et pour les moteurs. Voir notre article sur la balise alt.
• Des liens explicites (« voir nos tarifs » plutôt que « cliquez ici ») renseignent sur la page de destination.
• Les balises sémantiques et l’attribut lang permettent aux technologies d’assistance de naviguer par zones et de prononcer correctement le texte.
• De vrais boutons et de vrais liens (<button>, <a>) plutôt que des <div> rendus cliquables en JavaScript, pour rester utilisables au clavier.

C’est un point à vérifier lors de toute création de site internet : un thème peut être beau et produire un HTML confus qui pénalise le référencement et l’accessibilité.

Comment apprendre le HTML ?

Le HTML est le langage le plus accessible du web : un éditeur de texte et un navigateur suffisent pour commencer. Quelques ressources fiables :

• MDN Web Docs (Mozilla), en français : une documentation de référence de chaque élément et un parcours d’apprentissage pour structurer du contenu en HTML.
• Le cours « Apprenez à créer votre site web avec HTML5 et CSS3 » d’OpenClassrooms, en français, qui enchaîne HTML et CSS jusqu’à une première page complète.
• Le validateur du W3C (validator.w3.org) pour vérifier son code et comprendre ses erreurs.
• La spécification du WHATWG, pour les questions pointues sur le comportement exact d’un élément.

Les erreurs de débutant les plus fréquentes : oublier de fermer une balise, imbriquer les éléments dans le mauvais ordre (<b><i>texte</b></i>), choisir un titre <h3> pour sa taille plutôt que pour sa place dans le plan, et utiliser le HTML pour la mise en forme (couleurs, espacements) au lieu du CSS.

Questions fréquentes

Le HTML est-il un langage de programmation ?

Non. C’est un langage de balisage : il décrit la structure d’un document, sans logique ni calcul. La logique d’une page vient de JavaScript côté navigateur, ou de langages comme PHP ou Python côté serveur.

Quelle différence entre HTML et HTML5 ?

HTML5 est la version publiée par le W3C en 2014, qui a notamment ajouté les balises sémantiques et les éléments audio et vidéo. Aujourd’hui, le HTML évolue en continu dans le standard vivant du WHATWG, et « HTML5 » désigne simplement le HTML moderne.

Avec quel logiciel écrire du HTML ?

N’importe quel éditeur de texte convient. Les éditeurs de code comme Visual Studio Code ajoutent la coloration syntaxique, l’autocomplétion et la détection d’erreurs. Le fichier s’enregistre avec l’extension .html et s’ouvre dans un navigateur.

Faut-il connaître le HTML pour avoir un site WordPress ?

Non, l’éditeur de WordPress génère le HTML pour vous. Quelques bases restent utiles pour comprendre les titres, les liens et les textes alternatifs, et pour corriger un contenu copié-collé qui s’affiche mal.

Combien de temps faut-il pour apprendre le HTML ?

Les bases se prennent en main rapidement, en quelques séances de pratique. Maîtriser la sémantique, l’accessibilité et l’articulation avec le CSS demande en revanche une pratique régulière sur de vrais projets.

Un projet de site et besoin d’un code propre dès le départ ? Écrivez-nous à contact@osmova.com ou via le formulaire de contact.

Sources

• WHATWG : HTML Living Standard
• W3C et WHATWG : Memorandum of Understanding (2019)
• W3C (archives) : HTML Tags
• IETF, RFC 1866 : Hypertext Markup Language 2.0 (novembre 1995)
• W3C : HTML 3.2 Reference Specification (1997)
• W3C : HTML 4.01 Specification (1999)
• W3C : HTML5 Recommendation (2014)
• W3C : History
• MDN Web Docs : HTML
• OpenClassrooms : Apprenez à créer votre site web avec HTML5 et CSS3
• W3C Markup Validation Service