Static Site Vs Dynamic Site - What are the Main Differences?
This short article outlines some of the main differences between static and dynamic sites particularly in the context of comparing a traditional and Headless CMS.
Co-Founder / CEO
February 1, 2023
This short article outlines some of the main differences between static and dynamic sites. By way of some additional context, the pitch of this article is for non-developers - the aim is to try and break the topic down into constituent elements such that a marketing professional can understand the basic concept.
It is also worth flagging that in this context that 'dynamic' and 'static' refer to how a web page is delivered to the end-user or site visitor.
What is a Static Site?
Content Delivery Network: CDN
A distributed network optimized for serving assets to users. By being geographically distributed, a CDN can provide redundancy and also improve delivery performance as a result of servicing requests from the infrastructure closest to the user making the request.
— Source: Jamstack
Key Points: Static Site
Server-side rendering [pre-built files stored on a web server] and usually cached
Delivered by a CDN
HTML files that load quickly
Files are not altered when shipping to the visitor
Pages look the same to everyone navigating to a page (or URL)
Static files are lightweight (and are thus cheaper and faster to serve)
Security is also enhanced as the content database (Headless CMS) is independent
No interactions with the database
Note: It is important to flag that static does not mean that a website is unresponsive to a user’s actions.
What does all this mean?
It means that the website is likely to be exceptionally quick. In layman's terms the request from the browser is met with a simple response - 'here is the file, I am sending it back'. Because CDNs are used, the request should hit the nearest server to the request which positively impacts load times.
This is a key point - site speed is a vital part of web performance and this is a key motivation when developers select a static site-based architecture over a dynamic one.
Speed is also a significant ranking factor for SEO alongside Core Web Vitals as aHrefs article recently advised:
Page speed is a ranking factor on desktop and mobile. Your site doesn't have to be lightning-fast, just fast enough so that Google doesn't demote your page for offering a slow experience.
Core Web Vitals
Core Web Vitals measure a page’s loading performance, interactivity + visual stability. Google uses three metrics to do this: Largest Contentful Paint (LCP), First Input Delay (FID), and Cumulative Layout Shift (CLS).
In summary, when it comes to a static site the primary benefit is a fast load time in the browser which is of significant importance for some categories of users.
Aside from SEO, conversion rates are also negatively impacted by slow sites which partly explains why major e-commerce sites are moving off legacy platforms to Headless CMSs [What is a Headless CMS?] (which power the content on static sites).
The ‘time to first byte' is also a common measure as to how fast a site is and again a static site outperforms a dynamic site keeping everything else.
What is a Dynamic site?
In comparison, a dynamic site is where the HTML markup adjusts dynamically on the server - so parts of the page can change and are generated on the fly.
Dynamically generated in real-time by the server [Server-rendered]
Leveraging HTML, CSS as well as PHP
Webpages built on the fly in real-time [update content on the fly]
Different content can be served to each different web visitor
Website visitors connect to the content database each time they visit your website
Examples of dynamic sites include WordPress, Drupal, Joomla
What is a Static Site Generator (SSG)?
Web development with static site generators is a hybrid process and an SSG enables you to generate HTML pages during a build process, and deploy them to a server and CDN. These enable you to construct your website locally as usual while compiling it into static files for deployment. As developers create static sites and have alternatives to support the majority of computer languages, they are growing in popularity.
Static Site Generator
A tool which can be run as part of a build to transform content, data, and templates into files which can be deployed to a hosting environment as a ready-to-serve web site.
Popular Static Site Generators
The following represent the most popular static site generators on the market.
Jekyll - One of the most commonly used static site generators. (Ruby)
There is a long list of static site generators on the Jamstack site.
What are the Advantages of a Static Site compared to a Dynamic Site?
Speed/ performance is the main benefit of a Static Site which is why they are becoming popular with websites where optimum performance is a key consideration. They are not as easy to get up and running as say WordPress but once it is live the performance will trump a dynamic site.
It takes us back to a key point when it comes to CMS selection or which site architecture you want to use. The context of the site is a key determinant. A personal website designed as a brochure site where budgets are minimal and traffic expectations are modest will be best suited to a WordPress, Wix, or Squarespace CMS. However, for those companies looking to build high-performing sites with significant traffic and a need to optimize traffic then static sites and Headless becomes a credible route to consider.
Static Sites and Headless CMS
The reason static sites and Headless CMS's work well is that a Headless CMS provides content through an API, and a static site consumes content through an API. An SSG thus allows you to create a static site and can be pre-configured to work with an API to access the content.
Key Points a Marketing Leader Needs to Know
For those working in marketing, the differences between static sites and dynamic sites is unlikely to represent a key discussion that comes up all that frequently. The main points to take away are that there are different approaches to managing websites, and developers will often have strong views as to which route to go down. Like many things it is a case-by-case decision.
Static sites are increasingly popular for those companies where site performance is of crucial importance with speed representing a key factor.
Ultimately, both static and dynamic websites generate HTML files, but what makes a website “static” versus “dynamic” depends on how the server creates this HTML file before sending it to you.
— Source: Juviler, Hubspot
For those working in marketing the concepts of static sites and dynamic sites is a case of getting into the weeds. Your developers will understand the concepts outlined above. In some ways the decision as to which route to go down aligns with the CMS choice and whether you want to choose a Headless CMS like Contento.