HTML

Mis à jour le 22 octobre 2026

HTML est le langage qui structure toutes les pages Web : il dit au navigateur ce qui est un titre, un paragraphe, un lien ou une image. WordPress et les constructeurs de pages l'écrivent pour vous, mais savoir le lire vous permet de comprendre un problème d'affichage, de vérifier vos titres pour le référencement ou de coller un code fourni par un service externe. Cette page en donne l'essentiel, sans prérequis.

Qu'est-ce que le HTML ?

HTML signifie HyperText Markup Language, « langage de balisage hypertexte ». Ce n'est pas un langage de programmation : il ne calcule rien, il décrit le contenu à l'aide de balises. Il travaille avec deux autres langages :

HTML pour la structure et le sens du contenu ;
CSS pour l'apparence : couleurs, polices, mise en page (voir CSS) ;
JavaScript pour l'interactivité : menus qui s'ouvrent, formulaires dynamiques.

La norme HTML est aujourd'hui un « standard vivant » (Living Standard), mis à jour en continu par le WHATWG, le groupe de travail des éditeurs de navigateurs. Depuis 2019, le W3C et le WHATWG collaborent sur cette version unique (spécification HTML). On parle encore de « HTML5 » par habitude, mais il n'y a plus de numéro de version.

Pour situer le HTML dans le fonctionnement d'ensemble d'un site (serveur, navigateur, URL), lisez comment fonctionne un site Web.

À quoi ressemble une page HTML

Une balise s'ouvre et se ferme autour du contenu qu'elle décrit : <p> ouvre un paragraphe, </p> le ferme. Certaines balises portent des attributs, comme l'adresse d'un lien (href) ou le texte alternatif d'une image (alt). Voici une page minimale complète :

<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Titre affiché dans l'onglet et dans Google</title>
</head>
<body>
  <h1>Le titre principal de la page</h1>
  <p>Un paragraphe avec <a href="https://exemple.fr">un lien</a>.</p>
  <img src="photo.jpg" alt="Description de la photo">
</body>
</html>

La partie <head> contient les informations destinées au navigateur et aux moteurs de recherche (encodage, titre, description) ; la partie <body> contient ce que le visiteur voit.

Les balises à connaître

Balise	Rôle
`h1` à `h6`	Titres, du plus important au moins important
`p`	Paragraphe
`a`	Lien (attribut `href` pour l'adresse)
`img`	Image (attribut `alt` pour le texte alternatif)
`ul`, `ol`, `li`	Liste à puces, liste numérotée, élément de liste
`strong`, `em`	Mise en valeur forte (gras), accentuation (italique)
`header`, `nav`, `main`, `footer`	Zones de la page : en-tête, navigation, contenu principal, pied de page
`div`, `span`	Conteneurs sans signification, utilisés pour la mise en forme

Un HTML bien structuré : sémantique, accessibilité, SEO

Choisir la balise qui correspond au sens du contenu, et non à son apparence, s'appelle le HTML sémantique. C'est ce qui permet à un lecteur d'écran de présenter la page à une personne malvoyante, et aux moteurs de recherche de comprendre sa structure. Trois règles simples :

Une hiérarchie de titres logique : en pratique, un seul h1 (le titre de la page), puis des h2 pour les sections, des h3 pour les sous-sections, sans sauter de niveau pour obtenir un texte plus petit. Dans WordPress, le titre de l'article est déjà le h1 dans la plupart des thèmes : commencez votre contenu par des titres de niveau 2.
Un texte alternatif pour chaque image informative, qui décrit ce qu'elle montre.
Des liens explicites : « télécharger le guide des tarifs » plutôt que « cliquez ici ».

Le HTML dans WordPress

Vous n'avez pas besoin d'écrire du HTML pour publier, mais WordPress vous laisse y accéder :

le bloc HTML personnalisé accepte du code brut, par exemple un formulaire ou un widget fourni par un service externe, avec un aperçu du rendu ;
l'option Modifier en HTML, dans le menu d'un bloc, affiche le code d'un seul bloc ;
l'éditeur de code, dans le menu Options en haut à droite de l'éditeur, affiche le code de toute la page.

Pour voir le HTML d'une page déjà publiée, faites un clic droit sur un élément puis « Inspecter » : voir inspecter un élément dans une page Web. La leçon Comment est fait le contenu du Web (HTML et CSS) de la formation WordPress le montre en vidéo (réservée aux membres).

Les entités HTML

Certains caractères ont un sens particulier en HTML : < et > délimitent les balises, & commence une entité. Pour les afficher tels quels dans une page, on les remplace par une entité HTML, un code qui commence par & et finit par ;.

Caractère	Entité	Usage
&	`&`	Esperluette (conseillée dans le texte et dans les adresses de liens)
<	`<`	Signe inférieur à
>	`>`	Signe supérieur à
"	`"`	Guillemet droit dans la valeur d'un attribut
espace insécable	` `	Empêche un retour à la ligne, par exemple avant « : » ou entre un nombre et son unité
é	`é`	Lettre accentuée (inutile si la page est en UTF-8)
©	`©`	Symbole copyright

Avec l'encodage UTF-8, utilisé par WordPress et par la très grande majorité des sites actuels, les lettres accentuées s'écrivent directement : seuls les caractères réservés comme &, < et > sont à encoder. Les entités restent utiles quand vous collez un extrait de code dans une page, ou quand un texte récupéré d'une autre source affiche des codes au lieu des caractères.

Pour encoder ou décoder un texte rapidement : convertisseur d'entités HTML de Mathias Bynens. Collez le texte dans un champ, sa version encodée ou décodée s'affiche dans l'autre.

Ressources pour aller plus loin

La documentation HTML de MDN, en français : la référence la plus complète, avec chaque balise expliquée.
Le validateur du W3C : collez une adresse ou du code pour repérer les balises mal fermées et les erreurs de structure.
Les autres notes de développement du site : Dév.