About the site
This site has been through several incarnations. It’s always been a static site, but the choice of generator has changed several times.
The first version, which I posted in late 2012, was built with Octopress. Maintaining a working Ruby setup for Octopress was a lot of hassle, so a year or so later I switched to the Python-based Pelican. That worked fairly well, but the AGPL and licensing question always made me a bit nervous. In 2016, I experimented with writing my own site generator (called Hot Chocolate), but I just spent a lot of time reinventing wheels.
The current version is back to Ruby and Jekyll, wrapped in Docker to simplify the build process. What you see today is powered by:
- Jekyll, for building the HTML
- Sass, for building the CSS and stylesheets
- Docker, which wraps the local build process
- GitHub Actions, which builds and deploys the site
- Netlify, which hosts the site
and all the site source code is on GitHub.
I’m also using some icons from the Noun Project.
Between the Wayback Machine and my screenshots, I’ve put together a short visual history of what the site used to look like. Feast your eyes on my evolving skills in web design.
Mid 2022 to present: Cards for browsing the archive
Most of the design is the same as in 2018, barring minor tweaks to spacing and text styles. I did add cards to the homepage to link to blog posts, as part of a design refresh to make it easier for new visitors to find posts they might like in the backlog.
I also used this design on the “best of” posts page, because at nearly 350 posts it was impossible for anybody who wasn’t me to navigate the archive.
2018 to mid-2022: A bio on the homepage
I continue to tweak the styles, but the major themes are the same: Georgia for the font, red accents, that speckled border across the top of the page.
I finally ditched the blog list from the homepage, because it was difficult to get a sense of the site – what you saw would vary based on what I’d written most recently, and if it was a really long post you might never see anything else! I replaced the homepage with a bio and a profile picture, with links out to blog posts but not jumping straight into the content.
I also added new code to tweak the accent colour and the stripe, so I can theme individual pages if it suits the content. Here’s a purple page:
2016: A speckled red header
I kept cutting the vertical height of the header – on small phone screens, you’d pretty much only have a header when you loaded the page, and you wouldn’t see anything else!
I also added the speckled background, which I’ve really liked as a bit of lightweight visual flare (barely 2KB). It falls back to a solid red stripe if the image doesn’t load.
Late 2014: The first red stripe
Unsatisfied with the bubbly menu in the previous design, I did another version of the site that added a red stripe across the top. I’ve tweaked this design quite a bit since the first version — the stripe became a less orangey red, I kept reducing the vertical height, and switched to a serif font — but the basic idea has remained the same.
Sometime in 2015, I swapped out the sans serif font (this screenshot is Avenir) for a serif font (Georgia), which is the current font.
Early 2014: What is that sidebar?
The site went through another redesign and two font changes in 2014, as well as a sidebar that aged badly. If I’d put anything more useful there it might have worked, but it just had the links that had been in the header. This only lasted a few months before I moved the sidebar back into the header, and then redesigned the site again.
2013: A big name design
The first major redesign introduced the red-and-white that’s been a common theme ever since, along with a name in the header that seems ridiculously large to me today.
Late 2012: Octopress
The original site was a lightly modified version of the default Octopress theme, with a blue tint that didn’t last. I’m pretty sure I had a red version of this theme, but neither the Wayback Machine nor my screenshots provide any evidence that it existed.