Bonnes pratiques pour le HTML
SEO, sémantique des pages web et qualité du code HTML
20 janvier 2022
Il ne surprendra personne que de dire que la qualité d’un produit n’est pas uniquement lié a son apparence, mais aussi à la façon dont celui-ci est pensé et construit. Il en va de même pour une page web.
Afficher un texte, une image sur internet voila l'objectif original des pages web à la base. L'outil pour réaliser cela c'est le HTML.
Le code HTML élément structurel de nos pages web, il balise le flux des contenus, texte, images, vidéos etc.. De ce fait il a un impact fort sur les performance de vos page web ainsi que sur leur référencement.
Le language HTML et les normes
Le langage HTML (’Hypertext Markup Language) n’est pas à proprement parler un langage de programation (php, C, Python…) mais est un langage de description permettant de représenter une page web. C’est un langage de balisage. Les balises (Tag en anglais) doivent par principe être ouverte puis fermée. Il est possible au sein d’une balise d’en ouvrir une autre qu’il faudra impérativement fermer avant la fermeture de la balise parente. Nous sommes donc en présence d'une arborescence de balises . Ces balises peuvent recevoir des attributs, tel qu’un nom de classe CSS, une titre , un ID etc… Ces attributs sont multiples chaque balise possède une liste d' attributs autorisés en fonction de sa fonctionnalité. La balise FORM par exemple n’a pas les mêmes attributs que la balise IMG, mais ils peuvent en avoir certains en commun. Si vous désirez en savoir plus sur les notions de cascade et d'héritage c'est ici.
Le langage HTML est très souple. Pour un même rendu écran de vos textes et images vous avez une multitude de solutions possible en HTML. Il n'y a pas de code idéal, de solution unique, mais de plus ou moins bonne recette pour un même résultat.
La norme référente dans la bonne utilisation du HTML est le W3C. Cet organisme à but non lucratif standardise les propositions d’évolution du langage de description des pages web.
Quel impact sur mon référencement
Il fut un temps ou il faut bien le dire, l’audit de la qualité du code HTML était un peu passé par la case perte et profits. De nos jours cela a bien changé. Même si un petit tour sur l’outil de vérification des pages du W3c pour tester quelques exemples d'adresses web montre qu’il reste encore du travail sur de nombreux sites internet.
Performance
La performance (Core Web Vitals) d’un site web dépends de beaucoup de facteurs, temps de chargement, temps de mise a disposition de l'interactivité de la page, stabilité de la présentation visuelle) . La performance rentre en compte dans l'algorithme des moteur de recherche comme Google et Bing. Si le code HTML est négligé, que le nombre de noeuds soit trop important (profondeur de l’arborescence du code HTML), le navigateur perdra du temps à bien interpréter la page, l'affichage sera saccadé, instable . Et par conséquence votre référencement en souffrira.
La règle pour coder les pages HTML est le minimalisme, faire simple, efficace. Eviter au maximum l'imbrication de balises pour diminuer la profondeur de l'arbre HTML.
Cohérence
Le HTML a été conçu pour que le rédacteur puisse présenter son contenu texte et images de façon logique. Il faut donc bien respecter cette rêgle.
titre > sous-titre > paragraphe de texte | Liste. c’est à la fois simple et efficace. Il faut bien garder a l’esprit que les balises HTML ne sont pas la pour l’effet visuel (la CSS est en charge de cette partie), mais pour structurer votre propos. Les moteurs de recherche comme Google ont besoin de cette structuration HTML pour séparer le bon grain de l'ivraie. Dans une page il identifiera facilement titre, texte, image.
Précisions
Une balise HTML dispose d'attributs comme nous l'évoquions plus haut. Elles existent il faut donc en tirer le maximum. L'attribut ALT par exemple doit être systématiquement renseigné. L'attribut TITLE également.
En conclusion
Même si l’aspect qualité du code HTML est longtemps resté sous-estimé, au vue de la difficulté de bien référencer ses pages internet sur les moteurs de recherche nous ne pouvons pas faire l’économie d’une attention toute particulière à la qualité du code HTML sur nos page web.