Why I built my site with a static site generator and why I design client sites for WordPress Part 1
At the beginning of the year, I began a project to redesign my website. My previous site was a single PHP page without a blog. But I needed to migrate content from another site, where I had been blogging, into my personal website. I also needed to complete this migration in only 8 weeks.
As I saw it, my choices were to:
- Create a WordPress site with either a custom template or a purchased one
- Migrate to a platform that provides both web hosting and a web builder tool, such as Squarespace, where I could set up a site with a blog quickly
- Create a static website with a static site generator
Despite my experience with WordPress and with a platform similar to Squarespace, I chose a static site generator.
Why not WordPress?
I decided against WordPress for several reasons. One of those reasons was that I didn’t want to purchase a template—the most expedient solution to my problem.
There are many wonderful templates available for purchase, but using a template designed by another seemed a little disingenuous to me as a web designer.
I have some experience developing a WordPress template from scratch, but for reasons that I’ll explain in the next article, I didn’t want to develop a custom WordPress template either.
In part two, I’ll outline the reasons why WordPress isn’t for me, but is still one of the best options for my clients.
Why not Squarespace?
A website builder, such as Squarespace, is more than a web building tool. It’s a platform that provides the convenience of a web host with a built-in website builder. Many website builders, including Squarespace, also support blogging and ecommerce.
Squarespace is probably best known for providing beautifully designed, responsive web templates that you can customize. However, one of the common complaints that I read online is that you aren’t allowed a lot of flexibility with the templates.
In the future, I may take the time to learn more about their developer platform if Squarespace continues to grow. But aside from the template limitations, I have two other concerns with Squarespace: cost and content ownership.
Squarespace’s entry level offering starts at $8 per month billed annually or $12 per month billed monthly, but you’re limited to only 20 pages with their entry level plan. It’s not clear from their website if those 20 pages include blog posts.
If you exceed the 20 page limit, then you have to upgrade to the next level offering, which starts at $18 per month billed annually or $216 per year. With my current web host, I spend only $9.95 per month billed annually. Squarespace could cost me almost $100 per year more than I currently spend.
With platforms like Squarespace, content ownership becomes a gray area. As a content creator, you own the copyright to your content, but retrieving the content you created after you cancel your service may not be so easy.
Although I moved from a single PHP page to a static site, I remained with the same web host. I accessed and archived my old content and uploaded new content. My host doesn’t care which tools I use to build my website or which file types or formats I choose. Web hosting and web building are separate, but that’s not the case with a platform like Squarespace.
Often times with this type of solution, you lose access to your content as soon as you cancel your plan. This happened to me when I canceled a Shopify site. The moment I closed my account, my site disappeared within minutes, and I could no longer access my content without reinstating my account. If Squarespace is anything like Shopify, the same could happen again.
The issue is avoidable as long as you keep backups of your content elsewhere. Luckily for me, I authored nearly all my web content in Google Drive and copied and pasted into my Shopify site.
The other issue is that if Squarespace were to close suddenly, I could lose my site. Even if closing is unlikely, they can at any time change their policies, prices, or services. Those are risks that I didn’t want to take.
Why a static site generator?
First, what is a static site generator?
A static site generator is a tool that produces static HTML files (or other file type) from content often written in another format, such as Markdown.
In the simplest terms, a static site generator works by taking your web content, applying a specified web template, and building a web page from the two.
Static site generators are becoming increasingly popular. There are more than 400 of these tools available now according to StaticSiteGenerators.net. In November 2015, Smashing Magazine predicted them to be the next big thing.
I wanted the challenge of learning something new, and if Smashing Magazine predicts correctly, then I may get ahead of the curve by building my site using a static site generator. But those weren’t my only reasons for choosing this solution.
Advantages of a static website
When I first began working on the web, static websites were the norm. But as the size and complexity of websites increased, so did the need for content management systems. Eventually, dynamic sites that stored content in a database and compiled web pages on the fly became more popular.
So why have a static site? Static websites maintain certain advantages over dynamic sites, including:
- Speed. A web server can serve a static web page faster than it can compile a dynamic web page. There is no database with a static site and generally, less processing required by the server. Hence, performance is better. This advantage is especially noticeable with with large, heavily trafficked websites.
- Security. While no site is 100% secure, a static website is more secure than a dynamic site because there are fewer security holes.
- Simplicity. With a static site, I can keep things much simpler than I could with a WordPress site, yet I have more flexibility to customize my web pages with a static site. One of my biggest gripes with WordPress is the amount of code it generates. I sometimes find myself bog down trying to decipher all the <div> tags, classes, and IDs added to my templates.
Jekyll: A static site generator
After deciding to build a static site, the next challenge was to determine which static site generator to use. As mentioned earlier, there are more than 400 available today. With research, I narrowed down my choices to two: Jekyll and Hugo.
Both are popular generators, but in the end, I chose Jekyll for these reasons:
- History. Jekyll has been around longer than Hugo, which means that not only are there more sites built with Jekyll, but there’s more user generated content about Jekyll. If I ran into a problem, chances were good that I wouldn’t be the first user with that problem. Likely, I would find an answer in a forum.
- Liquid language. Jekyll uses the Liquid language developed by Shopify for its templates. I had some previous exposure, though not experience, with Liquid. The language seemed fairly straightforward enough that I felt comfortable learning it.
- Lynda.com tutorial. The final factor in my decision was a Jekyll for web designers tutorial from Lynda.com. Without it, building a site with Jekyll may have been far more difficult. This tutorial, however, explained the process in terms most web designers can understand.
Static site generators have their disadvantages, too, which I’ll explain in the next article. But because I wanted to keep things simple while still learning something new, Jekyll was the right tool for my website.
In part two, I’ll explain why despite the increase in static site generators, WordPress remains a better option for many of my web design clients.