EN

Headless CMS and SEO: a powerful mix?

Lucas Perrosé . May 9, 2021

Headless CMS have, for a few years now, been on the rise thanks to the numerous advantages in terms of development and animation that they promise. The many solutions available on the market today contribute to the democratization of headless CMS, but it remains to be seen whether they are compatible with SEO requirements.

What is a headless CMS?

Classic content management systems such as WordPress or Drupal are called coupled CMS. These solutions manage both the writing of data in the database, their editing via a user interface and the distribution of this data to end users (display of content). A website built from a traditional, coupled CMS is entirely dependent on the latter for its administration. Using WordPress, for example, each action on the website (creating a page, modifying the design of some templates,…) implies to follow rules and constraints defined by the very functioning of the CMS.

fonctionnement cms couplé
A traditional CMS is linked to the back-end, the front-end and the database @Storyblock

A headless CMS separates the data (back-end) from its presentation (front-end). The system responsible for editing the content of a page is not the one responsible for its display to the end user. The headless CMS focuses only on the data of a site, it does not allow to manage the presentation of these data, which requires APIs allowing to transfer the different contents of the CMS to the user.

fonctionnement headless cms
Headless CMS separates back-end from front-end @Storyblock

Headless CMS: pros and cons

The main argument in favor of headless CMS is flexibility. On the one hand, since the presentation of content is no longer constrained by the management system, developers can code in modern languages (JavaScript) without worrying about the limitations of coupled CMS. On the other hand, headless CMS are designed to distribute the same content on a multitude of devices: website, application,… It is thus easier for a brand to relay the same content on different devices, with a format always perfectly adapted. Finally, since the distribution of the data is managed by API, it is possible to easily modify the presentation of the different contents of a site or an app without the need to edit them in the back office.

Headless CMS also have several disadvantages that can, depending on the project, make them less appropriate than traditional CMS, starting with the content preview that is often not native and can be complicated to obtain. Similarly, it is not possible to format content from a WYSYWYG interface (as a solution like WordPress offers) since, by definition, the back end is separated from the front end in a headless architecture. Most of the modules proposed by coupled CMS are also not available natively in a headless CMS, which can impact the development time and cost. Finally, the development of the front-end in SPA or full JavaScript poses serious SEO problems (see below).

The main Headless CMS solutions

Many players have positioned themselves on the headless CMS segment. Among the main ones, we can mention: Sitecore, Front-Commerce, Contentful, Sanity, Strapi, Magnolia, Contentstack, Netlify, Kentico Kentent,… Also noteworthy are solutions such as REST API (WordPress) and RESTful (Drupal), which can transform a coupled CMS into a headless CMS.

SEO challenges of headless CMS

A headless CMS has advantages and disadvantages for SEO optimization. If it can natively present high risks to the positioning of a site in search results, it also offers benefits with regard to current ranking criteria.

Headless CMS and SEO: the benefits

The flexibility mentioned above, a strong argument in favor of headless CMS, is also an asset for SEO. As the front end can be built without the constraints of the back end, it is possible to build a site perfectly optimized for search engine bots. Be careful though, this strength of headless CMS is also a weakness (see below). If it is in theory easier to deploy advanced SEO optimizations on a headless CMS, it requires specific preparation and may require development time.

Another SEO advantage of headless CMS is the loading performance. Sites developed with these solutions usually have good speed scores, which helps bots crawl them and improve their ranking in search results. And as Google prepares to integrate Core Web Vitals speed criteria into its ranking algorithm, the issue of website performance remains fully relevant.

google core web vitals
Google’s new performance criteria: Core Web Vitals

Headless CMS and SEO: the drawbacks

Headless CMS present two major SEO issues. The first is the impossibility to edit natively tags that are crucial for SEO such as the title, the alt attribute of an image or the meta description of a page. If most solutions provide modules to optimize these elements, their implementation is therefore essential from the construction phase of the site via a headless CMS.

The second SEO difficulty is related to the JavaScript language, often used in addition to headless CMS by development teams quick to use modern programming languages. However, as JavaScript is still difficult to interpret by Google (and not at all by other engines), a site developed from a headless CMS could be unreadable and not explorable by bots, and therefore unable to be positioned in search results. This problem, identical to the one posed by SPA (Single Page Applications), requires the implementation of a pre-rendering service (SSR, SSG, ISR…), which will translate the contents of the site into a standard HTML format readable by bots.

google javascript crawl
The process of interpreting JavaScript by Google can be very resource intensive, which is not always available. Offering an HTML version to bots allows them to read and explore the content immediately.

Native, a headless CMS is not SEO friendly: specific developments will be necessary to integrate optimizations, even the most trivial ones usually covered by classic CMS. Migrating from a coupled CMS to headless without SEO validation could therefore have heavy impacts on the positioning, traffic and organic revenues of a site. However, with embedded SEO logic from its conception, a headless CMS could reach a higher level of optimization than what a traditional CMS could offer, thanks to an unmatched flexibility in terms of development.