Tout un nombre de problèmes de référencement qu’on affronte de jour en jour pourront être bientôt résolus avec de nouvelles technologies que nous propose le standard HTML5.
Le standard HTML5 est une innovation fondamentale qui va déterminer le développement de la Toile lors des dizaines d’années suivantes. Récemment annoncé, il lui faudra encore quelques années pour être accepté pleinement par nos navigateurs Web, moteurs de recherche et développeurs. Parmi une multitude de nouveautés qui font partie du standard, on va s’arrêter sur celles qui nous seraient utiles dans le référencement.
Problème 1: Pagination
Si votre site a des milliers de pages avec un contenu répétitif, comme par exemple une suite de produits dans telle ou telle catégorie, vous êtes confronté à un dilemme: d’un côté le site doit être indexé, de l’autre, la duplication du contenu nous menace d’une visibilité peu attrayante dans les moteurs de recherche.
Des liens séquentiels de HTML5 seront ici une vraie roue de secours. Ces liens vont assembler de façon logique plusieurs documents au sein d’une séquence de documents. Conformément au nouveau standard, on entend sous une séquence de documents un ensemble de documents dont chacun en a un précédent et un suivant. Un document sans voisin précèdent devient le début de la séquence et celui sans voisin suivant – sa fin.
Les liens séquentiels se font réaliser à travers notre vieux ami, l’attribut rel.
Admettons qu’à présent notre pagination a l’air suivant:
[code=’js’]Page précédente[/code]
[code=’js’]Page suivante[/code]
Afin de mettre en place le nouveau format, il suffit d’ajouter les attributs rel de manière suivante:
[code=’js’] Page précédente [/code]
[code=’js’] Page suivante[/code]
Cette tournure va dire au moteur de recherche que les pages qu’il indexe sont liées entre elles. Apparemment, dans nombre de cas l’utilité de cette structuration est modique. Néanmoins, le principe général est ainsi: plus on est précis dans la description du contenu au moteur, mieux celui-ci pourra l’évaluer.
Problème 2: Structure de la page
Depuis longtemps, la tendance mainsteam dans la création des pages Web nous postule : utilisez HTML pour le contenu, CSS – pour sa présentation stylistique, JavaScript – pour la réalisation des fonctions supplémentaires. Pourtant, HTML souffrait toujours d’un manque de moyens efficaces de catégorisation du contenu.
Ces derniers temps, le problème en question se résout partiellement moyennant les microformats, mais vous allez voir que HTML5 va apporter là son obole bien pratique.
Une des particularités du standard HTML5 est un ensemble de balises supplémentaires de structuration du contenu. On note ici: <section><header><footer><article><hgroup><aside><nav>.
Par exemple,
[code=’js’]
[/code]
se transforme en:
[code=’js’]
[/code]
Ainsi remettons-nous au moteur des infos plus détaillées sur le contenu de la page, qui pourraient être utilisées dans la formation du snippet.
En outre, d’ores et déjà, on aura le droit à plusieurs en-têtes <h1> ce qui nous donnera la possibilité de placer sur la page quelques blocs de textes à un poids égal.
La réalisation de cette innovation repose sur la mise en place de quelques nouvelles balises:
[code=’js’]
En-tête 1
Texte
En-tête 2
Texte
[/code]
Moyennant la balise <section> vous divisez l’intégralité du contenu en blocs, en attribuant à chacun un en-tête du premier niveau (<h1>) qui est enfermé à son tour dans les balises <header>. La présentation du contenu de ces balises avec CSS est déjà bien réalisée sur Firefox, Chrome et Safari. Les accros de IE devront installer un petit script html5shiv.
Problème 3: Pages des résultats de recherches sur le site
Des outils de recherche au sein du site sont bien fréquents aujourd’hui. D’habitude, les pages créées par ceux-ci se font fermées d’indexation par les moteurs de recherche via robots.txt, du fait qu’elles deviennent des pages dupliquées de celles qui existent déjà. Pourtant dans nombre de cas, la recherche sur le site est utilisée comme moyen de navigation, voilà pourquoi leur indexation est quand même désirable.
Comme s’il entendait la voix des référenceurs du monde entier, HTML5 propose une solution de ce problème qui consiste à utiliser l’attribut rel de manière suivante:
[code=’js’]Rechercher sur le site[/code]
Ainsi allez-vous communiquer au moteur de recherche plus d’infos sur les spécificités de la page qu’il indexe.
Problème 4: Microformats + schema.org
Les microformats et RDF permettentd’intégrer dans la page des métadonnées qui décrivent de façon structurée son contenu. Leur importance était tellement grande pour les moteurs de recherche, que tous les 3 ténors dans le domaine, Google, Microsoft et Yahoo!, se sont réunis pour adopter un standard commun schema.org. Schema.org n’est pas tout à fait un langage, mais un vocabulaire. Le plus gros problème est qu’il n’est compatible qu’avec Microdata, un autre standard qui fait partie de la spécification HTML5.
A mon avis, avec le temps on va tous passer au schema.org, mais pour le moment, il est autorisé d’utiliser en même temps tous les types de formats.
Problème 5: AJAX et URL
Dès son apparition, AJAX est vrai un mal de tête pour les référenceurs. Vu que la technologie AJAX a été conçu pour le confort des utilisateurs, elle se foutait un peu des exigences des SEOs. Il lui est donc assez compliqué de faire plaisir à tous les deux.
Partiellement ce problème se résout par l’attachement d’une commande AJAX aux balises <a> histoire que le moteur arrive à indexer un contenu demandé. Mais en réalité ce n’est qu’une demi-solution, car l’adresse du contenu reçu ne peut pas être copiée dans le presse-papier pour ensuite être partagée dans des réseaux sociaux.
Comme vous l’avez compris, là aussi, le standard HTML5 va nous donner un bon coup de main. Et notamment, il nous propose des moyens de changement dynamique de l’URL dans la barre d’adresse du navigateur. Sans rechargement de la page, évidemment. Pour cela on va utiliser history.pushState() et les méthodes liées avec: replaceState() et popState().
Exemple de la mise en place de cette méthode:
[code=’js’]var stateObj = { foo: “bar” };
history.pushState(stateObj, “page 2”, “bar.html”);[/code]
La méthode history.pushState() ne change pas que l’url à la volée, mais la sauvegarde également dans l’historique du navigateur.
Il importe de faire une remarque pour les admirateurs de IE. Si vous voulez profiter de cette belle nouveauté, il vous faudra avoir recours à encore une extension (Je crois que vous y êtes déjà habitués:).
Bon, en bref. Le standard HTML5 est bien orienté SEO. Quoiqu’il n’est pas encore très répandu, les moteurs de recherches populaires se mettent petit à petit à mettre en place ses possibilités. Et donc, plus tôt vous commencerez à les utiliser, plus d’avantages vous allez avoir devant vos concurrents!
Je vous souhaite la bonne chance et de belles découvertes avec HTML5!
Merci pour cet excellent article 😉
Je suis d’accord avec tous les points à part un seul : la multiplicité des balises H1.
En effet je ne trouve pas que ce soit sémantiquement pertinent d’utiliser à plusieurs reprises une balise H1 dans une page sachant qu’il y a des balises de H2 à H7 pour hiérarchiser le contenu.
@+
Merci pour le point 1 et 3 que je ne connaissait pas….
Très bon article, qui montre combien l’évolution des langages utilisés par nos sites Internet va nous permettre de faire évoluer le référencement naturel.
PS : il aurait été normal de citer la source de cet article, étant donné que c’est une traduction d’un article anglais. 😉
Salut, Daniel! Merci pour ton commentaire. Je fais toujours un lien vers la source de l’article si je le traduis, il est présent à la fin du billet:)
Le plus beau c’est le point 5, un site fluide avec une url qui change est enfin possible, enfin …
Excellente information de votre part. Pour ma part dans ma société offshore je mets l’accent sur les backlinks.