L'adresse url de la page
- L'url de la page doit contenir le mot clé principal
- L'url de la page ne doit pas être trop longue et/ou contenir des indications inutiles ( des chiffres, ponctuations, ... )
La balise Title de la page
- La balise title de la page ne doit pas excéder 75 caractères ( espaces compris ), sinon le titre sera tronqué . Un titre de 50 caractères est largement suffisant ( pensez au smartphone )
- La balise title de la page doit contenir dès le début votre mot clé principal . Cependant, le titre ne doit surtout pas être une suite de mots-clés .
- La balise title de la page doit être unique . Le titre doit également être différent de la balise structurelle H1 .
- Les moteurs de recherche peuvent ne pas prendre en compte votre balise Title si elle n'est pas pertinente ou si elle est sur-optimisée par exemple . Ils choisiront alors un titre aléatoire comme le nom de votre site web !
La balise méta-description de la page
- La balise méta description de la page ne doit pas dépasser les 170 caractères ( espaces compris ), sinon la description sera tronquée . Une description de 145 caractères est largement suffisante .
- La balise méta description de la page doit être unique et contenir le plus tôt possible le mot clé et ses variantes au sein de 2 ou 3 phrases maximum résumant le contenu de la page .
- La balise méta description de la page doit donner envie de cliquer dessus . Même si elle est considérée comme peu importante en SEO, sachez que plus votre page sera cliquée et plus elle montera dans la SERP de recherche ( la réputation est un point important ) .
- Les moteurs de recherche peuvent ne pas prendre en considération votre balise méta-description si elle ne reflète pas assez le contenu de la page ou si elle est inutile ( suite de mots clés ) . Ils choisiront alors un autre passage de votre page .
Les balises de structure de la page : Hn
- Les balises de structure de la page sont au nombre de 6 et s'écrivent tout simplement H1, H2, H3, H4, H5 et H6 .
- Les balises de structure de la page doivent toute être uniques .
- Les balises de structure de la page classent dans l'ordre d'importance le texte .
- La balise de structure de la page H1 est importante car il s'agit du Titre de la page que va lire le visiteur . Ne pas confondre avec la balise Title ! Elle doit donc être différente de cette dernière et il ne doit avoir qu'une seule balise H1 par page; elle doit également être au début de la page .
- Dans une page SEO classique on pourra donc avoir la balise h1 ⇒ un texte ⇒ une balise h2 ⇒ un texte ⇒ une autre balise h2 ⇒ un texte ⇒ une balise h3 ⇒ un texte ⇒ une balise h4 ⇒ un texte ⇒ une balise h2 ⇒ un texte ⇒ etc etc ...
Les autres balises SEO, détails et mise en page
Il existe bien évidemment de nombreuses autres balises html pour structurer conformément une page web en terme de référencement naturel SEO; voici les plus utilisées :
- <html> : Balise principale de départ d'une page html
- <head> : Balise d'en-tête de page, invisible sur la page, incluant des liens vers les feuilles de styles, les icônes et autres méta-données
- <body> : Balise qui représente le corps principal de la page; 1 seule balise par page
- <link> : Balise qui sert à mettre en liaison une ressource externe, comme une feuille de style
- <meta> : Balise utilisée pour toutes les métadonnées comme la description, charset, viewport, ...
- <style> : Balise utilisée pour le style de mise en forme; code CSS
- <script> ; Balise utilisée pour la technologie Javascript; code Js
- <header> : Balise utilisée pour délimiter la partie haute d'une page web . Ne pas confondre avec HEAD !
- <form> : Balise pour créer un formulaire
- <label> : Balise de nomination d'un champ
- <input> : Balise pour la saisie de donnée
- <select> : Balise d'une liste déroulante avec choix
- <textarea> : Balise pour saisir du texte sur plusieurs lignes
- <footer> : Balise utilisée pour délimiter la partie basse d'une page web .
- <section> : Balise qui structure un groupe de contenu
- <aside> : Balise utilisée pour une partie d'un document sans réel rapport avec le sujet principal de ce dernier
- <article> : Balise représentant un message libre, isolé
- <nav> : Balise de structure d'un menu de navigation
- <blockquote> : Balise de citation; souvent indentée et avec un background différent du texte
- <strong> : Balise de mise en valeur ( important ); représentée en gras
- <img> : Balise pour indiquer une image
- <a> : Balise qui renvoie vers un lien interne ou externe
- <p> : Balise de paragraphe avec retour à la ligne
- <br> : Balise de saut de ligne
- <span> : Balise de conteneur inline associée généralement avec class, id ou style
- <div> : Balise de conteneur en block associée généralement avec style, id ou class
- <table> : Balise pour créer un tableau
- <thead> : Balise pour définir le haut du tableau
- <tbody> : Balise pour représenter le corps principal d'un tableau
- <td> : Balise représentant la cellule d'un tableau
- <tr> : Balise définissant la ligne d'une cellule dans un tableau
- <acronym> : Balise utilisée pour abréger un mot ou + au survol de la souris
- <button> : Balise utilisée pour représenter un style de bouton
- <iframe> : Balise utilisée pour générer le contenu d'une page web externe dans ce bloc
- <ul> : Balise pour générer une liste à puces
- <li> : Balise utilisée pour indiquer un élement dans une liste
- <ol> :Balise pour générer une liste numérotée
Balises html et attributs ...
Saviez-vous enfin que la plupart des balises html peuvent êtres associées avec un ou plusieurs attributs ? Voici les principaux :
- <title> : Attribut qui explique le contenu au survol de la souris
- <rel> : Attribut servant à définir la relation entre la cible du lien et son objet ( Balises link / a ... )
- <alt> : Attribut indiquant un texte alternatif au survol de l'élément ( Balises img / input ... )
- <src> : Attribut appelant l'url d'un contenu souhaité ( Balises img / iframe / script / source ... )
- <align> : Attribut définissant l'alignement horizontal d'un élément ( Balises iframe / table / img ... )
- <charset> : Attribut indiquant l'encodage de la page au niveau des caractères utilisés ( Balises meta / script )
- <style> : Attribut ponctuel pour ajouter un style CSS dans la page html
- <class> : Attribut d'un élément pour du script ou du style
- <id> : Attribut pour identifier un élément pour du style ou un script
- <colspan> : Attribut de tableau définissant la fusion du nombre de colonnes pour une cellule ( Balises td / th )
- <hidden> : Attribut permettant de masquer un contenu tout en le laissant actif
- <href> : Attribut indiquant l'adresse url de la cible ( Balises link / a ... )
- <rowspan> : Attribut de tableau définissant la fusion du nombre de lignes pour une cellule ( Balises td / th )
- <target> : Attribut définisant le type d'ouverture d'une cible ( Balises form / a ... )
- <type> : Attribut définissant un type d'élément ( Balises input / script / style / button ... )
Exercez-vous avec cet éditeur de code en ligne
Exemple d'une page web conforme pour le SEO uniquement en HTML ( comparez ainsi votre contenu )