Big Orange Software Blog

Jul 14

How to get your homepage design right

Posted by: Richard Freeman in Design No Comments »

In these ‘tough economic times’ (TM) for business owners, the virtual shop window is more important than ever and has to work hard to bring in business. Is that its only role though? How can you make sure that its doing the right job for you? Wondering about how to re-design your homepage? Read on to find out more in our guide to homepage re-design.

Going back and forwards in time…

When I took my first brave steps on the Internet back in the late 1990s, I could not have imagined that in only 10 years, we would have gone from the very worst, Web Pages That Suck (http://www.webpagesthatsuck.com) through the Million Dollar Homepage (http://www.milliondollarhomepage.com/) to arrive at the new BBC homepage where you can drag and drop your own content around, customising it to your heart’s content.

Is Every Pixel Born Equal?

What both sites prove is how space on a homepage is key – what you use every pixel for is important – but are all pixels equal? For any business owner, there are elements they want to promote and elements that need to be there, but aren’t necessarily going to make them money or help them reach an audience. How to get them on to one page though? Hmn…..well, how much space do we have there? Can’t we just put on everything and let people scroll?

In 2006 / 7, all you seemed to hear in meetings between web designers and clients was, ‘The Fold’. This was a virtual line that was drawn over every web design, the cut off point between what could be seen on a standard screen once the page first loaded, before a user had to scroll.

Clients all thought that everything had to appear above this mythical line and nothing could appear below it. Any web designer worth their salt realised that this was an impossible dream, so would have to go through endless rounds of discussions arguements to work out what was important to go above the line. Once this was settled, designs would be produced and then the client would invariably appear on the phone two weeks later once they had seen them, to give a different and completely contradictory opinion about what go there.

Google To The Rescue?

Thankfully, technology ticked along in the background and found us a few solutions to this thorny problem. ClickTale, the web analytics company, started to produce some raw data that actually proved people could operate their scroll wheel and move down a web page (http://blog.clicktale.com/2006/12/23/unfolding-the-fold/). Google joined the party later on too, with their BrowserSize tool, a labs product that has been around for a while now, allowing you to see what percentage of people’s browsers could access certain parts of a web page (http://browsersize.googlelabs.com/).

As the end of the Fold started to become clear, designers started to think more about how to actually provide the most clear and engaging homepage for users, which often invovled scrolling layouts and reliance on JavasScript libraries like JQuery. Sites like Carsonified actively encourage scrolling, separating their projects area into tidy little panels (http://carsonified.com/projects/) with arrows to show you where to go to discover move. Other sites like Google’s RSS Reader (http://www.google.com/reader ) even wait for you to have reached the bottom of the page, before allowing you to scroll and load more content in. The Fold is dead, long live the mouse.

Humans are important, not computers

This gradual move towards thinking more about the end user and their behaviour led to a more human perspective, when it came to considering homepage design. The gauntlet of Usability was quickly picked up by Jakob Nielsen, who devised many rules that web designers **had** to adhere to in every design, though The 10 Most Violated Homepage Design Guidelines (http://www.useit.com/alertbox/20031110.html) didn’t impress some designers with its overall tone.

Moving on from Usability, came User Centered Design. This meant that those awkward discussions I mentioned earlier between client and designer, were now about what type of people were going to be visiting their site and what information should be targeted at them in the design. This doesn’t automatically make a better design, as many clients just aren’t sure who is visiting their site now or in the future, but should help inform the process anyway.

Homepage redesign 101

So, when redesigning anything, be it your homepage or some other part of your website, you first have to answer the following questions:

What do you want most people to do when they visit your site? Purpose.
What else do you want to offer to people that visit? Content.
As far as the style of the design, what do I want it to say about me and my business?Style.

Purpose

Does your business sell? Do you offer advice? Is your organisation all about support? Whatever the purpose of you, your business or your organisation, it must be clear on your homepage and should take up the first part of your homepage. This area of the site will probably include your logo and possible some sort of welcome message or blurb, but remember to make it **active**. What I mean by this, is that if your business is about offering a service for example, there should be a visual clue for people to either sign up or find out more there and then, via a form or button to click.

Content

The old phrase ‘Content is king’ is a good one as it reminds everyone of its importance in a homepage. My take on this is always that websites are written as well as designed. It is all very well to show the most recent updates on your homepage from your blog, but how often do you write them? Nothing is worse than old and outdated content, so do think about this when trying to get the balance of static and dynamic information on most homepages.

Style

As your virtual shop window, your homepage does paint a picture of a thousand words or more. It is important to make sure the style reflects your organisation and more importantly gives the right message to potential customers. In the war of Microsoft vs. Apple, Good vs. Evil Evil vs. Good , I do find the Microsoft homepage a bit grey, corporate and un-inviting (http://www.microsoft.com/en/us/default.aspx) whereas the Apple homepage does seem a bit glossier but friendlier, more inviting (http://www.apple.com/). Anyone want to guess what computer I use at home then? Glad to see its not just me that makes the link between design and service too, as Ollie Rattue noted recently (http://toomanytabs.com/blog/806/first-impressions-count-a-demonstration-in-design/)

Are you a Paddler, Swimmer or Diver?

After checking off that list, the last thing to do is get into the pool work out how balanced your homepage offering is, in total. Are you offering enough forPaddlers, Swimmers and Divers?

Divers - coming via Google, as much of your site traffic will, these visitors will dive in with a specific query, looking for something definite and evaluating your site in seconds before bouncing off to a competitor. Get your purpose right, clear and obvious to retain these peope.
Swimmers - this group have visited you before, so know the site and can swim around happily, but want signposts to what other services you offer, what the company or organisation does, what you have been up to recently and so on. Make sure you have a variety of content on your site to support these visitors.
Paddlers - if people find you via a link offline or a recommendation from a friend, they will be new to the site and so will be paddling carefully around. Make sure that your design is warm and inviting to these visitors, so you can encourage them to become swimmers over time.