Last weekend I redesigned my website. The new site has a homepage featuring
a bunch of different things I’ve been working on, and a blog post view with no
header, just a sidebar and the post itself. As a result the site is way more
usable.
With any redesign you have to start by looking at what your audience needs and
then tailor the site for those needs. My user base divides into three groups:
- Friends and family, who will read more or less everything I write
- Drive by Google traffic, who are likely to visit one page and then leave
- Potential clients/employers/partners, who were referred from Hacker News,
Twitter, an email I sent out or a job application.
I am guaranteed to get traffic from the first two groups, as long as I don’t
break the site. The third group of clients, employers and business partners
are people who do not yet know me, but may interact with me soon, and the
site plays a big role in helping them make that decision. So the redesign is
targeted toward that group.
To win that third group of users, my site has to answer one question:
Who is this person and why should I listen to him? My old site didn’t do
a very good job of answering that question. Here’s what it looked like:
The standard blog template, where posts are displayed in reverse chronological
order, is good for only one use case – where the writer updates frequently
and the readers want to see what’s changed since the last time they
visited. The majority of blogs on the Internet don’t fit this model because
the authors update infrequently and don’t have a consistent audience.
Therefore, they should consider a different navigation scheme for their
sites; the main problems are outlined in this Jakob Nielsen article on blog
usability. My old site used
a reverse chronological order for navigation, and here are some of the problems
with that design:
- No way to find good content that may be a year or more older.
- Posts are on a variety of different topics, appealing to different groups of
users, with no organization.
- No photo, or description of me, on any page.
- All of the action items (send email, read more about me, etc) require at
least one full page refresh; this is too difficult, as most users are lazy
and won’t hunt around.
- Articles are posted in full text, meaning that user attention span might run
out quickly (and also
that 10 posts worth of images are requested and downloaded)
- Finally, the large number of different pages made it more difficult to
maintain, and each attempt to tackle a part would leave me overwhelmed thinking
about fixing the whole thing.
So I had the following goals in mind for the redesign:
- Tell a better story about me on every page.
- Put the best content on my site in front of users.
- Make the action items (email, Twitter, etc) easier to click.
- Also, improve page load time, which would boost user
satisfaction and my Google rankings. Google found that a
half second delay in page load time dropped traffic by
20%.
So here’s what I came up with for the homepage:
And the single blog post view:
I’m pretty pleased with the way they turned out. The homepage essentially
consolidates the information that was spread across five pages in the menu of
the old design. Furthermore, it displays ten of my best posts, organized by
category, and a sample of things I’ve tweeted, so there will be at least some
dynamic content on the page for users who visit.
I also took some steps to improve the page load speed. I installed two caching
plugins – WP Minify, which
minifies and combines all of your Javascript and CSS files into one file of
each type, and WP Super Cache, which
generates a static HTML file and then serves that file to users, instead of
hitting the database every time a user requests a page. These help minimize the
response time, the number of requests, and the size of each request.
I also use a
sprite
to display the icons on the blog page view, turning five requests
into just one. As a result, the blog post view gets a score of
83/100 and the home page
gets a score of 78/100, about a 20 point improvement over the old design.
So that’s the analysis of my site redesign. Now if I could just to find a
posting schedule and stick to it!
Liked what you read? I am available for hire.
