Guide du débutant pour le CMS headless

1 février 2022 - 9  min de lecture - par Dan Taylor
Accueil > SEO Technique > Passez d'un CMS couplé à un CMS Headless

Le CMS headless (systèmes de gestion de contenu) supprime le lien direct entre le back-end de votre base de données de contenu et la manière dont ce contenu est présenté aux utilisateurs lorsqu’ils visitent votre site web ou votre application.

En comparaison avec les CMS traditionnels « couplés », où la base de données et le rendu du contenu sont contrôlés par le même CMS.

Si un CMS “couplé” a ses avantages, comme une interface unique pour modifier à la fois votre base de données et la façon dont elle apparaît à l’écran, le CMS headless est plus puissant et plus souple.

Cela est particulièrement vrai pour les sites Web de grande taille, les bases de données complexes ou lorsque plusieurs personnes doivent travailler sur différents aspects de votre contenu, de votre site Web/application et du SEO sur site.

Qu’est-ce que le CMS Headless?

Dans un CMS traditionnel, la base de données de contenu et la conception du site Web peuvent être modifiées à partir du même tableau de bord du CMS, c’est pourquoi ces systèmes sont dits « couplés ».

Un système CMS headless utilise des systèmes distincts pour la base de données et la livraison, une API (« Application Programming Interface », Interface de Programmation d’Applications) servant de passerelle entre les deux.

Parmi les CMS headless les plus couramment utilisés figurent Ghost, Prismic, Netlify et Contentful. Comme les CMS “couplés”, ils ont été conçus pour fonctionner efficacement, offrir une fonctionnalité flexible et évoluer rapidement lorsque votre base de données commence à croître.

Le CMS headlesspeut être plus coûteux, en raison de sa plus grande complexité, mais il offre des capacités qu’un système “couplé” ne peut pas offrir, comme la possibilité de présenter le contenu d’une manière complètement différente aux visiteurs qui accèdent à votre site depuis différents appareils.

Cela a des répercussions positives sur les techniques d’Optimisation des Moteurs de Recherche (SEO), comme la conception de sites Web réactifs, car votre contenu peut être diffusé de manière beaucoup plus adaptée, en fonction de la plateforme, et véritablement adaptée aux mobiles.

Plus d’avantages au CMS headless

Examinons certains des avantages spécifiques du CMS headless, qui contribuent à la popularité massive et à l’adoption rapide de cette approche sur les sites Web du monde entier :

Contenu personnalisé

Un contrôle plus précis de votre contenu et de la façon dont il est affiché signifie que vous pouvez personnaliser vos pages dans une plus large mesure. Que vous le fassiez pour des groupes d’utilisateurs spécifiques ou pour l’ensemble de votre public, cela vous donne encore plus de moyens de vous démarquer de vos concurrents.

Un chargement plus rapide

L’utilisation d’une API et d’un front-end adaptés aux appareils optimise les vitesses de chargement sur différents appareils, y compris ceux qui accèdent à votre site via une connexion de données mobiles. Cela permet également de soutenir toute action que vous entreprenez dans le cadre de campagnes de SEO afin d’améliorer les performances de vos Core Web Vitals.

Une flexibilité à l’épreuve du temps

La possibilité d’installer des API supplémentaires signifie que votre base de données peut être connectée à de nouveaux « front-end » à l’avenir. Cela peut vous permettre de vous diversifier, par exemple, en passant d’un site web desktop et mobile, à des écrans d’information en magasin et à des technologies portables.

En résumé, un CMS headless est idéal lorsque vous avez des besoins front-end complexes, mais que vous souhaitez simplifier l’édition et la tenue à jour de votre contenu réel, avec les modifications et les mises à jour étant immédiatement répercutées sur toutes vos différentes plateformes.

Comment planifier un CMS headless

La modélisation du contenu est l’étape cruciale de la planification avant la mise en œuvre d’un nouveau CMS headless. Elle est similaire à la façon dont vous planifiez la hiérarchie des dossiers, la structure des URLs et le plan de site d’un site Web, sauf que dans ce cas, vous travaillerez avec des types de contenu plutôt qu’avec des pages individuelles.

Quels sont les types de contenu ?

Les différents types de contenu que vous définissez contiennent des champs qui extraient des informations de votre base de données. Il peut s’agir de métadonnées de référencement, et si vous utilisez un CMS “couplé” traditionnel avec un plug-in SEO comme Yoast, il est probable que vous ayez vu et rempli des champs de métadonnées dans le passé.

Sur vos pages de contenu principal, vous pouvez avoir des champs pour le slug de l’URL, ainsi qu’une ou plusieurs sections de contenu visible à restituer sur la page.

Vous pouvez également définir des types de contenu pour les ressources multimédias, en donnant à vos fichiers un nom, une description qui ne peut être vue qu’en interne, et un emplacement où le fichier peut être consulté.

Comment fonctionnent les types de contenu ?

Une fois que vous avez défini tous les types de contenu requis, vous avez construit une méthode modulaire de « blocs de construction » grâce à laquelle les API peuvent extraire des informations de votre base de données et les assembler pour différentes plateformes.

Les API peuvent solliciter des données provenant de différents types de contenu et les construire de manière totalement unique pour restituer les pages d’une manière spécifique à la plate-forme.

Si vous devez apporter des modifications à l’avenir, par exemple pour ajouter une nouvelle méta-balise SEO, vous pouvez mettre à jour le type de contenu pour créer le champ nécessaire dans chaque élément pertinent de votre base de données.

Comment définir les exigences en matière de SEO ?

Il est bon de définir les exigences en matière de SEO pour les CMS headless avant d’aller trop loin dans le développement, afin que vos développeurs sachent ce qu’ils doivent mettre en œuvre.

Voici quelques éléments à prendre en compte :

  • Slug URL (qui peut être associé à un mot-clé pour chaque page)
  • Métadonnées (par exemple, les balises « titre », « description » et « mots-clés »)
  • Balises canoniques (pour éviter les pénalités liées au contenu dupliqué)
  • Balises meta-robots (pour éviter le crawl indésirable des pages)

Vous pouvez également créer des champs pour certaines des méthodes les plus modernes et des vérifications spécifiques aux services qui contribuent à soutenir votre SEO :

  • Microdata, microformats et balisage Schema.org
  • Balises de vérification pour Google Analytics, Search Console et Bing Webmaster Tools
  • Balisage pour les aperçus de réseaux sociaux (par exemple, Twitter Cards)

Encore une fois, tous ces éléments influencent la façon dont votre contenu est trouvé et s’affiche sur différentes plateformes (dans ce cas, les sites Web et les applications de tiers). L’inclusion de ces champs vous permet de garder le contrôle sur la façon dont les gens voient votre contenu, peu importe où ils le trouvent.

De combien de types de contenu ai-je besoin ?

Décider du nombre de types de contenu à utiliser est l’une des grandes questions du passage à un CMS headless, et la réponse est que cela dépend de ce que vous essayez de réaliser.

Pour obtenir les meilleures performances de SEO, vous devez définir des champs qui couvrent chaque paramètre. Par exemple, vous pouvez avoir un champ pour la méta-balise robots follow/nofollow, et un autre pour robots index/noindex.

Limites et exigences

Les CMS headless tels que Contentful vous permettent également de limiter le nombre de caractères des champs, afin que les balises de titre et autres métadonnées ne dépassent pas un certain nombre de caractères.

Enfin, vous pouvez rendre les champs obligatoires et uniques. Ainsi, si des métadonnées sont reproduites à partir d’une autre page ou manquent complètement, l’éditeur recevra un message d’erreur et pourra apporter les corrections nécessaires.

Que vous utilisiez plusieurs champs dans un seul type de contenu ou que vous utilisiez des types de contenu distincts pour une plus grande flexibilité au niveau du rendu dépend en partie des capacités que vous devez prendre en charge, et en partie de vos préférences personnelles.

Mise en place

Vous pouvez considérer cela comme la construction d’un puit à souhaits. Plus les briques sont grosses, plus la construction sera rapide et facile. Mais plus les briques sont petites, plus la forme circulaire sera parfaite.

Le « bon nombre » de types de contenu doit être un compromis intermédiaire qui vous convient le mieux, afin que vous puissiez construire le site Web que vous souhaitez, sans avoir l’impression de devoir modifier chaque paragraphe, chaque en-tête et chaque méta-balise individuellement.

Qu’en est-il du front-end ?

De la même manière qu’il existe plusieurs CMS headless back-ends courants, il existe également d’excellents frameworks frontaux parmi lesquels choisir.

Deux des meilleurs sont React et Vue, et ces frameworks modernes ont, une fois de plus, été conçus pour fonctionner efficacement, charger rapidement le contenu et offrir la meilleure expérience utilisateur aux visiteurs de votre site web.

N’oubliez pas de prendre en compte les aspects techniques. Par exemple, le pré-traitement de votre contenu peut garantir qu’il soit entièrement visible pour les crawlers des moteurs de recherche, qui pourraient ne pas être en mesure de « voir » le contenu s’il est affiché côté client à l’aide de JavaScript.

Considérations finales

Une fois votre CMS headless installé, assurez-vous qu’il soit correctement audité par des développeurs web réputés et surtout par des experts en SEO, afin de vous assurer que vous n’avez pas manqué un détail technique qui pourrait affecter votre positionnement dans les moteurs de recherche.

La prolifération d’URLs dynamiques pour des éléments tels que les catégories de e-commerce, les différentes tailles et couleurs d’un produit et la pagination des résultats est un exemple de ce phénomène assez courant avec les API.

En rendant toutes ces URLs visibles aux robots des moteurs de recherche, vous risquez d’épuiser leur budget de crawl avant qu’ils ne trouvent le contenu statique de votre site, qui a plus de valeur.

[Étude de cas] Gérer le crawl du robot de Google

Avec plus de 26 000 références produit, 10001pneus avait besoin d’un outil fiable pour surveiller leur performance SEO et s’assurer que le budget de crawl de Google était bien dédié aux bonnes catégories et aux bonnes pages. Découvrez comment OnCrawl les a aidé à contrôler le comportement de Google et à optimiser le budget de crawl du sites e-commerce.

Encouragez vos développeurs à mettre en place des URLs statiques lorsque c’est possible, et à utiliser les méta-balises des robots implémentées dans votre CMS headless pour bloquer l’accès aux pages dynamiques indésirables.

Perspectives d’avenir

En tenant compte de tout ce qui précède, vous pouvez créer des bases de données de sites web complexes et complètes qui peuvent desservir des sites desktop, des sites et des applications mobiles, des haut-parleurs intelligents, des smart speakers, des écrans d’information en ligne et beaucoup, beaucoup d’autres types d’appareils via l’Internet des objets.

Les travaux de développement futurs peuvent donner lieu à des mises à jour instantanées sur les nombreux appareils et plateformes pour lesquels vous publiez des données, ce qui permet un retour sur investissement plus rapide et plus positif de vos campagnes de SEO et de contenu.

Tout comme la séparation du contenu et de la conception qui est apparue avec les Feuilles de Style en Cascade (CSS) au début des années 2000, le CSM headless vous offre un moyen plus précis de définir, d’éditer et de restituer votre contenu, vous aidant ainsi à atteindre vos objectifs de SEO et de e-commerce d’une manière mieux gérée à mesure que vous construisez votre base de données au cours des mois et des années à venir.

Dan Taylor est Consultant SEO & Account Manager chez SALT.agency, en Angleterre. Il est passionné de SEO et de communication, adore profiter du plein air et Netflix.
Sujets en lien :