Collez du code HTML, voyez le rendu en direct, et obtenez dans la foulée le diagnostic SEO du balisage : hiérarchie des titres, images sans alt, JSON-LD valide ou non, balises obsolètes. Aucune installation, aucune inscription, et rien ne quitte votre navigateur.
Analyse locale du code saisi. Elle porte sur le balisage, pas sur la qualité du contenu : voir l'audit d'une page en ligne pour le reste.
Un éditeur HTML en ligne évite la boucle « créer un fichier, l'ouvrir, le recharger » quand on veut simplement vérifier quelque chose. On colle, on regarde, on corrige. Celui-ci ajoute ce que les autres ne font pas : il vous dit ce qui cloche dans le balisage pendant que vous écrivez.
| Situation | Ce que vous vérifiez ici en dix secondes |
|---|---|
| Un bloc HTML fourni par un prestataire | S'il contient des balises obsolètes, des styles en dur ou un H1 supplémentaire qui cassera votre page |
| Un JSON-LD écrit à la main | S'il est syntaxiquement valide, avant de le coller sur cent pages |
| Un tableau ou un formulaire | Le rendu réel, et la présence des en-têtes qui le rendent lisible aux machines |
| Un extrait copié depuis un traitement de texte | La quantité de balisage parasite qui a suivi le copier-coller |
| Un gabarit d'article | La hiérarchie des titres, en particulier les sauts de niveau invisibles à l'œil |
| Une maquette rapide à montrer | Le rendu en plein écran, sans rien mettre en ligne |
Le HTML sert deux publics à la fois : un lecteur, et une machine qui doit comprendre la structure sans voir la mise en page. La plupart des erreurs de balisage viennent de ce qu'on n'écrit que pour le premier.
| Balise | Ce que la machine en fait | L'erreur courante |
|---|---|---|
<title> | Sert de base au titre affiché dans les résultats | Absente, dupliquée sur tout le site, ou trop longue. Voir la balise title. |
<h1> | Annonce le sujet principal de la page | Plusieurs H1, ou un logo transformé en H1 sur toutes les pages |
<h2> à <h6> | Découpent le contenu en sections | Choisis pour leur taille d'affichage, ce qui crée des sauts de niveau. Voir la structure Hn. |
alt sur les images | Décrit l'image et la rend éligible à Google Images | Vide, ou rempli d'une suite de mots-clés. Voir l'attribut alt. |
width et height | Réservent la place avant le chargement | Omis, ce qui décale la page pendant le chargement et dégrade le CLS |
<a> | Transmet du contexte par le texte du lien | Des ancres du type « cliquez ici ». Voir l'ancre de lien. |
lang sur <html> | Indique la langue aux moteurs et aux lecteurs d'écran | Oublié, ou resté sur en après l'installation d'un thème |
<table> avec <th> | Rend le tableau compréhensible ligne par ligne | Un tableau sans en-têtes, ou un tableau utilisé pour la mise en page |
| JSON-LD | Décrit explicitement le contenu, condition des résultats enrichis | Une virgule en trop, et le bloc entier est ignoré en silence |
Sur les sites que j'audite, le défaut de balisage le plus fréquent et le plus facile à corriger est le saut de niveau dans les titres : un H2 suivi directement d'un H4 parce que le H3 paraissait trop gros à l'écran. Le lecteur ne voit rien, la structure logique est cassée, et un extrait de la page devient difficile à isoler pour un moteur comme pour un assistant. Collez une de vos pages ci-dessus, le contrôle le signale immédiatement.
Elles fonctionnent encore, parce que les navigateurs ne cassent jamais rien, ce qui les rend d'autant plus persistantes. Elles trahissent presque toujours un gabarit ancien ou un contenu collé depuis un vieil éditeur.
<font>, <center>, <marquee>, <blink> : de la mise en forme au milieu du contenu, à remplacer par du CSS.<b> et <i> : purement visuels. <strong> et <em> portent en plus une notion d'importance, comprise par les machines et par les lecteurs d'écran.<div> partout : quand une page n'est qu'un empilement de div, aucune structure n'est transmise. <header>, <nav>, <main>, <article>, <aside> et <footer> coûtent le même effort et disent quelque chose.style : difficile à maintenir, impossible à mettre en cache, et signe d'un contenu collé plutôt qu'intégré. Voir la qualité du code.Les données structurées s'écrivent en JSON, et le JSON ne pardonne rien : une virgule finale, un guillemet typographique ramené d'un traitement de texte, une accolade non fermée, et Google ignore le bloc entier sans le moindre message. Le problème est qu'un bloc ignoré ne se voit pas : la page s'affiche normalement, et l'on découvre six mois plus tard qu'aucun résultat enrichi n'est jamais apparu.
Collez votre balisage dans l'éditeur avec sa balise <script type="application/ld+json"> : le contrôle vous dit tout de suite s'il est lisible et quel type il déclare. Pour la suite, l'outil officiel de Google indique si la page devient éligible à un affichage enrichi, ce qui est une autre question. Mon générateur de JSON-LD produit de son côté des blocs déjà valides pour les types les plus courants.
Un rendu correct dans un éditeur ne garantit pas un rendu correct sur votre site, pour des raisons qu'il vaut mieux connaître avant de conclure trop vite.