New and Improved - Now With Static!
I've been hard at work recently redesigning this blog and converting it from WordPress into a static site. Please don't be too shocked! Get it? Static…shocked… ok that’s my dad joke quota for the day. But honestly it's been a really interesting process that I'm excited to share with you!
What's a static website?
You may be reading this and thinking “Okay, Bob, I see that your site looks a little bit different, but what’s really different about a static website?” To put it simply, the answer is “everything you don’t see!”
In a dynamic website like WordPress, the application runs on a web server, and content such as images are stored in files. Other content, such as configuration information and the text of the site itself is all stored in a database, usually MySQL. Loading a page of a WordPress site involves querying the database, reading some files, and the web server assembling everything into HTML that can be displayed in your browser. It can be quite resource-intensive and if your hosting plan isn’t beefy enough, your readers will absolutely notice pages being slow to load.
In contrast, a static website is nothing more than HTML files. There’s no database necessary, and really no web server needed either. You can actually host a static website directly from Azure Blob Storage or AWS S3.
Now I like coding, but I absolutely would not like writing an entire website’s worth of HTML files. Fortunately I don’t have to, because that’s where static website frameworks come in. I’m using Hugo, though there are several others available like Jekyll or Gatsby. In Hugo, blog posts are written in Markdown, and the software takes care of assembling everything into HTML files based on configurations specified in some other files. And all these files can be stored in a Git repository and put on GitHub or another repository service for safekeeping. It's really slick and simple and really all that's needed is a text editor.
Why I did this
To be bluntly honest, the biggest reason is cost. While there are definitely cheap ways to host a WordPress site, including for free at Wordpress.com, I've always had my own site with my own hosting where I have full control over everything. I don't mind paying for it, but "good performance" and "cheap hosting" are not often found in the same sentence. I hosted my blog with SiteGround the past few years. They do an AMAZING job - seriously they've been a great host with excellent support and the performance of my site has been stellar. That being said, they're not cheap. I absolutely got what I paid for, but I paid a pretty penny for it.
My next reason for switching to a static site is portability. WordPress is portable. Kinda. I mean it's supposed to be. But the few times that I've moved my site to a different host there have always been moments of sheer terror. Did the database restore correctly? Did all the files copy over and end up in the correct location? Are all my config values being used? There's lots of bad things that can happen. With a static site, again, the public part of my site is just a bunch of HTML files, which are extremely portable. On the back end, my website is a GitHub repository, so everything is versioned and no matter what I break, reverting is always an option. Everything I've experienced so far shows me that static sites are WAY more portable than WordPress.
Finally, I feel that a static site just fits my needs more than WordPress. WordPress has lots of features and plugins that can do some really awesome stuff - and I used basically none of them. My blog isn't super flashy - it's just content. I don't sell anything or make a living from it (in fact as mentioned above it costs me money to run) and I have very little need for a dynamic site like WordPress offers. So maybe, just maybe, this will be the last time I ever migrate my blog. Time will tell.
How I did this
I could write all about how I converted my site from WordPress to Hugo, but the reality is that Kendra Little wrote an excellent post about how (and why) she converted her site, and I basically just used her instructions. So if you want to see how I did this, just go read Kendra's post because it's way better than I could have written anyway.
That being said, I did use a different WordPress conversion tool than Kendra. I ended up using Cyrill Schumacher's WordPress to Hugo Exporter which is available on GitHub. Super-simple - literally a one-click WordPress plugin that will create a .zip file of the entire contents of your WordPress site in Markdown format. I definitely put in some time after using that tool just to fine-tune posts into exactly how I wanted them to look, but it got me probably 90% of the way there.
For hosting I am using the Azure Static Web Apps free tier. It was very simple to set up and easy to work with. I actually had a test site deployed there for a few months to get familiar with everything before moving this site over.
I also had to do some interesting pre-work to get a link redirection system up and running. One of the very few wordpress plugins I did use was Redirection, which lets you create URLs that redirect people somewhere else. Whenever I give a presentation, I have a short URL I give that will take people to the appropriate GitHub repo with slides, scripts, and other materials. So if I was giving a presentation about Zombo.com, I might include a link for further research that would look something like this: https://sqlbob.com/zombocom which would then redirect you.
Moving off WordPress, I needed to recreate this functionality, but it's not really possible in a static site. I could have done it through Cloudflare, which I already use for DNS (their free plan is excellent!) but I wanted something a little more customizable and I needed a project anyway. I ended up building one myself using Azure Functions and Cosmos DB. I'll do a post on how all of that works in the coming weeks.
What you'll notice
As you can see, there are definitely some changes around here.
- Speed: For one, you should notice that pages load very quickly. It wasn't slow before, but it's really quick now.
- Design: I'd also argue the design is much more clean and simple. Of course I didn't design this myself, Hugo has lots of available themes. I ended up choosing Clarity.
- Comments: An unfortunate part of moving off WordPress is that I can't take my comments with me. I had some really great and supportive comments over the past 13 years, which I will miss. I also had LOTS of spam and hate mail that made their way to me, and even more that didn't. According to WordPress, they have blocked over 156,000 spam comments. I did setup comments on this new site using utteranc.es, and yes they require a GitHub login to be able to comment. But if you're reading my blog, I'd say chances are pretty good you have a GitHub account anyway. I'll be interested to see how this works out, and may make adjustments in the future.
- Newsletter: I had email subscribers to my blog, but this was also managed through WordPress, so I can't take those subscribers with me either. (I know many subscribers personally, but I'm pretty sure a lot of them were bots anyway.) Actually I could, but I don't think it's right to take those emails and add them to a different newsletter that they didn't specifically sign up for. I've created a new newsletter using tinyletter that people can subscribe to if they like. I'll use it to send out most blog posts - maybe not all depending on the topic. If you'd like to subscribe to these emails going forward, please do so here.
- RSS: My old blog used FeedBurner for RSS (which really seems ancient by today’s standards - but again I set all that up in 2010). I do have lots of RSS subscribers and I believe I can redirect it to my new RSS feed, so hopefully that just works. If you found out about this post through the RSS feed, then I guess it did!
I am very grateful to WordPress for all it's done for my blogging the past 13 years, but I'm also very happy to have migrated off of it and onto this static site. Also my sincere thanks to Kendra for blogging about her static site conversion - it was extremely helpful!