Earlier today a new design for Elezea went live. This is about the 5th or 6th redesign since I started the site, but it’s the first one that I think deserves a moment to stop and reflect a bit. With this redesign, I feel like the site finally grew up to become what it always wanted to be. I try to stay away from meta posts because I understand they’re mostly interesting to me, and no one else, but I trust you’ll forgive me for doing it just this once.
I had two major goals with this redesign:
- To have a design that’s completely focused on the reading experience.
- To improve site speed and performance dramatically.
With these two goals in mind, I asked my friend Alex Maughan to help me with designing and building a custom WordPress theme to accomplish these goals. He did an absolutely stellar job, and I can’t thank him enough. This design makes me happy. Thank you, Alex.
But let’s talk a little bit about each goal.
A design focused on reading
There is one single thought that became the driving force for what I wanted to accomplish with this design, and that’s Jeffrey Zeldman’s quote from 1999 (I’m afraid the original post doesn’t exist on Adobe’s site any more, so I’ll have to link to Zeldman’s discussion of it):
Most of all, I worry about web users. Because, after ten-plus years of commercial web development, they still have a tough time finding what they’re looking for, and they still wonder why it’s so damned unpleasant to read text on the web — which is what most of them do when they’re online.
I discussed this issue in detail in an earlier post called Please let this not be the future of reading on the web, so I won’t rehash everything again here, except to say – yes, it’s damned unpleasant to read text on the web.
And yet, that’s (finally) changing as more and more sites strip away all the fluff – and make their sites responsive. Speaking of Zeldman, his own site is a very interesting experiment to try to rectify this issue. Other sites that are doing a great job at providing good reading experiences include Contents Magazine, the iA blog, and Marco Arment’s blog. So I wanted a site that provides an enjoyable reading experience, regardless of device or situation. With that in mind, here are some of the reasons behind the design decisions we made:
- A header that explains what the site is about (set the context), then gets out of the way once you start reading.
- A typeface that’s elegant and focused on readability – we decided to go with Adobe Garamond Pro. (Yes, Typography Is The Foundation Of Web Design)
- A color scheme that not only fits the logo, but also feels similar to the calming Sepia schemes that many reading apps (like Amazon Kindle and Instapaper) provide natively.
- A sidebar that sits off to the right – not in your face, but there if you need it – and is focused on what I consider the main calls to action on the site: subscribing to article updates. Everything else is secondary, as it should be.
- My favorite feature: a responsive design that scales down well to small screens, to ensure a consistently pleasant reading experience on all devices. No matter how prevalent responsive design becomes, I think I’ll always see it as a kind of magic.
- And finally, there’s an appropriate space for one of the well-designed ads from the User Experience Ad Pack. These ads are not only relevant to the stuff I write about, it also covers my hosting costs. I recently switched to the more expensive (but much more reliable) mediatemple, and I’m very happy so far.
The end result is, I hope, a site that’s focused on words, ideas, and readers. As it should be.
Improved performance
In a recent post I said the following:
I often wish I could move all my link-sharing off Twitter and onto this site, but I know that’s not really possible, because the readership isn’t quite there yet. But I much prefer not just tweeting a link, but also adding some thoughts, or even just trying to set the context so people can decide if it’s a link they would be interested in, or not.
I mentioned this to Alex, and said that if we can get the site to be extremely fast, I might be able to start moving all my link sharing here. He saw that as a challenge, and went to work… So what we have now is the following:
- The site is now only a fraction of the size it used to be. It should also have faster server response times from a PHP processing and DB query point of view, as there is much less server side processing required to generate the site.
- W3 Total Cache handles all the site’s caching.
- I use Amazon Cloudfront as CDN.
- I also run CloudFlare on top of everything, and I’m really happy with that service so far.
Ok, I think I’ve rambled on long enough. The TL;DR of this whole post is this. I’m really excited about this design, I hope you like it, and thank you Alex!