Redesigned for Readability
A few months ago I realized that I disliked the design of my blog enough that I’d usually run my own articles through Readability before trying to read them. Despite being a design insensitive coder, even I realized that I had a case of really horrendous usability on my hands.
Here are a few features of the new design:
- Google Web Fonts: I use the Google Web Fonts API to provide a consistent font experience across most platforms. The best part about Google Web Fonts though is that they look great on Linux browsers that would otherwise annoyingly render Linux Font ™.
- Text width: articles should be approximately 100 characters wide for near optimum readability, but will shrink to fit smaller windows where necessary.
- Text-shadow: a CSS3 trick that makes text more readable, especially against a distracting background like the one you see here.
- White space: I thought that I was doing a pretty good job of using white space before, but was probably mistaken. I like it so much that from now on, I might just use it more often.
Although not quite as visible, I’ve moved away from Nanoc to a new backend:
Ruby on Rails: Mutelight now runs a custom built Rails-powered backend. Overall I find that the flexibility of having the full power of Rails available far outweighs the cost of writing a backend from scratch (working with Rails, writing a backend for a site like this really doesn’t take very long). Moving away from a static compiler may come with performance concerns, but in the end Rails’ full page caching comes out just as fast. I’ll talk about this more in a future article.(it still doesn’t run on a static generator, but it’s no longer powered by Rails)- Client-side syntax highlighter: due to concerns with the speed of an EC2 micro instance, I’ve moved away from Pygments to jQuery Syntax Highlighter. It does just as good of a job, and produces pristine markup as a bonus. After investigating available options extensively, I now feel that client-side syntax highlighters are the way forward these days.
- Tiny URLs: short links now look like
/a/redesigninstead of/a/22, providing more useful context. Formats for free: all pages will now respond to JSON requests as well as the default HTML. Try accessing http://mutelight.org/articles/redesigned-for-readability.json for example.(a subsequent redesign has disabled this feature; I no longer consider it to have much merit)
Another step that I’ve taken is to remove Disqus commenting (for now at least). I was hoping that these might be effective for correcting mistakes that I’ve made in articles, but in practice this doesn’t seem to happen very often. If you discover a mistake, e-mail me at brandur@mutelight.org or send a pull request for a correction on Github, and I’ll get around to correcting myself as soon as possible.
That said, I’m hugely thankful to the people who took the time to leave a comment on the old blog. I do hope you’ll continue to provide feedback through other channels.
Lastly, I’ll probably be making tweaks over the next few weeks. Enjoy!