#7 Les 9 optimisations SEO pour votre site Webflow
Des quick win pour optimiser son site pour les moteurs de recherche, gagner des positions, et in fine générer du trafic qualifié.
Hello
Aujourd’hui, au menu 🥦
Webflow : Je vous partage les 9 bonnes pratiques (incontournables) pour optimiser votre site Webflow techniquement pour le SEO
Gemeos : On se fait accompagner et challenger depuis quelques semaines sur notre stratégie, notre mindset (barrières mentales), et sur de l’opérationnel (comment bien déléguer, etc).
N'oublie pas de nous donner ton feedback à la fin de cette lecture. Cela nous aide à améliorer le format.
Co-fondateurs @Gemeos
9 optimisations SEO pour votre site Webflow
1. Ajouter des balises title et des meta descriptions
Affichées dans les résultats de moteur de recherche (SERP), la balise title et la meta description fournissent un aperçu textuel du contenu de votre page.
Quand on sait que le taux de clics élevé est un facteur SEO positif, notre meta description et notre titre doit être convaincant pour le lecteur. Plus les gens cliquent sur votre site Web - plus Google pense qu'il offre de valeur - plus il sera classé.
Balise Title
La balise title est le premier point de contact entre vous et un visiteur potentiel. Gardez-le sous 60 caractères car Google tronque les titres plus longs.
Meta description
La meta description est un résumé de page de texte affiché dans les résultats de recherche. Il doit contenir moins de 155 caractères au risque d’être tronqué.
Pour ajouter une meta description et un title tag sur Webflow, rendez-vous dans Page Settings → SEO settings.
Pages statiques
Pages template (CMS)
Ajoutez 2 champs dans votre collection CMS pour le Title et la Meta Description et utilisez ces variables au niveau de votre page :)
2. Utiliser les balises d’en-tête appropriées (Hn)
Concentrez-vous sur la configuration des balises d'en-tête appropriées (H1 à H6).
Les balises de titre aident à la fois les lecteurs et les moteurs de recherche à traiter le contenu de votre page et à comprendre comment différentes informations sont liées les unes aux autres.
Ils capturent le sujet principal et les sous-sujets au même titre que les chapitres d’un livre.
3. Activer “Minify CSS” et “Minify JS” dans les paramètres
Les débris de code augmentent le temps de chargement de vos pages. Google recommande donc de compresser HTML, CSS et JavaScript dans la mesure du possible.
Pour l’activer allez sur Webflow, rendez-vous dans Page Settings → Hosting.
4. Supprimer les éléments non utilisés
Un des facteurs les plus importants pour être bien référencé sur les moteurs de recherche concerne la vitesse de chargement de votre site.
Supprimer les paramètres CSS pas utilisés
Rendez-vous sur Webflow → Style Selector → Clean Up → Remove all
Supprimer les animations pas utilisées
Rendez-vous sur Webflow → Interactions → Clean Up → Remove all
5. Importer vos polices au format woff.2
Ce format est plus compressé et donc plus léger que les autres formats de polices, ce qui aide à réduire le temps de chargement de votre site.
Importez uniquement les polices que vous utilisez dans votre projet. Pas besoin d’importer toute la famille, au risque d’allourdir votre projet.
6. Ajouter les balises Open graph
Permettant de partager le contenu d'une page web sur les réseaux sociaux les données Open Graph sont un ensemble de balises utilisées pour fournir des informations structurées et riches sur le contenu d'une page d'un site Web.
Il permet ainsi d’augmenter le taux de clic lorsque vos articles de blog sont partagés par vos lecteurs par exemple.
Voici à quoi ressemble un Open Graph une fois paramétré :
Pour ajouter les balises Open Graph sur Webflow, rendez-vous dans Page Settings → Open Graph Settings.
7. Ajouter des données structurées
Les données structurées aident les moteurs de recherche comme Google à comprendre le contenu de votre site. Cela peut améliorer le classement dans les résultats de recherche et rendre vos pages plus visibles.
Elles permettent d'afficher des extraits enrichis (rich snippets) dans les résultats de recherche, comme des évaluations par étoiles, des prix, ou des horaires, rendant votre site plus attractif et informatif pour les utilisateurs.
J’ai rédigé un article détaillé pour vous expliquer comment faire étape par étape
8. Ajouter des balises canoniques
Le rôle majeur des balises canonical est d’éviter que Google ne détecte du contenu dupliqué. C’est une des très mauvaises pratiques en SEO qui pourrait vous coûter cher dans les classements.
En effet, le « duplicate content » est une pratique considérée comme frauduleuse par l’algorithme de Google : elle est sanctionnée en conséquence, en « plombant » significativement la position du site en question dans les résultats de recherche.
Placez votre balise canonical dans la partie < head > de votre code au niveau de la page. Elle prend la forme suivante
< link rel=«canonical» href=« https://votresite.com/page-exemple/» / >
Rendez-vous dans Page Settings → Inside <head> tag
9. Convertir vos images au format WebP
Le format d'image WebP conserve la plupart de la haute qualité d'une image tout en la compressant dans un fichier de plus petite taille. Cela permet aux pages Web de se charger plus rapidement et d'économiser de l'espace de stockage sur le site Web. Vous pouvez convertir vos images directement dans Webflow
Le chemin à suivre :
Rendez-vous dans le panneau Assets
Sélectionnez vos images
Cliquez sur "compresser"
Un accompagnement sur mesure pour aller plus loin
Nous sommes accompagnés avec
depuis maintenant 3 semaines par plusieurs coach pour nous aider à bruler les étapes et atteindre notre objectif ambitieux des 400k€ de CA en 2024Non pas parce qu'on ne se sent pas capable d'atteindre notre objectif,
Mais parce que cela nous prendrait 4x plus de temps d'y arriver.
Pour vous donner un peu plus de détail sur ce en quoi consiste ce coaching et comment il est découpé :
Coaching sur notre stratégie
Définition des actions à mettre en place pour atteindre notre objectif.
Définition de notre Avatar (ICP)
Choix des leviers
Création et marketing de nos offres
…
Coaching sur le mindset
Casser nos barrières mentales
Réussir à déléguer
Coaching opérationnel
Accompagnement sur la partie délégation. Qu’est ce qu’on délègue ? Comment ? Pourquoi ? À qui ?
0ptimiser tous nos process pour gagner en efficience
L'autoroute en Ferrari vs le chemin sinueux en trottinette.
On a choisi la 1ère option
Go enclencher la sixième
Autres contenus de Gemeos
Ajouter un border color à un input lorsqu'il est renseigné dans Webflow - Gemeos Académie
Ajouter un tableau dans Webflow - Gemeos Académie
Enjoy ✌🏼
Qu'avez-vous pensé de cette édition ?
J’ai adoré 😍 | C’était bien 😎 | Peut mieux faire 😐 | Nulle 🙁
Si vous avez aimé cette édition, pensez à la partager à un(e) ami(e) et à ajouter un like en haut du mail
Ça nous donne de la force et nous booste pour les éditions à venir.
D’ailleurs, la semaine prochaine, Sacha vous partagera la puissance de la méthode Qonto pour cartographier l’UX de votre produit et gagner en efficience !
Qu'est ce que Gemeos ?
Gemeos est une agence Webflow composé de 2 personnes :
Sacha | 🧢 Product Designer & Expert Webflow.
Sandro | 🧢 Growth Manager & Expert Webflow
On accompagne les startups et les PME dans la création et l'optimisation de leur site web pour en faire un véritable actif !
Nos offres :
Site Web - Création d’un site web sur-mesure de zero
Migration - Migration de votre site web ou intégration de vos maquettes dans Webflow
À la demande - Un abonnement mensuel fixe qui vous permet d’étendre vos équipes de design et développement sans le processus de recrutement et d’aller chercher l'extra-mile.
Répondez à cet email si vous souhaitez en savoir plus.
- Sandro & Sacha