In recent years we’ve seen a move toward static sites. The term “static” is really a misnomer here, because the type of sites we are talking about are anything but. The term “Jamstack” is tossed around, and may be a better fit, standing for JavaScript, API, and Markup. Unpacking this acronym gives us a better idea of the technology stack we are discussing. Largely these are sites that do not have application logic running behind each request, and exist only as static HTML pages decorated by JavaScript. The question we want to answer here is what are some of the real-world advantages to building a site in this manner, and namely, how can we use this technique to increase our SEO scores?
Headless sounds bad. Why it’s good.
A headless CMS (content management system) is for all practical purposes a library for your content. Blog posts, page content, images, company testimonials, whatever content you want to store can all be modeled and saved in the headless CMS of your choice. How the headless CMS differs is that is has no presentation layer. No “preview this page” button. The content that you have stored in the headless CMS is access via an API (application program interface) call.
What's great about this set up is that your content can be sliced, diced, linked, and tagged in any way you want. You have complete freedom to design you own content models and internal structures. You also have complete freedom in how you want to present this content to your users.
CSR, SSR, SSG and more ancronyms than you need.
Just to level set here, there are a BUNCH of different ways that a developer can generate the HTML markup that is delivered to a users browser, all with varying degrees of impact on SEO scores. Here's the rundown of the different methods. If you find this all a bit too pedantic, jump to the next paragraph to get to the good stuff.
CSR - (Client Side Rendering) CSR typically is used when you have a javascript library that assembles HTML code on-the-fly, in the user’s browser. This type of rendering is very performance intensive for the browser, and extremely difficult for web crawlers to parse, which make it a terrible strategy for SEO purposes. This type of rending is best left to web applications that do not need to be indexed, but need native application like web experiences.
SSR - (Server Side Rendering) SSR is the bog standard website rendering technique. The web page is assembled on the server, via a complex dance of cookies, sessions, database calls and application logic. WordPress and other platforms all run on a SSR style stack. This is your SEO middle ground. The HTML on the pages is able to be crawled effectively, but ultimate performance will suffer due to the time it takes to assemble your pages.
SSG - (Server Side Generation) This is the holy grail for SEO. Here is how it works: The entire website is built in advance, and delivered to the server. All of your pages, all content, every possible combination of content is generated, and then delivered to the web server. Page interactivity is handled by on-page JavaScript, with possible calls to API services for such things as form submission, and site search.
The impact of SSG on SEO
The impact of SSG on SEO cannot be overstated. By rendering your pages before deployment to the server, and serving those pages with an aggressive caching policy, you can reach unheard of
levels of performance, and all with total control of the UI/UX. Since there is no round trip to the server, no database, and all of the business logic predetermined, there is really nothing to prevent your webpages for loading as fast as the network can manage. Here at Curious Minds, we are regularly seeing static site speeds in the top percentile.
How does a Headless CMS factor into SEO?
In a typical SSG site deployment strategy, The headless CMS is queried during the build process. This setup allows developers to assemble pages from any combination of content stored on the Headless CMS. The build process iterates over content collections, assembles pages, and can even assemble and submit a sitemap. When you need to update content, you would simply update the CMS and then run that build process once again.
How does this help me?
Next time you are looking to refresh your website, consider building a JamStack-powered web presence, to benefit from the SEO increase given by using SSG combined with a headless CMS. This is especially true if your website consists primarily of marketing content and contact forms. (Blogs work extremely well here too, but you need to have a site search strategy in place.)
Give us a call here at Curious Minds, and find out about our headless cms development solutions and professional SEO services, as well as our expertise in custom JavaScript development. Our experienced developers can create custom JavaScript solutions that fit your specific needs and improve the functionality and user experience of your website. Contact us today to learn more about how our services can help grow your business.
