Validateur de structure HTML

Qu'est-ce que Validateur HTML ?

Ce vérificateur HTML repère les erreurs de structure qui cassent le plus souvent les mises en page : éléments jamais fermés, balises fermantes dans le mauvais ordre, balises de fin sans balise de début, ids et attributs en double, <img> sans alt, et doctype, <title> ou lang manquants dans les documents complets. C'est un contrôle local rapide, pas le validateur officiel W3C (Nu), et il ne vérifie pas quels éléments sont autorisés à quel endroit.

Comment utiliser Validateur HTML

1. Collez un document ou un fragment HTML.
2. Cliquez sur Valider (les résultats se mettent à jour pendant la saisie).
3. Lisez le résumé des erreurs et des avertissements.
4. Utilisez la ligne et la colonne de chaque élément pour corriger votre balisage.

Exemple

<div id="a">
<span>text</div>
<p id="a">x
<img src="a.png">
</br>

Errors: 3 · Warnings: 1
Line 2, column 1 <span> is not closed before </div>
Line 3, column 4 Duplicate id "a" (first used on line 1)
Line 4, column 1 <img> has no alt attribute
Line 5, column 1 <br> is a void element and must not have a closing tag

Quand utiliser Validateur HTML

Utilisez-le pour repérer rapidement la balise qui casse une mise en page, vérifier des modèles et du HTML d'e-mail, ou détecter des ids en double avant qu'ils ne cassent du JavaScript ou des étiquettes. Pour un contrôle complet de conformité (modèles de contenu, ARIA, valeurs d'attributs), utilisez le validateur W3C.

Comment fonctionne Validateur HTML

Un analyseur lexical lit les balises, attributs, commentaires et éléments de texte brut (script, style, textarea, title) en suivant les positions. Une pile d'éléments ouverts applique les règles HTML pour les éléments vides (br, img, input…) et les balises de fin facultatives : </p>, </li>, </td> et similaires peuvent être omises, et un nouveau <li> ou élément de type bloc ferme implicitement le précédent, de sorte que les raccourcis valides de HTML5 ne sont pas signalés. Le contenu SVG et MathML autorise les balises auto-fermantes. Tout autre élément encore ouvert quand son parent se ferme, ou en fin d'entrée, est une erreur.

Cas d'utilisation courants

• ✓ Trouver une div non fermée qui casse la mise en page
• ✓ Contrôler la sortie d'un CMS ou d'un modèle d'e-mail
• ✓ Détecter des ids en double qui cassent les références label/aria
• ✓ Vérification d'accessibilité de base pour les images sans texte alternatif

Questions Fréquentes

Explorer d'autres catégories