The New Internationalist home page challenge
Most often when I’m designing a new site, I focus first on its content pages. Then, working from the inside-out, I finally arrive at the home page. This is the approach that I’ve taken in my work for New Internationalist. That said, a site’s home page is often what people want to see first, so who am I to disagree? Today I want to share and invite your feedback on my work on the New Internationalist home page.
First a few rules of the road
What you are looking at is (developed) work-in-progress, not a finished piece. I am very open to constructive criticism about ways to improve what I'm doing, in-fact I really want to hear it, whether you're a reader of New Internationalist or not.
So far my process has focussed on content architecture, layout and problem solving. What you're looking at is not my completed visual design proposal for New Internationalist, although it does contain some elements that are part of my thinking, particularly in relation to typography, content readability and minimalism.
The prototype layouts that you will see contain active hyperlinks to other layouts that I'm working on. Some of these are more developed, others less so. I'll give you an opportunity to comment on everything as this process continues, but for now I'd like to keep the conversation focussed and hear your thoughts on the home page.
These layouts have not been tested (yet) in Internet Explorer 7/8. If you use that browser, things could be a little stinky. To view these layouts, you'll need a browser like Firefox 3 or Safari.
Nothing that I give you access to as part of this open design process can be reused, repurposed or otherwise recycled.
The home page challenge
If you're reading this on my sites, you might not have visited the current New Internationalist home page.
Problems with the current design that have been discussed include:
- Confused navigation zones
- Busy, crowded and cramped layout
- Confusion between magazine and blog content
- Visual dominance of sidebar detracting from readable content
- Internal site navigation disguised as ads
- Lack of focus on call-to-actions including subscription sales
Some of the factors I have considered in my re-design have been:
- Reorganizing navigation into logical zones to make it simpler and more intuitive
- Widening the layout (physically and visually) and adding whitespace to emphasize content
- Creating clearly defined zones between magazine and blog content
- Reducing the colour palette
- Simplifying navigation to eliminate the need for internal site ads. This creates space for legitimate, external ads; increasing the opportunity for revenue generation
- Adding emphasis on revenue generating calls to action, including shop items, books, past issues and subscription
The magazine/blog content dichotomy
Perhaps the major challenge in re-designing the New Internationalist home page is creating defined zones for magazine and blog content and creating a balance between the two.
The magazine content is vital to encouraging subscribers, but is updated less often. The blog content is free and updated more regularly. Giving prominence to blogs might mean that new readers miss the important fact that New Internationalist is a magazine, not simply a blog or news outlet. Alternatively, giving prominence to magazine content and the site might appear too static.
My first thought was to mix both blogs and magazine articles into one stream. After-all, I thought, both are New Internationalist output. The problem with this approach is that as magazine content changes less often, it would soon be pushed down (or off) the home page by an influx of blog entries.
This introduced the concept of tabs, placing ample content from blogs and magazine into their respective tabs. But in talking to people about this approach, several problems came to light. Which tab should be open by default? Magazine or blogs? Which-ever I chose, there was a danger than a reader might miss the other?
Although a third iteration (below) quickly took its place, I have developed this second iteration for you to see and comment on. Who knows, it may well find itself reused on another part of the new site?
This is the home page layout that I want to present to you as my recommended option. In this iteration, I have replaced the tabs with two very distinct content areas for blogs and magazine.
I have chosen blog content to be nearer the top as this is updated more regularly. Magazine content comes lower down the page and is visually and geographically linked with related content (such as past issues) and call-to-actions (subscription).
To help guide a reader to blogs and magazine zones, I have made a leader/teaser panel that reflects the most important story from each. When a reader clicks, they are smoothly scrolled to their chosen zone.
I hope that this gives ample and equal focus to the two important content types as well as a smooth experience for a reader.
More to see
Although I am still working on the specific detail and design of other elements on the home page, I thought that it might be useful for you to see their works-in-progress. In particular, look out for the new products area that brings items from deeper in the site onto the home page. This includes the tabbed area for books, past issues and shop items.
Next, the current site's subscription process needs improvement and my challenge is to make the first steps of that process simpler, by combining them into one, simple, overlay panel that offers both print and digital editions of the magazine.
I hope that you'll enjoy digging into the home page and maybe the other layouts that I'm working on. Feel free to comment on how you think I can improve. I will really value your contributions. (gulp)
- Current, live New Internationalist home page
- Redesign iteration two (abandoned)
- Redesign iteration three (recommended)
Update: It would really help me a lot if I knew a little about you when you comment, it helps with context. Are you an existing New Internationalist reader? Do you work there? Are you a member of the co-op or a web geek?