HTML sémantique : structurer le contenu correctement
Le HTML sémantique, c'est l'utilisation des balises dans leur sens prévu. Une balise <h1> pour le titre principal de la page, des <h2> pour les sections, <article> pour le contenu éditorial, <nav> pour la navigation, <footer> pour le pied de page.
Ces balises donnent des indications à Google sur la hiérarchie et la nature de chaque partie du contenu. Un site où tout est emballé dans des <div> génériques oblige le robot à deviner la structure. Un site avec un HTML sémantique correct lui facilite la tâche.
Les balises Hn (H1 à H6) font partie du HTML sémantique. Leur hiérarchie logique aide Google à comprendre quels sujets sont principaux et lesquels sont des sous-thèmes.
Erreurs de code courantes nuisibles au SEO
| Erreur | Impact SEO |
|---|---|
| Plusieurs H1 sur une même page | Dilue le signal du titre principal, confusion sur le sujet central |
| Texte dans des images sans alternative textuelle | Contenu invisible pour Google, inaccessible aux lecteurs d'écran |
| Liens sans texte d'ancre significatif | Google ne comprend pas la destination du lien |
| CSS ou JS bloquants dans le head | Ralentit l'affichage, détériore le LCP |
| Code trop lourd (non minifié, non compressé) | Temps de chargement plus long, mauvaises métriques de performance |
| Pas de structure de données schema.org | Opportunités de rich snippets manquées |
Code lourd et performance
Un code mal optimisé génère des fichiers plus lourds à télécharger. Un fichier CSS de 500 Ko non compressé ralentit l'affichage. Un fichier JavaScript de 2 Mo bloquant retarde toute l'exécution de la page. Ces problèmes ont un impact direct sur les Core Web Vitals, qui sont des signaux de classement Google.
Les bonnes pratiques de base :
- Minifier les fichiers CSS et JS (supprimer les espaces, commentaires, retours à la ligne).
- Activer la compression Gzip ou Brotli côté serveur.
- Différer le chargement des scripts non critiques (
deferouasync). - Supprimer le CSS inutilisé (beaucoup de thèmes chargent des milliers de lignes jamais utilisées).
Outils pour vérifier la qualité du code
- Validateur W3C (validator.w3.org) : vérifie la conformité du HTML à la norme officielle. Les erreurs critiques peuvent gêner le rendu navigateur et l'interprétation par Google.
- Lighthouse (DevTools Chrome) : analyse les performances, l'accessibilité, les bonnes pratiques et le SEO de base.
- PageSpeed Insights : identifie les ressources bloquantes, les images non optimisées, les scripts à différer.
- Screaming Frog : crawl technique du site, détecte les erreurs de balises, les H1 manquants, les liens cassés.
Lors d'un audit SEO technique, je commence systématiquement par ces vérifications avant d'analyser le contenu et les backlinks.