14 août 2023

Le SEO sur Webflow : comment bien optimiser son site ?

En tant que fans inconditionnels du SEO mais aussi de Webflow, nous nous sommes penchés sur la question suivante : comment bien référencer son site sur les moteurs de recherche en utilisant cette plateforme de création ? La réponse est à deux vitesses : c’est tout à fait possible, plus simple que sur beaucoup d’autres CMS, mais ça demande de l’application et de la patience. Nous vous avons préparé le guilde ultime pour que votre site Webflow brille de mille feux sur les résultats Google !

Le SEO sur Webflow : comment bien optimiser son site ?

studio seja

Agence de développement spécialisée dans la conception de sites vitrine, e-commerce et applications web.

Comprendre l’importance du SEO sur Webflow

Webflow, c’est quoi ?

Webflow, ce merveilleux outil à la popularité grandissante, est essentiellement une plateforme de création de sites web qui permet à ses utilisateurs de concevoir et héberger des sites web sans nécessairement avoir de connaissances techniques en développement web. Grâce à son interface visuelle et intuitive, vous construisez vos blocs et vos pages grâce à son système de drag-and-drop et sa personnalisation au point. Webflow se présente comme l'une des plateformes no-code les plus abouties.

Webflow permet de créer des sites internet au design très moderne et graphique, en utilisant ses thèmes ou ses composants, gratuits ou payants. La possibilité de créer des interactions animées avec 0 connaissance en programmation est, selon nous, un vrai plus ! De plus, il est possible d’héberger votre site web directement via l’espace d’hébergement que propose nativement Webflow.

Au Studio, Webflow compte parmi les plateformes que nous affectionnons beaucoup. Nous avons construit plusieurs projets client grâce à cet outil, ainsi que notre propre site web !

 

Présentation de webflow
Webflow est une plateforme no-code permettant de construire facilement des sites web.

Pourquoi ai-je besoin du SEO ?

Un site web abouti, dont vous êtes fier.e mais qui n’est pas visible sur internet, c’est plus que dommage. La mise en place et le pilotage complet d’une bonne stratégie SEO vous permet de bénéficier d’une bonne visibilité sur les pages de résultats des moteurs de recherche tels que Google. Grâce à cela, vos prospects auront beaucoup plus de chances de tomber sur votre site, et pour peu qu’il leur plaise et qui leur donne confiance, ils deviendront peut-être vos futurs clients !

Être bien positionné sur les résultats Google donne également plus de crédibilité à votre entreprise. En effet, les utilisateurs ont tendance à faire plus confiance aux résultats les mieux placés sur Google, et c’est exactement ce que vous devez viser pour votre site web.

De plus, une stratégie SEO passe par tellement de critères et d’optimisations qu’elle améliore par nature l’expérience utilisateur de votre site. En plus d’être bien référencé.e, votre site Webflow sera agréable à parcourir pour vos prospects et clients en termes de vitesse de chargement, fluidité de navigation, simplicité d’utilisation, adaptabilité sur différents supports et bien plus encore.

 

Qu’est-ce qui diffère comparé aux autres CMS ?

Là où la majorité des autres CMS, tels que WordPress ou encore Prestashop, passent par des modules pour travailler le SEO d’un site, tout peut être effectué nativement sous Webflow, si l’on sait quoi faire et où le faire !

En effet, sur Webflow, vous avez la main sur presque tout. Sous WordPress, lorsque vous installez un thème, il est parfois difficile d’accéder à sa structure, ses titrages, et son code de manière générale, alors que sur Webflow, vous pouvez tout modifier. Vous pouvez tout à fait installer votre thème Webflow et ensuite retirer tout ce qu’il ne vous plaît pas pour le remplacer par d’autres composants ! Par incidence, lorsque vous procédez à l’optimisation de vos pages sur Webflow, il est facile de faire les modifications que vous souhaitez.

De la même manière, vous avez la main nativement sur les métas titres et descriptions ainsi que l’OpenGraph de chaque page ou template Webflow, alors que sous WordPress, par exemple, vous êtes obligé.e d’installer un module tel que YoastSEO pour accéder à ces données et les modifier à votre convenance.

 

Webflow : les optimisations SEO On-Page 

Le SEO dit « On-Page », ce sont les techniques de référencement et d’optimisations que l’on effectue directement sur les pages de son site web. Il se concentre sur les aspects internes du site et vise à optimiser le contenu, la structure et les balises.

 

Inclure des mots-clés pertinents

Que vous utilisiez Webflow, WordPress ou tout autre CMS, vous ne pouvez pas envisager de stratégie SEO sans l’implémentation de mots-clés. Ces derniers sont simplement les requêtes que tapent les utilisateurs pour chercher quelque chose de précis sur internet.

Prenons un exemple concret : vous êtes une entreprise d’experts-comptables située à Tours. Pour vous trouver, vos prospects sont susceptibles de taper dans le champ de recherche Google « expert comptable tours » ou « cabinet comptable tours ». Ce sont, par exemple, ces mots-clés qu’il vous faudra cibler !

Attention cependant à ne pas viser le même mot-clé avec plusieurs de vos pages, au risque qu’elle se fassent de la concurrence et produisent ce que l’on appelle un phénomène « d’autocanibalisation ».

Il vous faut, pour résumer :

  • Effectuer une recherche et analyse de mots-clés pour trouver les plus pertinents à votre activité
  • Choisir ceux qui ont un volume de recherche intéressant mais qui ne sont pas trop concurrentiels
  • Vous aider d’outils de recherche de mots-clés tels que SEMRush, Google Keyword Planner, Answer the Public et bien plus encore.

Pour vous aider dans votre stratégie de mots-clés, le plus simple est de vous faire accompagner par une agence SEO.

 

Optimiser le balisage du site

Le balisage sémantique d’un site, c’est l’usage des balises ou tags HTML de manière conforme pour faciliter la lecture d’un site internet par les robots des moteurs de recherche.

Nous vous recommandons ainsi les optimisations suivantes :

  • Utilisez les balises sémantiques autant que vous le pouvez, lorsqu’elles sont pertinentes. Parmi elles, on retrouve les balises article, nav, section, et plus encore.
  • Les balises de titrage (H1, H2, H3, etc) sont utilisées convenablement sur les titres
  • La balise H1 représente le titre principal de la page et n’est, préférablement, utilisée qu’une seule fois par page

 

Remplir les balises métas

Les balises de méta description et du titre de chaque page sont importantes. En plus de donner à Google un résumé contextuel de vos pages, le contenu de ces balises peut s’afficher sur les pages de résultats Google. Elles doivent être optimisées pour les utilisateurs, mais également pour les robots :

  • La balise méta titre est renseignée avec un titre pertinent
  • La balise méta titre est d’une longueur conseillée d’environ 50 à 60 caractères
  • La balise méta description est renseignée et offre un résumé adéquat
  • La balise méta description est d’une longueur conseillée d’environ 150 à 160 caractères
  • Les balises métas sont optimisées avec les mots-clés ciblés.

Pour remplir les métas titres et description de vos pages sur Webflow, il suffit simplement de se rendre dans les paramètres de chacune de vos pages, et d’accéder à l’onglet « SEO Settings ».

extrait des paramètres webflow concernant les méta tags
Les métas titre et description sont très faciles à remplir sur Webflow.

Le contenu est de qualité et optimisé

On ne va pas vous le cacher : le SEO n’est rien sans un contenu de qualité, qui plaît aux utilisateurs et suffisamment optimisé pour les moteurs de recherche. Sur Webflow comme dans toutes les plateformes de création de sites, il vous faut faire attention la qualité de votre contenu, mais également à sa structure !

 

Pour optimiser le contenu de vos pages, nous vous conseillons de :

  • Intégrer les mots-clés ciblés à vos contenus en quantité suffisante, mais raisonnable, pour éviter la suroptimisation
  • Rédiger un contenu unique, informatif, qualitatif, que les utilisateurs prendront plaisir à lire
  • Penser à aérer votre contenu et le disposer en paragraphes, avec titres, ainsi que l’usage de listes et blocs divers
  • Agrémenter votre contenu d’images pertinentes à votre contenu, dont les balises alt sont remplies avec une description adéquate et dont les noms de fichiers sont également optimisés
  • Ne pas copier de contenu provenant d’ailleurs afin d’éviter le contenu dupliqué
  • Intégrer des liens internes et externes pertinents à votre contenu

Les URLs des pages sont optimisées

On ne le soupçonne pas toujours, mais l’optimisation On-Page va jusqu’aux URLs de vos pages internet. Elles doivent être :

  • Faciles à comprendre et claires pour l’utilisateur
  • Sans caractères spéciaux
  • Elles doivent contenir des mots-clés pertinents
  • Ses mots doivent être séparés par un tiret simple « - »

Les pages sont compatibles à un usage sur mobile

Ce qu’on appelle le responsive design, soit la capacité d’un site à pouvoir s’adapter aux formats tablettes et mobile, est un élément essentiel qui va aider Google à déterminer si votre site mérite son attention ou non.

En effet, à l’heure où la majorité des internautes naviguent sur internet avec leur smartphone, la compatibilité mobile est devenue primordiale.

Sur Webflow, vous pouvez changer la résolution pour passer sur des formats d’écrans différents et y apporter les modifications nécessaires à votre contenu, de manière à ce qu’il soit toujours visible, lisible et agréable à parcourir.

 

Webflow : le SEO technique

Le SEO technique est absolument essentiel pour vous garantir une optimisation de votre site web optimale. Il représente l’ensemble des optimisations et réglages techniques à effectuer sur un site internet pour faire en sorte qu’il réponde aux nombreux critères techniques des robots des moteurs de recherche. C’est un aspect du SEO qu’il ne faut jamais négliger, même s’il demande des compétences techniques !

 

Optimiser la vitesse de chargement du site

Un site avec un temps de chargement trop important apparaît comme trop lent et trop lourd aux yeux des utilisateurs, mais également des algorithmes des moteurs de recherche. En réduisant au maximum ce temps, vous améliorez l’expérience utilisateur et gagnez des points du côté de Google !

Pour optimiser la vitesse de chargement de votre site Webflow, vous pouvez :

 

Le poids des ressources est réduit

Réduire la taille des fichiers en compressant / minifiant les ressources telles que le HTML, le CSS ainsi que le JavaScript est un bon moyen d’alléger son site. Webflow propose nativement cette fonctionnalité lors de la publication de votre site !

extrait des paramètres webflow concernant les ressources
Compresser les ressources est une étape importante pour réduire le poids d'un site.

 

Pour éviter de surcharger le CSS de votre site Webflow, pensez à réutiliser vos classes CSS et d’éviter d’en créer un milliard (c’est véridique, nous-mêmes nous sommes confrontés à ce problème la première fois que nous avons pris en main Webflow).

 

Seules les ressources nécessaires sont appelées

Webflow propose d’ajouter du code personnalisé sur votre site tout entier, mais également sur chaque page spécifique. Ce qui est pratique lorsque vous souhaitez, par exemple, charger une librairie ou exécuter du code spécifique sur une page en particulier ! Plutôt que d’être appelée partout où elle n’aurait pas besoin de l’être, la ressource n’est chargée que là où l’on a besoin d’elle.

De la même manière, pensez à faire le ménage dans vos ressources non-utilisées !

 

Les images sont optimisées

Webflow possède une fonctionnalité directement intégrée permettant de rendre les images que vous chargez sur le site responsive, soit adaptées à tous les supports. En effet, Webflow vient créer des variantes de votre image à des tailles différentes pour les charger sur tablette ou encore mobile, afin d’éviter de charger votre image originale probablement trop lourde pour les plus petits formats.

 

En revanche, il est recommandé d’optimiser vous-même les images que vous chargez sur Webflow en amont, afin d’être certain.e que leur poids est déjà réduit au maximum ! Pour cela, vous pouvez :

  • Compresser vos images pour réduire leur taille tout en conservant leur qualité. De nombreux outils de compression sont disponibles en ligne, gratuitement, à cet effet.
  • Convertir vos images en des formats plus légers, tels que WEBP, SVG, JPEG ou PNG selon les différents types d’images.
  • Réduire les dimensions des images. Inutile de charger une image en 6000 x 3000 pixels lorsque la majorité des écrans s’arrêtent bien en dessous !

 

Les performances sont suivies et évaluées

Pour savoir où l’on se tient, rien de mieux qu’un outil d’évaluation des performances de notre site web pour nous dire la vérité. Vous pouvez renseigner l’URL de votre site sur des outils tels que PageSpeed Insights ou encore GTMetrix et consulter votre score ! De plus, ces outils vous donnent la liste des améliorations que vous pouvez effectuer pour augmenter la vitesse de votre site.

 

Optimiser la structure du site

Pour à la fois améliorer l’expérience utilisateur et plaire à Google, votre site doit disposer d’une structure claire et logique.

 

L’arborescence du site est logique

L’arborescence du site est bien pensée, avec des catégories et des sous-catégories de page qui sont logiques et pertinentes. Les dossiers de page sous Webflow sont par exemple une très bonne idée !

 

extrait d'interface webflow avec dossiers et pages
Bien organiser les pages de son site ne doit pas être négligé.

Les menus sont faciles à naviguer

Pour être en accord avec l’architecture de votre site, structurez et organiser vos menus de navigation avec les mêmes catégories et sous-catégories. Evitez d’avoir trop de liens, et privilégiez ceux qui sont le plus importants.

Et si vous possédez vraiment beaucoup de pages et de sous-pages sur votre site, créez une page « Plan du site » où vous y répertoriez le tout d’une manière lisible et organisée.

 

Le maillage interne est présent et bien réalisé

Le maillage interne représente tout simplement les liens internes qui relient les différentes pages entre elles. Il facilite la navigation des internautes sur votre site, mais également celle des algorithmes de Google ! Plus vos pages ont de chances d’être parcourues naturellement, plus vite elles auront de chance d’être indexées.

Pour cela, n’hésitez pas à ajouter des boutons et des liens sur votre site Webflow afin de faire des connexions logiques entre les différentes pages. Par exemple, sur votre page d’accueil, si vous avez créé un bloc qui résume l’histoire de votre marque, faites un lien vers votre page « A propos » !

 

Faciliter l’indexation du site

Pour s’assurer que les moteurs de recherche peuvent facilement accéder à toutes les pages de votre site, il faut faciliter le travail d’indexation de votre site Webflow.

 

Le fichier robots.txt

Le fichier robots.txt d’un site web permet d’indiquer aux robots d’exploration des moteurs de recherche les URLs des pages qu’ils peuvent explorer ou non. Il peut ainsi restreindre l’accès à certaines pages privées ou sensibles !

Sur Webflow, vous pouvez accéder à ce fichier et le modifier dans l’onglet SEO des réglages généraux de votre site.

 

Le sitemap XML

Le sitemap est un fichier au format XML qui répertorie très simplement toutes les pages de votre site. Sous Webflow, il est généré automatiquement lorsque vous cochez l’option dans les paramètres SEO, juste en dessous des paramètres concernant le fichier robots.txt.

extrait du paramétrage webflow concernant d'indexation
Webflow permet l'écriture d'un fichier robots.txt personnalisé ainsi que la possibilité d'intégrer un sitemap dynamique.

 

Les balises canoniques

Le contenu dupliqué est l’une des bêtes noires du SEO ! Google déteste tout simplement avoir deux pages au contenu identique, et quoi qu’il arrive, il n’en indexera qu’une. Pour avoir la main sur laquelle de ces URL vous souhaitez indexer, il faut utiliser la balise canonique.

Ce réglage sur Webflow se trouve juste en dessous des paramètres concernant le sitemap et le fichiers robots.txt, dans les paramètres SEO de votre site.

 

Donner un coup de pouce avec les données structurées

Pour permettre aux moteurs de recherche de mieux comprendre votre contenu, vous pouvez utiliser les données structurées. Elles permettent de donner des informations complémentaires au sujet de votre entreprise, de vos articles de blog, de vos avis clients et la liste est longue !

Pour implémenter les données structurées à votre site Webflow, il faut mettre les mains dans le code quoi qu’il arrive. Pour vous aider à les construire au bon format (JSON, le plus souvent), il existe de nombreux outils sur internet où n’avez qu’à rentrer les données pour qu’il vous ressorte ensuite le code au format nécessaire. Il suffit ensuite d’ajouter ce code dans la partie « head » de vos pages web.

 

extrait de la section d'intégration de code sur webflow
Du code personnalisé peut facilement être intégré à chacune de vos pages sur Webflow.

Bien gérer les redirections du site

On n’y pense malheureusement pas assez souvent, mais lorsque vous supprimez une page déjà indexée ou modifiez son URL, cela peut créer des erreurs 404 car lorsque le robot ou l’utilisateur va vouloir rejoindre l’URL qu’il connait, il va se heurter à un mur !

Pour conserver la valeur SEO d’une page déjà indexée, qu’elle soit déplacée ou supprimée, il faut penser à la redirection 301.  Sous Webflow, vous pouvez gérer les redirections nativement, là où sous WordPress, par exemple, il vous aurait fallu installer un module à cet effet.

On retrouve ce paramètre dans les réglages généraux du site, puis dans l’onglet « Publishing ».

 

Extrait du paramétrage Webflow concernant les redirections
Il ne faut jamais négliger les redirections de vos pages au risque de vous retrouver avec des erreurs.

Aller plus loin : les optimisations SEO Off-Page

Vous pouvez tout à fait implémenter les optimisations SEO techniques et On-Page à votre site Webflow, comme nous l’avons vu plus haut, mais qu’en est-il du SEO dit « Off-Page » ?

Le référencement Off-Page englobe l’ensemble des techniques et actions qui sont, comme son nom l’indique, réalisées à l’extérieur du site web lui-même, pour améliorer le positionnement d’un site internet. Contrairement au SEO On-Page, le SEO Off-Page se concentre sur les facteurs externes qui influencent l’autorité d’un site, mais aussi sa popularité et sa réputation.

Si Webflow, ou tout autre CMS ne vous aidera pas plus que ça à développer votre SEO Off-Page, rien n’empêche de travailler tout de même sur ces axes là pour booster votre visibilité :

 

Les backlinks

Le link building, ou la création de liens entrants, qui consiste à obtenir des liens provenant d’autres sites et pointant vers le votre afin d’augmenter votre autorité et pertinence. Ces liens doivent être pertinent à votre activité et de qualité.

 

Les réseaux sociaux

Les réseaux sociaux sont un véritable boost de popularité pour votre site, et peuvent influer indirectement sur votre référencement. Être actif sur les réseaux et partager régulièrement vos contenus est un puissant levier SEO.

 

Le marketing d’influence

Créer des partenariats et collaborer avec des influenceurs et personnalités pertinents à votre secteur est un moyen très efficace de générer des visites vers votre site Webflow, et par incidence renforcer votre popularité et autorité au fur et à mesure.

 

Le SEO local

Si votre entreprise est localisée dans un endroit en particulier, il vous faut implémenter une stratégie de SEO local pour maximiser les chances de bien se positionner et d’apparaître comme une référence dans votre domaine.

Pour atteindre cet objectif, il faut penser à :

  • Créer, remplir et optimiser sa fiche Google My Business
  • Intégrer des mots-clés géolocalisés à vos contenus
  • Obtenez des backlinks proches de vous
  • Obtenez des avis clients
  • Implémentez des données structurées locales

Votre prochaine agence de développement