18 July 2022

Headless web development: What is it and why use it?

0 min read
Headless web development: What is it and why use it?
Alexander LomasWritten ByAlexander Lomas

Alexander is the Lead Front-End Developer at Propeller, and is responsible for implementing visual elements that site visitors see and interact with within a website.

What is Headless?

In order to understand what Headless is, it’s important to understand what Headless isn’t…

Let’s use a traditional WordPress CMS as an example.

When we build a WordPress website, all of our code is wrapped tightly inside of a WordPress theme folder. We are free to do what we please as long as it’s allowed within the WordPress system.

Headless, on the other hand, de-couples this dependency.

The frontend is built separately and is free from system restraints. It only cares about data and it’s free to get this from wherever it likes; WordPress, Shopify, or any number of platforms. All it needs is an API to consume this data from, which most leading platforms have out of the box.So in summary, a headless CMS is a content management system that separates where content is stored and authored from where it is presented (the “head”). Meaning you get to pick and choose which “heads” (outputs) you send your content to.

Why do we need that?!

When the internet came along, we were only looking at presenting content on a desktop website. Now, businesses are developing websites, mobile apps, digital displays, conversational interfaces and more. Businesses need omnichannel customer experiences.

But because traditional CMS organises content in webpage-oriented frameworks, it’s impossible for the same content to fit other digital platforms or software.

Content housed in a headless CMS can be delivered via APIs for seamless display across any site, device or digital touchpoint.

So what are the benefits?

IMPROVED USER EXPERIENCE

Because headless content is served over APIs, developers can pick and mix different frontend platforms to get the best of everything. Developers can choose the way they want to build their frontend and user experience as opposed to only using the technology provided by the traditional CMS platform.

QUICKER LOAD SPEED

Headless websites often load faster than traditional CMS websites because of the way that content is taken from the CMS, cached and then displayed on the Headless app. Some headless frameworks leverage modern image formats which are lower in bandwidth cost, smaller in size, and faster in delivery. Find out more about why load speed is so important for SEO here.

INCREASED CONVERSION RATES

A headless approach provides the ability to create a more relevant user experience, which in turn impacts conversion rates. And because it makes content development more streamlined, it helps to draw in organic traffic and repeat business.

REPURPOSE CONTENT ACROSS MULTIPLE CHANNELS

When all content is accessible for use on any digital endpoint, digital teams can easily repurpose content across devices and channels.

EDIT ONCE, UPDATE EVERYWHERE

Content is stored in a centralised content hub, meaning content editors only have to change the content in one place and for the change to be applied everywhere the content is located. 

MORE DEVELOPER RESOURCE AVAILABLE

Content editors can update content across all channels without developer support, freeing up developers to tackle more strategically important work.

LESS RISK WHEN REPLATFORMING

Replatforming a traditional CMS meant changing everything at once; your CMS, your frontend and your URL structure. Using a Headless approach, you can build the Headless frontend connected to the old CMS, stabilise your rankings, and then connect the Headless app to your new CMS. Furthermore, Headless apps can mirror the existing URL structure, vastly reducing the amount of time that search engines take to recognise the new website.

ENHANCED SECURITY

By decoupling the frontend from the CMS, we reduce attack vectors. If unauthorised access to the frontend was gained, they wouldn’t be able to access the CMS.

How to Decide

Here are the main questions to ask yourself when deciding whether a Headless CMS is right for you

  • Are you building an advanced user experience with the help of specialist front end developers?
  • Does your project require unique user experiences on different digital platforms?
  • Are traditional CMS platforms too rigid for the project you’re handling?

If you answered yes to the above questions, then a Headless CMS might well be the way to go.

At Propeller, we are a web development agency pioneering the use of Headless CMS. To chat about how we can help make your digital channels easier to manage, faster to load, and more secure with a Headless CMS, get in touch.

Read More

SEO Power Hour

SEO Power Hour

We took an SEO power hour this lunchtime to layout the SEO basics and put some questions to the team. here’s all you need to know!

Read
Mark LillicrappMark Lillicrapp