Aller au contenu

Comptoir de Bricozor : un thème Wordpress sur mesure optimisé pour le SEO

Bricozor est une société de vente de quincaillerie et de bricolage en ligne dont le siège est situé à Mondeville près de Caen (14).

Conscient de l’importance du référencement naturel pour un site e-commerce, Bricozor a ouvert un blog WordPress en 2013, alimenté en articles apportant des réponses pratiques à des problèmes du quotidien pour les bricoleuses et les bricoleurs. La raison d’être de ce blog, hébergé sur un sous-domaine de la boutique, est d’élargir son audience pour aiguiller ce nouveau trafic vers la boutique.

En 2019, Bricozor a fait appel à Imagile pour une refonte graphique et une mise à jour technique de ce blog, toujours sur WordPress, afin d’avoir une base solide orientée SEO pour publier à un rythme plus soutenu.

Version smartphone du site Comptoir de Bricozor

Les premières réunions de travail nous ont permis de définir les objectifs de notre mission :

  1. Installer un nouveau site WordPress avec un thème sur mesure et notre outil de saisie de contenu ;
  2. Intégrer une nouvelle charte graphique fournie par une graphiste indépendante ;
  3. Conserver les URL de l’ancien site.

Rappelons les 3 piliers du référencement naturel :

  1. Le socle technique ;
  2. Le contenu éditorial ;
  3. L’acquisition de liens venant d’autres sites ou backlinks.

Le choix de WordPress nous paraît évident pour ses nombreuses qualités, mais plus encore pour les fonctionnalités nécessaires au SEO : affichage rapide, back-office parfaitement adaptée aux rédacteurs web, des plugins pour le SEO et l’optimisation des performances, etc.

La vitesse de chargement des pages est un critère de plus en plus important aux yeux des moteurs de recherche, en particulier de Google. C’est pourquoi nous concentrons nos efforts sur deux points critiques impactant les performances :

  • Mise en place des meilleures pratiques de développement pour notre thème sur mesure, responsable de l’affichage des pages :
    • Tailles d’images conditionnelles en fonction de la largeur d’écran, au bon format et suffisamment compressées ;
    • Framework CSS moderne et performant : TailwindCSS ;
    • Utilisation modérée du code Javascript, concaténation et compression de plusieurs scripts en un seul pour un chargement plus rapide ;
    • Limitation des effets de recalcul de rendu (article en anglais), très gourmands en ressources pour le navigateur.
  • Hébergement sur notre serveur dédié chez Alwaysdata pour ses performances et la maîtrise sur la stack technique.

L’équipe de Bricozor a commencé par lister tous les articles existants, plusieurs centaines, et a sélectionné ceux qui allaient être repris dans le nouveau site, avec la plupart du temps une mise à jour des informations. Les autres articles ont été soit intégrés dans d’autres au sujet plus large, ou bien complètement abandonnés. Elle a ensuite classé tous ces articles dans une nouvelle arborescence plus intuitive.

Ce travail de rédaction et d’organisation ne serait cependant pas exploité au maximum de son potentiel SEO sans une interface de saisie adaptée.

Dans WordPress, la saisie de contenu se fait par défaut dans Gutenberg, outil permettant d’assembler différents blocs (titre, texte, image, etc.). Il existe aussi des plugins de composition de page ou page builders, avec des blocs personnalisables à glisser-déposer, qui sont très populaires. Ces outils ont pourtant un écueil de taille : ils mélangent le fond et la forme, dans l’interface de saisie mais aussi dans la manière de stocker les blocs dans la base de données.

Le fait de mélanger le fond et la forme interdit l’exploitation sémantique du contenu, et complique tout changement dans la charte graphique, même partiel.

Notre approche de la saisie de contenu, similaire en apparence, est en réalité bien différente. Notre outil, le Flexible Content, propose lui aussi des blocs à assembler dans l’ordre voulu, mais ces blocs doivent être choisis en fonction de la signification qu’ils véhiculent, non pas de leur apparence visuelle. Nous proposons donc des blocs inhabituels, comme « Définition(s) » ou « Tutoriel », qui dans un autre outil seraient construits avec des blocs standards comme Titre, Texte, Image.

Bloc
Exemple de bloc du Flexible Content dans le back-office de Wordpress : "Définition(s)"

Les avantages sont nombreux. Tout d’abord, le rédacteur se concentre sur la valeur sémantique de ce qu’il est en train de saisir. Il doit se poser la question : ce que je suis en train d’écrire, est-ce un simple titre ? Est-ce une définition ? Ou une étape de tutoriel ?

Ensuite, il ne s’occupe jamais de l’apparence de ce qu’il écrit, car elle est figée, pour plusieurs raisons :

  • Respecter la charte graphique ;
  • Prendre en compte les contraintes liées à l’affichage sur différentes tailles d’écran (affichage responsive).

Enfin, lorsque nous codons le thème qui affiche les articles, nous ajoutons des structures de données spéciales, cachées, en fonction de la sémantique de certains bloc. Il peut s’agir de balises HTML dédiées, comme <dl>, <dt>, <dd> pour des définitions, ou bien des schémas spéciaux comme un tutoriel, des questions fréquentes, une vidéo, etc.

Ces structures cachées sont lues par les moteurs de recherche comme Google, Bing et d’autres. Elles les aident à mieux « comprendre » le contenu qu’ils indexent, afin de répondre avec toujours plus de pertinence aux utilisateurs.

Données structurées pour une vidéo
Données structurées pour une vidéo dans le code d'un template PHP
Reconnaissance des données structurées de la vidéo par Google
Reconnaissance des données structurées de la vidéo par Google

Le résultat, combiné à d’autres facteurs (autorité du domaine, des liens entrants sur la page, etc.) est l’obtention de la position zéro sur la page de résultat (la SERP pour Search Engine Results Page), c’est-à-dire la plus haute possible, même avant les annonces payantes, position qui offre le taux de clic maximum.

Résultats de recherche Google
Résultats de recherche Google pour l'expression "enlever mauvaise herbe"
Résultats de recherche
Résultats de recherche Google pour l'expression "extraire vis cassée"

Dernier outil d’aide à la saisie, le plugin gratuit Yoast SEO qui permet de saisir le titre d’un article et la description qui sera affichée dans les moteurs de recherche, avec plusieurs assistants visuels permettant d’en optimiser la longueur, le contenu en mots clés, etc.

Plugin Yoast SEO
Interface de saisie des champs dédiés au SEO dans le plugin Yoast SEO.

Un facteur positif pour l’expérience utilisateur (et donc pour l’optimisation du référencement naturel) est la densité du maillage interne, c’est-à-dire les liens pertinents entre les pages du site. Cela permet au visiteur et au moteur de recherche d’explorer le site par un autre chemin que celui imposé par le menu principal, en proposant des articles à la thématique proche de celle de l’article en train d’être lu.

Là encore, nous proposons un bloc pour créer des liens internes, « Articles liés », qui permet au rédacteur de choisir le ou les articles à proposer en cours ou en fin de lecture.

Exemple d'article lié
Exemple d'article lié pour le maillage interne contextuel.
Autre exemple d'article lié
Autre exemple d'article lié

Le maillage est aussi assuré de manière automatique grâce à plusieurs éléments :

  • Le fil d’Ariane, qui permet de remonter à la catégorie de l’article, afin d’en découvrir de nouveaux sur le même sujet. Ce fil d’Ariane est lui aussi balisé avec des données structurées cachées pour que les moteurs sachent l’identifier ;
  • Des listes d’articles pertinents, par exemple les plus récents de la même catégorie.
Reconnaissance des données structurées du fil d'Ariane par Google
Reconnaissance des données structurées du fil d'Ariane par Google

Grâce à la parfaite connaissance des problèmes de leur public et la mobilisation de plusieurs rédacteurs spécialistes de leur thématique, Bricozor a su produire des articles nombreux (au rythme de 8 par mois en moyenne), étoffés (entre 500 et 1000 mots) et de qualité. Ainsi, de nombreux autres sites (blogs, forums, etc.) font un lien vers un article du site, c’est ce qu’on appelle un lien entrant ou backlink.

Domaines référents
Progression du nombre de domaines référents. La date de mise en ligne du nouveau site est indiquée par la flèche rouge. Source : ahrefs.com.

Les moteurs de recherche fonctionnent en analysant le contenu de chaque page du web. Grâce à divers critères, ils identifient le sujet traité. Cette phase d’indexation terminée, comment classer toutes les pages trouvées sur différents sites traitant du même sujet ? Les moteurs de recherche se servent pour cela d’un indice naturel de popularité : le nombre et l’autorité des liens pointants vers chaque page candidate à ce classement. Pour simplifier à l’extrême, disons que le premier résultat naturel sera la page qui compte le plus de liens entrants et qui ont la plus grande autorité.

L’autorité d’un domaine vient de plusieurs facteurs : sa notoriété, son ancienneté, le nombre de pages elles-mêmes bien classées, la fréquence de mise à jour, le respect des bonnes pratiques du référencement, etc. Exemple : les sites de grands journaux, les sites gouvernementaux, etc.

Certains sites sont tellement vastes et couvrent des sujets tellement différents qu’un seul lien de leur part vers une page quelconque fausserait complètement les calculs des moteurs. Ces sites sont donc exclus du calcul : Facebook et les réseaux sociaux en général, Wikipedia, etc.

La nouvelle charte nous a été fournie par Justine Tzvetkovski, qui est habituée à travailler avec Bricozor. Cette collaboration fût un vrai plaisir pour nos intégrateurs, car Justine connaît les contraintes du web et nous a fourni les maquettes et les instructions pour plusieurs tailles d’écran : mobile, tablette et ordinateur de bureau.

Maquettes graphiques
Maquettes graphiques
Design Comptoir Bricozor en 2013
Design du blog Comptoir Bricozor en 2013
Nouveau design Comptoir Bricozor
Nouveau design Comptoir Bricozor

Un des critères importants en SEO est la stabilité des URL. En effet, une URL d’une page qui ne change pas (mais dont le contenu peut être mis à jour, enrichi) est un signal de sérieux et de résilience pour les moteurs de recherche.

Après avoir cartographié toutes les pages de l’ancien site, Bricozor nous a fourni une liste d’URL :

  • reconduites à l’identique ;
  • redirigées vers une autre URL (redirection 301) ;
  • abandonnées,  renvoyant une erreur 404 « Page introuvable ».

Le blog avait été créé avec un format d’URL différent du format par défaut de WordPress. Heureusement, WordPress offre un mécanisme permettant de faire des modifications à chaque étape de l’exécution de son code, et nous avons pu modifier de manière générale le format d’URL pour conserver l’ancien.

Pour mesurer l’évolution du référencement d’un site, on peut regarder le nombre et la position moyenne d’apparitions d’une page du site dans les résultats de recherche. Nous utilisons pour cela Ahrefs, un outil qui recherche en permanence sur Google des millions de mots clés et enregistre les pages de résultats. Il peut donc dire sur combien de pages de résultats et à quelle position une page du site apparait en moyenne.

Nous voyons ici le nombre de mots clés dont les résultats contiennent le blog Bricozor en page 1 (il y a 10 emplacements de résultats naturels sur une SERP de Google).

Evolution du nombre de Page 1
Evolution du nombre de Page 1 sur Google. La date de mise en ligne du nouveau site est indiquée par la flèche rouge. Source : ahrefs.com

La courbe foncée (« 1-3 ») représente les 3 premières places de la page 1 de résultats, ceux qui sont les plus cliqués en général. La courbe claire (« 4-10 ») montre les autres places de la page 1, qui sont bien sûr importantes mais apportent déjà beaucoup moins de clics.

Nous pouvons constater que la progression dans les résultats de recherche se traduit bien par une augmentation de la fréquentation dans les statistiques fournies par Google Analytics :

Evolution de la fréquentation
Evolution de la fréquentation. La date de mise en ligne du nouveau site est indiquée par la flèche rouge. Source : Google Analytics

Quelques KPI suivis par Bricozor ont connu une belle progression en peu de temps après la mise en production du nouveau blog :

  • +5000 sessions par semaine venant du canal SEO ;
  • +2000 sessions envoyées sur le site e-commerce par mois ;
  • Augmentation de la fréquence de publication d’articles, jusqu’à une moyenne de 6 ou 7 par mois ;
  • Visibilité SEO en forte hausse 6 mois après la refonte.
Comptoir de Bricozor : évolution du trafic et des positions
Évolution du trafic et des positions d'après Rankxplorer
Nous avons multiplié par 3 le trafic envoyé du blog vers le site e-commerce entre 2019 et 2020. Ce trafic affiche un taux de conversion compris entre 0,5 et 1,2 %, l'influence sur les ventes est donc réelle. Nous avons également intégré le blog à notre stratégie de communication par email. Nous poussons aujourd'hui non seulement des produits mais également de l'aide et du contenu à nos clients. Nous affichons des articles pertinents directement sur nos fiches produit. Cela permet de répondre à des intentions de recherche plus lointaines dans le parcours d'achat, nous espérons ainsi améliorer encore l'expérience utilisateur.
Pierre Gincheleau
Pierre Gincheleau Responsable acquisition (SEO | SEA | Growth) Bricozor

Notre approche vous séduit ?

Contactez-nous, ou venez nous rencontrer pour discuter de vos projets.