L’importance du code source
L’optimisation du code source coté client (= code interprétée par votre navigateur) est une étape importante dans le travail de référencement d’un site Internet.
Vous avez sans doute entendu parler de l’importance de la balise <h1> ainsi que de la balise <title> et de l’url (adresse affichée en haut de votre navigateur). Nous allons détailler les principes de ces 3 éléments important pour le référencement.
L’url c’est quoi ?
C’est l’adresse Internet qui correspond à la page sur laquelle on se trouve. Par exemple http://www.monsite.com/page.html correspond à cette page ; celle que vous êtes en train de lire. C’est ce qui est affichée dans la barre d’adresse de votre navigateur généralement située en haut de votre écran.
L’adresse web est constituée (parfois) d’un sous domaine puis du domaine et de son extension suivi d’un / puis du nom de la page (slug). L’optimisation peut intervenir sur le nom de domaine mais aussi sur ce nom de page.
Les urls courtes
Lorsqu’il y a dans l’url un identifiant (un nombre) il correspond en général au numéro d’enregistrement en base de données.
Exemple de slugs avec identifiant :
/page-info-20.html (une page avec des informations; l’identifiant de la page est 20)
/article-212.html (dans le cas d’un site ecommerce par exemple)
/blog/512.php (une page d’un blog par exemple)
L’identifiant n’est pas utile pour le visiteur mais il permet au programme d’afficher le contenu concerné. Il est bien entendu possible de faire sans par exemple en faisant une recherche par le champ slug.
Avantages des urls courtes
- Elles sont plus faciles à retenir, à recopier, à copier/coller.
- Elles ne rentrent pas dans le cadre de la sur-optimisation (url sans ou avec peu de mots clés).
- Elles sont plus faciles à mettre en place pour les développeurs de sites (pas de gestion de titre dans l’url).
Inconvénient des urls courtes
- Elles sont moins sexy !
- Elles n’indiquent aucune ou peu d’informations sur le sujet de la page.
Les urls propres
Il s’agit de slug contenant des mots clés.
Exemple de nom de page avec mots clés (vous entendrez souvent le terme d’url propre)
/infos/mentions-legales.php (une page info avec les mentions légales)
/mentions-legales.html (la même page avec une adresse différente)
/articles/chaussure-femme-rouge-13.html (une page d’un site ecommerce qui donne des information sur un article en l’occurrence des chaussures pour femme dont l’identifiant est le n°13 )
/article-13-chaussure-femme-rouge.php (la même page avec une adresse différente)
Avantages des urls propres
- Renseigner un peu mieux l’internaute même si celui-ci ne va pas forcement regarder l’adresse de la page sur lequel il se trouve cela peut être parfois utile. De plus c’est cette adresse qui s’affichera dans les résultats des moteurs de recherche. Lors d’une recherche Google un nom de page qui « parle » aura plus de chance d’être cliqué qu’une page avec des identifiants.
- Optimiser le référencement (= urls internes et backlinks avec mots clés) pour avoir plus de chance d’être bien positionné sur les mots clés qui seront placés dans l’url.
- Plus sexy !!! sauf certains cas (url trop trop longue avec des caractères spéciaux, accents, …).
Précautions à prendre
Attention aux urls trop longues et/ou sur-optimisées.
Nous allons prendre l’exemple d’un site de petites annonces lié à la location ou l’achat de voitures.
- Mettre une adresse trop longue peut être néfaste pour le visiteur . Par exemple
http://www.site.com/achat-voiture-acheter-voiture-ville-marseille-paca-provence-242.html. Même si la plupart des internautes met en favoris les pages intéressantes pour eux (dans ce cas pas besoin de retenir l’adresse complète) ils peuvent parfois avoir envie de transmettre par email / téléphone / texto / msn / gtalk / … l’adresse à un contact. Dans ce cas une adresse courte est préférable. De plus un lien externe peut parfois être tronqué si l’adresse est trop longue. Du coup cela deviendra une url qui renverra une 404. - L’adresse prise en exemple dans la paragraphe précédent peut être considérée par Google comme de la sur optimisation. Avoir trop de mots clés « optimisés » (assez proche par exemple) cela peut être mal vu par Google. De plus si il y a trop de mots clés cela peut diluer les effets des mots clés importants. Il vaut mieux limiter à 3 / 4 mots clés par url. Je préfère avoir l’url
http://www.site.com/achat-voiture-marseille-242.htmlquehttp://www.site.com/achat-voiture-acheter-vehicule-ville-marseille-paca-provence-242.html. - Pour régler ce problème d’urls longues sur-optimisées on peut aussi faire des catégories. Par exemple :
http://www.site.com/achat-voiture(avec ou sans le / à la fin). Cette page va recenser toutes annonces d’achat de voitures.http://www.site.com/achat-voiture/marseillecette page contiendra la liste des annonces d’achat de voiture à Marseille.http://www.site.com/achat-voiture/marseille/annonce-242.htmlL’annonce numéro 242 d’achat de voiture à Marseille. Pour la locationachat-voituresera remplacé parlocation-voiture. …
Cette façon de faire permet à la fois d’avoir des urls claires pour les visiteurs, optimisées pour Google (dans le cas ou les mots clés dans l’url donne un petit plus), sans abus et classées par catégories.
ATTENTION : Il faut éviter de changer la structure d’url de vos pages sauf si vous n’avez vraiment pas le choix. La stabilité doit primer même si les redirections 301 permettent de rediriger le jus / visiteurs / … des anciennes « urls » vers les nouvelles.
La balise Title
Elle correspond au titre de votre page. Il s’affiche tout en haut de votre navigateur sur la barre de la fenêtre de celui-ci. Elle ne s’affiche pas dans le contenu du site.
Cette balise est très important pour le référencement. Elle est située dans le head du code source html. La syntaxe : <title>nom de votre page</title>
L’ordre des mots clés qui la compose est très important. Les mots arrivants en 1er auront plus de poids que ceux qui suivent.
Je conseille de limiter le nombre de mots clés pour éviter la sur-optimisation ainsi que la dilution car plus il y a de mots clés moins l’importance des différents mots qui composent le title sera forte.
Il faut aussi essayer de ne pas dépasser 70 caractères afin que le titre s’affiche entièrement dans les SERPs.
Pour reprendre le même exemple que tout à l’heure la balise title pourrait être :
<title>Achat d'une voiture à Marseille – annonce 242</title>
La balise h1
Les balises de type hX (x = nombre) servent à structurer à un texte en paragraphe. H1 étant le titre le plus important. En général les webmasters utilisent une police plus grande en H1 qu’en H2, plus grande en H2 qu’en H3 etc …
Exemple de structure de page
<h1>Mon exposé sur...</h1>
<h2>Préambule</h2>
<h2>Introduction</h2>
<h2>Les principes</h2>
<h2>Mes tests</h2>
<h3>Test1</h3>
<h3>Test2</h3>
<h3>test3</h3>
<h2>Conclusion</h2>
<h2>Définitions / lexique</h2>
Ce sont des balises très importantes pour le référencement mais aussi pour les visiteurs qui doivent pouvoir lire votre page de façon structurée.
Ne pas abuser de ces balises. On peut être tenté d’en mettre à la moindre occasion pour donner du poids aux mots clés. Ce n’est pas une bonne idée.
Le contenu de la balise ne pas pas être trop long pour les mêmes raisons que la balise title.
Comment faire cohabiter la balise title et h1 ?
Nous avons vu chaque élément indépendamment des autres et les conseils à suivre sur chaque élément. Maintenant il faut prendre en compte l’ensemble de ces éléments pour optimiser le référencement sans tomber dans le piège de la sur-optimisation.
Il y a 2 écoles :
- Mettre un title et un h1 identiques.
- Mettre un title et un h1 différents (variations des mots clés).
Title et H1 identiques
Par exemple :
<title>Achat d'une voiture à Marseille – annonce 242</title>
<h1>Achat d'une voiture à Marseille – annonce 242</h1>
On peut aussi ajouter le nom d’une catégorie ou du site dans le title si on estime que cela apporte quelque chose à l’internaute : <title>Achat d'une voiture à Marseille – annonce 242 - MonSite.com</title>
Title et H1 différents
Par exemple :
<title>Acheter une voiture à Marseille – Annonce 242</title>
<h1>Annonce 242 - Achat d'un véhicule sur Marseille</h1>
Il faut bien entendu garder le même contexte. Les 2 titres doivent avoir la même signification.
Mon choix
J’ai longtemps été de la deuxième école pour varier les mots clés et ne pas rentrer dans la sur-optimisation mais je préfère maintenant le 1er choix (title et h1 identiques) en voici les raisons :
- Lorsque l’internaute clic sur un titre (title) dans les résultats de Google il s’attend à voir le même titre (H1) sur le site (ou du moins la même signification). Le changement de titre peut dans certains cas être déroutant pour lui.
- Beaucoup de CMS fonctionnent avec un H1 et un titre identiques par défaut comme WordPress par exemple. Les CMS ne sont pas forcement des références en matière de SEO mais Google suit p-e leur logique sur certains points.
- D’après des tests réalisés par des référenceurs Google ne semble pas considérer cela comme un signal « spammy » sauf bien sur si il y a des abus (X répétions de mots clés par exemple).
- Avoir 2 balises au contenu différent :
- Cela ne me semble pas naturel car trop orienté SEO (travail de plusieurs expressions sur 2 titres différents). Qui à part un référenceur va vouloir écrire 2 titres pour un article ? Certainement pas un éditeur ;-).
- Cela peut diminuer la puissance du terme « phare » de la page.
- Cela implique de faire un développement spécifique ou d’adapter son CMS.
- Cela implique de rédiger 2 titres pour chaque page.
- Cela va contre le fait que Google recommande d’avoir les 2 balises identiques pour avoir un meilleur classement dans Google Actualités : https://www.seroundtable.com/google-news-titles-h1-19876.html. Certes ce n’est pas Google Search et c’est pour aider le robot de Google News mais bon …
C’est juste mon avis et mon choix. Il faut bien en faire un 😉 On peut d’ailleurs trouver des avantages à utiliser la 2ème solution comme par exemple pouvoir plus facilement positionner d’autres mots clés (varier les termes sur les 2 balises) ou apporter une information supplémentaire à l’internaute.