Look ma, no stock theme!
I just redesigned my blog.
To be totally honest, the previous design was not mine at all. I’ve always been using pelican-octopress-them, which is a Pelican port of the default theme for Octopress. It’s not that I have anything to complain about that theme: it was clean, readable and easy on the eyes. I just want my site to look unique. Content is king, sure, but it wouldn’t hurt to stand out from the crowd once in a while.
I’m not a professional designer, but everything turned out quite well if I could say so. In this post I’ll explain my design goals and how I (hopefully) achieved them.
Clean and lightweight
In fact, the main motivation of my new theme is this satire page on the sad state of the web we’re in today.
That’s why I decided to do no fancy cosmetic JS and try to keep my use of static assets to a minimum:
I guess I can do nothing about the font files though. Oh well, at least it looks awesome.
Content is king
No more distracting sidebar with “latest news”, “related posts”, etc. with thumbnails popping up all over the place, just a good old article body from start to finish.
Easy on the eye
While bettermotherfuckingwebsite does a good job at demonstrating how far you can go with a few simple CSS rules (hint: very far), I found Tommi Kaikkonen’s Interactive Guide to Blog Typography much more comprehensive and informative. I implemented many of the ideas found in that guide:
- Big body font
- Constrained line width to aid reading
- Generous line height, liberal whitespace to help with visual hierarchy
- Lower background-foreground contrast. I also find the slightly yellow-ish background somewhat soothing.
You can find the source code to my theme on GitHub. I don’t recommend using it as-is though, since I haven’t implemented many required templates (authors, tags, categories, etc.) because I don’t use them. There’s also the hardcoded footer. But honestly, the main reason is I just want my site to stay unique :P