HTML5 et le référencement du Bloc-notes

Vous allez me dire que le blog n'étant pas encore en ligne il est bien trop tôt d'y penser ?

Ben non c'est justement avant qu'il soit en ligne qu'il faut le préparer aux passages des robots et à son indexation. Le succès d'un référencement passe par l'optimisation du code. Et c'est au moment de sa conception qu'il faut l'optimiser.
On va voir ça avec une question qui me tarabuste :

• • •

Avec HTML5 il y a, parmi d'autres, une grande nouveauté : on peut disposer de plusieurs H1 dans la même page. L'article 20 astuces et plus pour améliorer le référencement naturel de votre site ou de votre blog publié il y a plus d'un an (plus d'un an !) sur mon blog de réfédacteur remet tout en cause :

Organisez votre page en utilisant les balises de structure « Hn »
Si le titre de votre page est en « H2 », placez une casquette en « H1 ». Cette casquette va compléter votre titre en donnant au lecteur plus d'informations sur ce qu'il va trouver dans la page :
« Améliorer le référencement naturel de votre site Web d'entreprise : faire appel un référenceur pour trouver de nouveaux clients »
Si votre balise « H1 » est déjà prise par le nom de votre site/blog, que la balise « H2 » est celle de votre titre, utilisez la balise « H3 » en châpo et commencez vos sous-titres en « H4 ».

Pour mes clients, auparavant, je disposais ainsi mes titres :

  • Sur la page d'accueil :
    1 seul H1, celui du titre de la compagnie, son slogan, sa promesse.
    Comme il n'y a pas lieu de disposer à cet endroit d'un fil d'Ariane (breadcrumb), je remplaçais les « miettes de pain » par cette balise.
    Ainsi il y avait :
    • 1 titre en H1
    • les titres des articles qui se succèdaient en H2. Ces titres, cliquables, renvoyaient à l'article.
  • Sur la page de l'article, le titre passait en H1.
    Sur le blog d'Hiseo, c'est un peu différent (pour ne pas compliquer l'explication) mais ça suit le même principe.

Avec cette possibilité de disposer de plusieurs H1 sur la même page (normal : avec le découpage sémantique de la page, chaque section peut disposer de son propre H1) y a t-il encore un intérêt à poursuivre cette mesure ?
Je pense que oui (mais l'avenir nous le dira). Je garde donc ce principe une page/un h1, mais pour la section du contenu bien évidemment.

Du coup, ça change le dessin de la structure telle que je l'avais dessiné :

exemple de la structure d'une page Web en HTML5
La nouvelle structure de la page d'accueil en HTML5

HTLML 5 et CSS 3 blog


Commentaires :

Les commentaires pour ce billet sont fermés