Balises h1, h2, h3 Prestashop

Prestashop 1.7 – SEO – Améliorer les balises H1,H2,H3 (ép.1)

Le référencement ce n’est pas mon coeur de métier, mais je vais progressivement le développer, car je vois bien qu’il y’a une attente des marchands. Cette semaine on va « booster » la structure de Prestashop.

Episode 1

Cela fait déjà un petit moment que je pose la question : « Comment aider tous ces marchands pour le référencement…? ». Et je me disais qu’il fallait que je prépare quelque chose sur le sujet du référencement et finalement plutôt que de vous faire un gros morceau j’ai décidé de faire une nouvelle série de vidéos segmentée sur la problématique du SEO.

Quel est mon but exactement ? En fait je vais essayer de vous proposer régulièrement de nouvelles optimisations que vous pourrez appliquer à votre boutique Prestashop ou des méthodes pour améliorer votre référencement en général. J’essaierai d’aborder à chaque fois un sujet et le traiter pour qu’ensuite vous puissiez vous débrouiller tout seul.

Une remarque qui est souvent faite à Prestashop c’est qu’ils ont tendance à mettre des balises du type HX un peu n’importe où dans le code de leur application. Cela n’est pas une bonne idée, car Google donne ensuite de l’importance à des termes / mots, qui ne le sont pas vraiment.

Le but de la manoeuvre est donc de supprimer le code du type HX inutile et de le convertir plutôt en balises du type « span », afin de donner priorité au contenu réellement important. Cette recommandation est souvent suggérée par les experts SEO.

Ressources

Pour ce tutoriel vous avez à disposition :

  • L’extrait de règle CSS
  • Les différents fichiers TPL que j’ai modifié durant la vidéo
  • La liste des emplacements des différents fichiers

Télécharger

Au programme

  • Analysons ensemble la structure des différentes pages de Prestashop.
  • Par défaut Prestashop ne respecte pas les bonnes conventions HX.
  • Pensez à vérifier la structure de chaque page (catégorie / produit / accueil).
  • Vérifiez directement via le code source ou via la console debug Chrome.
  • Soyez logiques, donnez de la visibilité uniquement au contenu utile.

3 réflexions au sujet de « Prestashop 1.7 – SEO – Améliorer les balises H1,H2,H3 (ép.1) »

  1. Bonjour,

    Quelle bonne idée cette vidéo, comme vous le faites remarqué les balises Hn son anarchiques dans prestashop et c’est surprenant qu’ils n’aient pas corrigé cette ineptie pour le référencement dans la 1.7…

    Il en effet de bon sens de présenter un contenu structuré à google, ça semble être la base même de tout type de contenu.

    Il se doit d’être ordonné et hiérarchisé selon son importance pour une compréhension logique par une machine qui ne prendra pas la peine de réorganiser.

    Je trouve très intéressant le fait d’ajouter une class block en bout de ligne pour garder le style.

    Avez-vous testé le site après modification sur chome en effectuant des zooms jusqu’à activer la version smartphone ? Le footer est-il toujours utilisable ? Lors du retour en affichage desktop le footer est-il bien apparent avec la bonne mise en page?

    Je vous pose ces question car ce topic:

    https://www.prestashop.com/forums/topic/605913-mauvaise-structure-de-page-daccueil-balises-panier-avant-mon-h1/

    aborde les problèmes rencontrés lors de la modification du balisage Hn parasites des différentes pages de presta.

    Si vous avez un instant pour le consulter, je poste un lien vers votre article.

    merci encore pour vos articles plein de pertinence 😉

    1. Bonjour,

      Effectivement, j’ai été moi-même surpris de voir que malgré que le template qui a été entièrement refondu… il semblerait que la problématique des balises HX ait été mise de côté.

      Attention pour le balisage, la méthode que je propose semble bien fonctionner sous Prestashop 1.7, car tous les titres avaient déjà une classe CSS assignée, ce qui fait que l’ajout de la règle « block » est suffisante.

      Pour une version Prestashop 1.6, cela risque d’être plus complexe, il faudra mettre une classe à chaque élément de titre et appliquer des règles cohérentes en fonction de l’emplacement où le titre se trouve (ex. header, footer, colonne gauche / droite… etc).

      Le CSS de Prestashop 1.7 est mieux structuré, ce qui permet de faire l’opération rapidement… mais pour Prestashop 1.6 cela est certainement plus long pour la mise en place des règles CSS.

      A bientôt !

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *