Creating a website is essential for establishing yourself online and attracting others to interact with you, whether for communication, marketing, or sales.
While “dynamic” websites are by far the norm, static websites are becoming popular again because they allow you to move the execution of code out of the live version of the website and more behind the scenes, offering specific security and technical advantages. They also have the advantage of being low on resource consumption.
Static website generators are the software that accomplish this, often using many of the same
You can also use specific software to generate a static website. These are called static website generators because they do just that—generate a static website.
What is a static website?
Originally, all websites were static and you either had to write your own website code, or use a limited number of website builders. With these, the website would be generated by software installed on an individual computer and then uploaded to the hosting to be used for that site.
Then, the rise of dynamic websites brought website design and editing itself online. With CMSes like WordPress installed on a website, not only could website owners create pages that would include regular updates, they could edit their website online. Later, WYSIWYG website editors also helped normalize the idea that a website could be built and edited online.
Dynamic websites may have become the norm, but the value of having a static website is also now more clear. Specifically, by executing the code to generate a webpage before a visitor visits, you can guarantee faster load times and avoid being the victim of exploits of your website code.
That’s created the perfect opportunity for the rise of a new batch of static website generators. And we’re here to run down a list of the best.
Why use a static site generator instead of a CMS?
First, let’s talk about what the advantages of using a static site generator are as opposed to using a CMS.
For that, we need to understand a little bit better the difference between a CMS and a static site generator. A CMS utilizes databases, code, and HTML templates to produce the webpages of a website “on demand.” Take, for example, the classic case for a CMS: a blog. At its most basic, a blog consists of a website that displays regularly updated content in the form of new posts.
A blogging CMS, then, would enable certain users—authors—to enter information about a new post into its software. This would include the title of the post, the body of the post, the author, the date, etc. The information the author of this post enters into the CMS for an individual post is then stored in a database, also hosted along with the website. So the blog post’s content, author, date, etc. would all be stored together in the website’s database.
The CMS would also have a number of pages built out in HTML. For this example, let’s just consider the Home page, and let’s imagine the homepage consists of a logo for the blog, a menu that links to other pages on the website, and the three most recent blogposts. This homepage would be stored as a kind of template. The static elements of the page, like the logo and the menu, would be “hardcoded” into this template for the homepage.
Then, where the page’s content goes, there would be executable code that tells the CMS to query the database where the blogposts are stored, retrieve information related to the most recent blogposts (title, author, body, etc.) and insert them into the homepage HTML where appropriate.
That means that, essentially, whenever a website visitor visits the blog’s homepage, the CMS must do some processing—it has to execute some code that queries the CMS’s database—to generate the blog’s homepage, more or less on demand.
A static website generator still uses software to assemble webpages, however it doesn’t do so whenever someone visits a particular webpage, like with a CMS. Instead, a static website generator generates pages ahead of time. That is to say, you can still build your website’s pages “dynamically,” piecing together different elements to form the final product, but the pages will be generated when you create them and served as HTML to your website’s visitors, rather than a page with executable code on it, like with a typical CMS page.
What are the best static website generators?
Your choice of static website generator is most likely going to come down to what language/framework you prefer to work with. This is a major consideration when thinking about how you’ll build your static website.
Without further ado, let’s take a look at what kinds of options exist out there for generating a static website and which ones are the best for which kinds of situations. Here’s our lest of the best static website generators (in no particular order).
1. Hugo
Known for both its flexibility and its speed, Hugo is a popular static website generator. It also has the advantage of being open source, in this case written in Go.
Hugo comes with a number of templates that facilitate your SEO, analytics, and more. You can use these to quickly design and create your website and it supports a number of different types of content using a markdown syntax and shortcodes. In essence, you start with a directory of content, select a template for it, and Hugo renders all this into a full website, in HTML.
Since it’s open source, you can also find it on GitHub, with several forks.
The main disadvantage that Hugo has is that because it uses the Go programming language, it’s not as accessible and less templates are available for use with Go.
2. Jekyll
Jekyll is best known as the engine behind GitHub Pages. As such, Jekyll is well known among developers and carries a good reputation. That also means it’s often used for project pages and developer blogs.
With Jekyll, you write your content in Markdown, and Jekyll converts this into webpages using a template.
Jekyll produces frontend code, meaning that there’s no need to include a JavaScript framework and makes it possible for users to completely control the JavaScript sent to the browser.
The main downside to Jekyll, similar to Hugo’s, is the programming language it uses. In this case, Jekyll uses Ruby, which has been waning in popularity, so it may not be as accessible for those unfamiliar with the language.
3. Pelican
Pelican is another open-source static site generator which uses Python and supports both Markdown and REST syntax.
Because it uses Python, it’s accessible to many of those who are already familiar with this programming language.
However, the main disadvantage to using Pelican is that there aren’t many themes available—only about a hundred or so.
As with the other static site generators, if you don’t know the language Pelican uses (Python), the learning curve can be a bit steep as well.
4. Gatsby
The main advantage of Gatsby is that it uses React. This means you potentially have a wider array of features that could be integrated into your website templates.
This is also, perhaps, its weakness. Along with having to know React, Gatsby requires at least some working knowledge of JavaScript as well as npm. That makes the learning curve for Gatsby steeper than other static website generators on this list, provided you’re not already familiar with these.
5. WordPress
When we were discussing the difference between dynamic and static websites, we used WordPress as the example of a CMS that produces a dynamic website. However, one of WordPress’s great strengths as a CMS is its immense flexibility, thanks to the vast array of plugins available for WordPress.
And it’s plugins that make it possible to turn WordPress itself into a static website generator as well.
The main advantage of using WordPress this way is that these plugins generally just use WordPress’s already user-friendly interface to generate websites that are just not produced live.
The disadvantage is that you’re still tied to using the WordPress interface and features online, meaning that some of the advantages of using a static website generator.
a. WP2Static
WP2Static is a WordPress plugin that essentially creates a snapshot of your WordPress website. This way, you can create new pages using WordPress’s usual interface and find a static version of your website in the directory assigned to it.
b. Simply Static
Simply Static works similarly to WP2Static, but as the name implies, it’s just a little more simple, with perhaps not as many features as the former static site plugin. What Simply Static lacks in features, though, it makes up for in nimbleness. Simply Static is known for being more simple and direct, and “crawling” more quickly, meaning Simply Static will scan your website and create a copy of it more quickly.
Conclusion
While all websites used to be static until the advent of dynamic websites using software like CMSes, today’s static websites are a modern option for businesses and individuals if you use a static website generator.
Overall, static website generators provide greater security and quicker load times than dynamic websites while providing the same features you might expect from a traditional, dynamic website.
The main downside is that most static website generators require some coding knowledge. And this is where the ups and downs of specific static site generators come in—if you know the language a particular static site generator uses, you’ll feel far more comfortable building out your website with it. If not, you may find it much more difficult, especially if you have no coding experience at all.
However, you could use some plugins available for WordPress to transform your WordPress website into a static website generator. This approach involves minimal code, but it lacks some of the advantages of other static website generators.
Tagged in Wordpress
