Have you noticed your website is ranking lower in search results recently? Do you think your SEO (search engine optimisation – aka ‘making Google happy) has taken a dip? Your website’s speed could be to blame, but we don’t just mean how fast it appears to the user…
Quick Links –
- Why is website speed important?
- What is a good page speed score?
- How can I provide a fast user experience?
- What is Headless CMS?
- How does Headless work?
- Why Should I Convert to Headless CMS?
- Will my existing website be affected by converting to Headless?
- How long does it take to implement Headless CMS?
Why is website speed important?
A big part of Google’s algorithm that determines your search result ranking centres on your website’s speed. Google analyses how fast your website loads in certain conditions from start to finish, and the websites that load fast are gifted with a high web speed score.
Traditionally, the speed of a website was the speed in which it loaded pages and responded for a user. However, in 2021 Google changed the way they record and determine web speed, changing their algorithm to analyse five areas:
- First Contentful Paint:
Measures the time from when the page starts loading to when any part of the page’s content is rendered on the screen - Total Blocking Time:
Measures the amount of time tasks were blocking your browser’s main thread - Speed Index:
Measures how quickly content is visually displayed during page load - Largest Contentful Paint:
Measures the time from when the user initiates loading the page until the largest text or image block is rendered within the viewport - Cumulative Layout Shift:
Calculates the shifting of elements while the page is being downloaded and rendered
What is a good page speed score?
A Google Page Speed Score above 70/100 is deemed good, but it’s important to note that this doesn’t guarantee that the website will provide a fast experience for the user. Equally, a fast website from a user perspective doesn’t mean it will score highly with Google.
Some big-name websites have low Google Page Speed scores, despite seeming to load fast to the front-end user. ASOS for example ranks approx. 35 – 60/100 with Google as the website code does not satisfy the speed algorithms, yet their website loads fast and provides a good user experience for customers.
How can I provide a fast user experience?
ASOS provides the user a fast experience by using caching technology to render their website. Their website loads fast as the front end was created using ‘Headless’ development – their front-end loads before the back end, and data is pulled in from the backend of the CMS only when it is needed through API calls, rather than pulling the back and front end together simultaneously, which is a bulky process that can take time and cause frustration for the customer.
There are different frameworks that companies can use for Headless CMS development. On of the most popular is React JS. React was developed by Facebook after encountering an issue on their platform; with servers around the world and billions of people posting content, how do they serve the content so fast?
Introducing, Headless!
Facebook solved their speed issue by developing the React framework for a headless front-end, first deploying it on Facebook’s News Feed and later Instagram. They have since released the technology to companies to use on their websites.
A headless CMS is a content management system that allows you to manage and distribute content across multiple channels, such as websites and mobile apps, without being tied to a specific presentation layer. It addresses the challenges of efficiently updating complex UI components in real-time, providing a smoother user experience.
Tell Me More
How does Headless work?
A headless CMS separates the presentation layer (where content is presented) from the backend (where content is managed). It allows you to upload and manage content in one place and to be able to deploy that content on any digital channel you choose. Separating the front and back end of a website allows marketers to manage content independently, and for developers to build faster, automate changes and manage at a digital scale.
Why should I convert to a Headless CMS?
Headless allows for more flexibility in creating the front end of an eCommerce website as developers can use any programming language stack they want to build the front end. It upgrades and optimises your website without worrying about the backend and security issues affecting the front end that will compromise performance.
Vitally, headless allows you to give your users a fast experience when browsing your website, leading to better conversion rates and happy customers!
Does converting to a Headless CMS affect the admin of my website? Will new content automatically convert?
No, converting to a Headless CMS system will not affect the admin of your website, and new content will automatically convert.
How long does it take to implement?
It’s dependent on the size of the website but typically takes between 8 and 18 weeks.
Are other companies doing this/is it becoming common practice?
Yes, Headless is now best practice. So much so that no new website should be built without it!
Will Headless CMS help my Google Page Speed Score?
No! Headless will transform your website speed from the user point of view, but it wont increase your Google Page Speed Scores. To increase your favourability with Google, you should perform technical updates to your site that meet the criteria laid out in the 5 key areas of Google’s algorithm.
Our recommendation to all businesses, but eCommerce businesses especially, is to convert your website to a headless front-end using the React technology as well as updating the technical aspects of your site that will help boost your search rankings. These updates will allow you to provide a seamless, lightning quick experience for your customers, reduce bounce rates and increase sales conversions, whilst all the time making Google happy.
If you need any help or advice concerning your website’s speed, headless development, or Google Page Speed, please get in touch.
