When it comes to building a website, it can be confusing trying to distinguish between all of the possible solutions and technologies that are laid out before us. As such, I wanted to write this article to help clear up the mistakes made by others who've written about this topic. I'll be reaching out and referencing a number of sources within this article in the hopes that it helps you, the reader, gain a better understanding of how Static Site Generators vs Flat File CMS.

Static Site Generators

How does a static website work?

Static websites do not generate content on the fly. This means that when a users visits the page, the content that is displayed is pulled directly from a file and does not require compilation or generation prior to showing up in the browser.

A great analogy that I read over on David Walsh's blog is to consider a static website like a newspaper. Once it's printed, you simply open it and read it exactly as intended with no need to wait. The newspaper is already on your step, waiting to be read whenever you choose to pick it up.

This is essentially how a static site generator works. The content is usually stored in a flat file format as opposed to a database and uses templates to generate the structure of the page. This means you receive a pure HTML file when visiting the page as opposed to waiting for the database to generate it on the fly.

So what does a Static Site Generator do?

Static site generators expand on static websites to make them more appealing to developers and offer several benefits. In a nutshell, most static site generators offer the following features:

Templates

Most static site generators offer an easy means of templating a website by allowing it to be built more easily using layouts and templating engines. Jekyll, for instance, uses the Liquid templating language to process templates.

Markdown Languange or reStructuredText (or alternatives)

Instead of having to write your content in HTML, most static site generators offer the ability to write it using Markdown or reStructuredText. Markdown is incredibly popular and tends to be used by the majority of the top static site generators due to how easy it is to compose content with and has increasingly grown in popularity over the years.

The obvious advantage to Markdown is explained best in this excerpt from Daring Fireball (linked above):

Markdown is a text-to-HTML conversion tool for web writers. Markdown allows you to write using an easy-to-read, easy-to-write plain text format, then convert it to structurally valid XHTML (or HTML).

This basically means you are not changing from the plain text format but rather adding basic formatting which is translated quickly into HTML.

Other Functions

Static site generators also perform a host of other functions such as integrating meta data into content and often incorporating minification functionality and other capabilities.

How do you use a Static Site Generator?

Most static site generators that I am aware of use a command line user interface. There is always a possibility to add on a Headless CMS to the fray should you wish to use a more traditional style admin interface that you might be accustomed to if you are moving from WordPress or another similar CMS. The important thing to remember here is that a Static Site Generator is NOT a CMS. It offers you a command line interface to edit files and push them to your site.

There are plenty of ways to get started with a Static Site Generator. Github Pages; for example; offers a relatively straight forward means to get a website up and running with Jekyll, one of the most popular Static Site Generators.

Flat File CMS

How does a Flat File CMS work?

Flat-File CMS‘ do not require a database but rather, they save their data to a set of text files which are, in turn, organized into folders. You simply create Markdown files in the content folder and those files become your pages. (Note: not all flat file CMS use Markdown, some use other languages but Markdown is the most common).

So what does a Flat-File CMS do?

A Flat-File CMS provides you with an administrative interface that allows you to manage your data in a manner similar to what you'd come to expect from products like WordPress or other popular database driven CMS.

For example, here's a quick look at Grav's interface, which is a flat file CMS:

You'll notice that the interfaces are quite similar to what you'd expect. The difference, however, is that these CMS do not require any connection to a database but rather just a set of folders on a host or on your local machine.

Admin Dashboards

Most Flat-File CMS provide a dashboard or administrative interface with which users can manage their websites. This means there is typically a configuration section which provides an interface to modify configuration files, amongst other things.

Writing and Editing Content

Another common function of a Flat-File CMS is to provide an interface for users to write and edit content within the CMS. Typically, a WYSIWYG (what you see is what you get) editor is provided to work in either Markdown or similar structured content.

To summarize, I think it's safe to say that they provide a means by which you can work with your flat file structure and content if you prefer not to edit files directly yourself using a text / code editor (whether that makes them better alternatives to editing directly is entirely based upon personal preference).

How do you use a Flat-File CMS?

You download them from the website and unzip and upload them to your web host just like you would a standard self hosted CMS (unless of course you are using a cloud based flat file CMS, in which case you would simply sign up on their website).

Here is a list of some popular Flat-File CMS.