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, que l'audit d'une page en ligne examine.
Ce genre de problème se voit rarement à l'œil nu et coûte des positions pendant des mois. Dans mes accompagnements, je commence par vérifier gratuitement l'exploration, l'indexation, la vitesse et les redirections, puis je traite les priorités une par une. Comptez de 300 à 1 500 € par mois selon le périmètre.
Je regarde votre site avant de répondre. Réponse sous 24 h en semaine.
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 un contrôle du balisage qui se met à jour 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 | Un logo transformé en H1 sur toutes les pages, ce qui donne le même titre principal à tout le site. Plusieurs H1 ne gênent pas Google, mais un seul rend le sujet plus net. |
<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 | Aide Google à comprendre l'image, et la décrit aux lecteurs d'écran | 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> | Sert aux lecteurs d'écran (prononciation) et à la traduction automatique du navigateur. Google, lui, détermine la langue d'après le texte visible et l'ignore. | Oublié, ou resté sur en après l'installation d'un thème : le lecteur d'écran lit alors le français avec un accent anglais |
<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 devient illisible |
Le saut de niveau dans les titres est le cas typique. Un H2 est suivi directement d'un H4, parce que le H3 paraissait trop gros à l'écran. Google s'en accommode, il ne classe pas une page sur l'ordre de ses titres. Les lecteurs d'écran, en revanche, s'appuient sur cette hiérarchie pour naviguer, et le W3C recommande de ne pas sauter de niveau. La correction se fait dans le CSS, pas dans le balisage. Collez une de vos pages ci-dessus, le contrôle signale chaque saut.
La plupart s'affichent encore, parce que les navigateurs gardent la compatibilité avec le web ancien, et c'est ce qui les fait durer. Elles trahissent presque toujours un gabarit ancien ou un contenu collé depuis un vieil éditeur.
<font>, <center> et <marquee> sont déclarées obsolètes par la spécification HTML. C'est de la mise en forme au milieu du contenu, à remplacer par du CSS. <blink> ne clignote plus du tout, aucun navigateur actuel ne la reconnaît.<b> et <i> ne sont pas obsolètes, mais ils ne disent rien de l'importance du texte. Pour souligner un passage qui compte, <strong> et <em> sont les bons choix ; <i> reste correct pour un titre d'œuvre ou un mot étranger.<div> partout : la balise n'a rien d'interdit, mais 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, répété dans chaque page au lieu d'être chargé une fois avec la feuille de style, 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 ne peut plus lire le bloc entier. Rien ne se voit sur la page, qui s'affiche normalement. Le seul signal arrive plus tard, dans le rapport « Données structurées non analysables » de la Search Console, à condition d'aller le consulter.
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.