Home Page Goals
Issue № 211

Home Page Goals

When I set out to design a website, I do it backwards. I start with the design of the smallest, deepest element: the story page or search results. Then I work backwards to design their containers: section pages, indexes. Then, lastly, I work on the home page.

Article Continues Below

I do this because each container needs to adequately set expectations for what it contains. If the home page says one thing, but the internal pages say another, that’s going to lead to a user-experience failure.

This also means that, by the time work begins on the home page, there’s a lot of momentum going already. And any lingering anxiety is going to come to a head—on the home page.

Home pages are anxiety-inducing for companies. The home page is your first impression. And like the old saying goes, you only get one chance. So home pages themselves have a unique set of design goals.

Before I get into those goals, here’s a grain of salt. Every site I’ve ever worked on has had strikingly similar traffic trends, and one stands out. Remember that smallest, deepest element I described earlier? This is the atomic element—for a news site, it’s the story page; for a search engine, it’s the search result; for a store, it’s a product page. This page accounts for 60 to 75 percent of all page views on the site. The rest belong to the home page.

This is not to say that the home page is unimportant—it’s hugely important as a first impression. But looking at the numbers, you’ll get far more bang out of tweaks to the atomic element pages than the home page.

That said, let’s look at the unique challenges that home pages present. Remember, when I say home page, I mean the page that lives at whatever.com. The first page a user sees when they show up at your front door.

Any home page has four main goals, in this order:

Goal 1: Answer the question, “What is this place?”#section2

This is, and always will be, the number-one job of any home page. If you ignore this goal, you’ll leave new visitors in the dark.

The first thing a new visitor does when they get to an unfamiliar site is ask that question. If the site does not do a good job of answering it within a few seconds, the user will feel dumb, leave, and never come back. After all, what would you do if you met someone and they made you feel like an idiot? Would you want to hang out with them again?

This is all about making a good first impression.

Don’t be afraid to use good old fashioned text to say: “This is who we are, and this is what we’re about.” Then link to a more verbose about page or tour. That way, the people who need that help have a place to go to find it. And make sure the text you use is excited and positive—and makes the reader feel important.

Don’t be too wordy, of course. Make sure all the words you use are doing heavy lifting. But the explanation has to begin at the top of page one—it’s the most important thing you can do to turn newbies into repeat visitors.

This is especially important for companies trying to do new things. Google can get away with a user-hostile front page because everybody already knows how to use it. But that’s the exception to the rule. If you’re doing something new, sometimes you just have to explain it in plain language, like: Flock is a free, open source web browser.

If a first time visitor to your site’s home page does not understand what it is within three seconds, you’ve failed goal number one, so feel free to skip the rest. The only people who will use the site are the people who already know what it does. Or, ya know, masochists.

Goal 2: Don’t get in the repeat visitor’s way#section3

All that said, the second goal is to get out of the way of the users who already know what they’re doing. These are the users like you, the ones who have been here before and already get it.

One great technique that accomplishes the first two goals in one fell swoop is to make one area of the page dynamic. That area can show an explanation to newbies. But once the user is logged in, replace the explanation with some information specific to that user (which also meets goal three).

Flickr takes this method to an extreme, providing entirely different home pages if the user is logged in or logged out. For them, this is a perfect method. The site is so customized for logged in members, and the service is just different enough from other sites, it makes perfect sense to provide an entirely different experience to each group, and it perfectly meets goals one and two.

Flickr

Goal 3: Show what’s new#section4

By the time you get to goal three, you’ve already addressed the needs of newbies and repeat visitors. Congrats, now everybody’s on the same page! Now it’s time to impress them all with what’s new.

Too many sites stop after addressing goals one and two. But once a user’s gone through the trouble of figuring out what you do, and then actually coming back, you owe them something: what’s new. You know your site better than they do, so be their tour guide. Suggest places to visit, starting with whatever’s new. Blogs are especially good for this, with their newest-comes-first formatting.

Goal 4: Provide consistent, reliable global navigation#section5

This is a site-wide goal, but it’s important to list here because the expectations you set on the home page will carry forward to every page on your site. It’s the little things that count here. If a link is in the global navigation on the home page, it should be in about the same place everywhere. If there are six links in the footer, those six links should appear in every footer.

Bottom line#section6

Designing for good user experience is about communicating clearly, setting expectations early, and then delivering what you’ve promised. Think of your home page as the opening verse of a song. All you have to do is make sure you stay in tune throughout the user’s entire listening experience.

45 Reader Comments

  1. Nice article Derek, I’m currently designing a site for an international company and the home page has been the biggest hurdle I’ve had to face.

    The problem is they want multi region selection up front coupled with multi lingual support, then they want to set cookies so that people who have been to the site before can just go straight through to the secondary homepage, but allow an option to change region and language if they want to. The biggest concern is that the first time user is hit with a select region page, “select region for what?” the user will ask, “where am I”.

    We have outlined several ways to do the home page but so far they have turned them all down flat because the people in the board room “don’t like that idea”… This is very frustrating when they ask for your help but turn it down flat because it doesn’t suit their personal taste for a home page.

    So after nudging them away from the splash page idea, after 3 months we have ended up with exactly what they don’t need. I wish there was a better way to get these messages across to the people who run the companies…

    Any suggestions for how to deal with the client? 😉

  2. I would argue that it’s more important to present links to your most important content on your home page, rather than focus on what’s new.

    The majority of users come to a site with a particular task in mind; which typically boils down to one of a few things. If you can present those few things on your home page, then you enable users to get to where they want to go without having to think.

  3. Nothing new in this article. When working in the webbuilding business, this should be common knowledge. But even these very simple homepage rules are hard to sell to people who run the companies. So I guess they need to read the article in the first place. But they don’t of course. They prefer to read the Financial Times or whatever.
    Maybe the only way to convince them to apply these simple rules is to organize some basic user tests. It will cost some extra time and cash, but with some luck it might open there eyes in the end.

  4. I think everyone of us must read this article, before starting a new project, and send a link to prospective client 🙂
    Just because sometimes we forget these simple little things in a daily routine.

  5. I liked this article and I think it is extremely good common sense. I do agree to some extent that alot of designers will do this already but if I’m honest I haven’t seen an article written quite as clearly or concise as this – so nice one.

    When designing a home page I always ask myself: What do I see as hotspots and how can I make cold spots warmer? Hot spots are areas that users will immediately look at eg: banner. Cold spots are places like the footer or maybe the right hand column. I have found it is good to discipline yourself in these technical areas as you can make a much more user friendly and productive website.

    I think one other thing to consider when designing a homepage is the brand and the “brand image”? that you are presenting. Why do you want to use that image – what does it say and why does it need to be there. What’s the best typeface for my website — and why. If you are doing a new website then maybe its time to look at your logo and marketing messages. The technical aspect is only half way there and if you don’t question everything about your designs then you leave huge gaps in your screen real estate. So, be your own worst critique and you will go far!

    Great article – keep up the good work.

    Matt

  6. Derek – Great points. I think it’s a great idea to design in reverse. Honestly, that’s not anything I’ve really considered before. It makes a lot of sense, though. I plan on applying that approach to my workflow moving forward. I appreciate the article!

  7. bq. I would argue that it’s more important to present links to your most important content on your home page, rather than focus on what’s new.

    You can do both. At the very least, a link to a “What’s new” page should be on the home page, where relevant. Obviously for mega sites, or for sites that are constantly changing, this may not be appropriate.

    A key point is how users find the site. If your site is content-rich, new users probably go through a search engine and land at an internal page. They are more likely to engage with the site *before* visiting the home page. When they do go to the homepage, it is often bookmarked from a previous visit. You can afford to tailor the homepage more towards repeat and invested visitors.

    If your site is the sort where most people arrive at the homepage on their first visit, you need to aim your homepage squarely at new visitors. That doesn’t have to mean much difference in what you have on the page, but it might lead to you highlighting different sections, or changing what you have in the hotspots.

  8. bq. But even these very simple homepage rules are hard to sell to people who run the companies. So I guess they need to read the article in the first place.

    The age-old question of how to get a technophobic paymaster to listen to your words of wisdom, understand them, trust you, and follow your advice. And it’s a difficult one. Because what _looks_ impressive and attention grabbing – eg Flash Splash! – is often a really bad idea in practice. But as soon as you start talking “technical”, so many people switch off and lose interest.

    I think a key issue behind this is that most bosses have a somewhat over-inflated view of their company – they assume that everyone will know what it is, what it does, and will be _interested_ in it. *Wrong*! Most people couldn’t give a damn about the company – they just want to get the information/make the purchase with as few clicks and as little reading as they can get away with.

    The home page has to help visitors, not hinder them. How many sites can we all name that haven’t realised that simple fact?

  9. bq. I think it’s a great idea to design in reverse. Honestly, that’s not anything I’ve really considered before. It makes a lot of sense, though.

    If you think of the home page as like a pared-down and glorified index page for the site – which is what it essentially is – it’s very difficult to design the home page until you know what’s in the rest of the site. Designing the home page first tends to lead to more arty styles that aren’t necessarily easy to use – but the design has been made and then the content has been hammered into shape to fit it. Guess what? It doesn’t work so well.

    If the rest of the site has gone well, you should find that the home page pretty much designs itself – yes, you’ll want to add a bit of graphic glitz and glamour to it, but the rest of it should fall into place.

  10. Thanks a lot for this one Derek, it’s nice to introduce a new idea (to me) like start with site design from somewhere besides the home page. It’s such a simple and brilliant concept.

    I’ve already applied the idea clearly stating the website’s purpose on the home page on a new project of mine, and it’s wonderful.

    One silly critique: “Logged out” is not the opposite of “logged in. I like “not logged in” better. Logged out is what happens when you fire a logout action.

  11. Kudos, and thanks for these words well-spent. Another reason to pay close attention to our inner pages is that they are likely to BE our first impression (vs. the “home page”) when a first-time visitor arrives via a link from a search engine, or a repeat visitor comes in via an RSS feed. Site-wide branding and a prominent link to the home/about-us page helps, too. Back-door, side-door, and bathroom-window visitors all deserve our respect, and our gracious welcome.

  12. Thanks for the great article. It was easy to read and digest and is an excellent reminder of good design practices.

    I appreciate the idea of designing from the inside out — from a key interior page back up through to the home page.

    I often design side-by-side, working on a key inside page at the same time as the home page. This enables me to focus on the usability of the inner page (such as a product page detail or a news article), while making sure to emphasize the stronger flavor/brand that the home page presents.

  13. In the last web project I managed, I asked the designer to first work on the inner pages and then do the homepage. Since she is an expert designer she refused, saying “I don’t work like that. The homepage sets the tone of the website”. I was right of course. The inner pages were designed as an afterthought and look it.

    Now I have two options, to send her the link or not to. Well, saying “I told you so” is not very helpful. I will probably demand it the next time while showing the designer this great article.

  14. I agree with a lot of what Derek has written here, except that I find that its usually impossible to design the homepage absolutely last. Rather, as others have suggested, the homepage develops iteratively as you design the inner layers of the site.

    I have found that clients generally can’t cope with waiting so long for the homepage, and often can’t or won’t approve other design without seeing how it would work with the homepage context. This doesn’t necessarily make for the best possible process, but it seems to be the way to achieve the best result most efficiently.

    I can’t agree more with the philosophy of starting with the page at the deepest layer – too often these are left way to late, resulting in poor design and even worse information architecture.

  15. An alternative to displaying the newest content in a prime spot on your home page is to give users what they want most. What are they coming to your site for? What’s the most popular section of the site? For example, on a site I worked on, most of our traffic went to the discounts section. Rather than frustrate users by hiding this two levels down, we redesigned the site and made discounts a prominent link on the home page. This proved very successful – it was user-oriented design.

    However, this change generated some internal debate – shouldn’t the site reflect the organization’s priorities versus what users wanted to see? It’s an interesting debate and really depends on the site’s mission and audience. Is your internal audience more important than your external one? Your internal audience is right down the hall compared to your users which are more of an unseen mass. Obviously, a site’s users are the most important but that can be a tough sell with the people who sign the checks 😉

    On sites I’ve worked on the criteria for the “what goes on the home page” question usually ends up being a compromise between internal and external audiences. There are certain things that we want people to know about (our new CEO) versus what they’re coming to our site about (the free stuff). It’s important to have some sort of “defensible criteria” for what goes on the home page so that the page doesn’t get cluttered up with everyone’s links and buttons.

    Really useful article.

  16. What do you think the function of navigation is, and what types of navigation tend to be succesful? For instance, css drop-down navigation has the advantage of giving quick links to the second or third level of a site, but the disadvantages of having hidden information (that appears when you mouse over), information overload (the drop-downs might link to 20 or more sections), and be physically difficult to mouse through (a javascript delay that keeps the menu displayed for a second or two when the mouse leaves it can help usability).

    Should there be more than one way to navigate to the same place on a site? A List Apart’s “Topics” navigation allows this, but unlike the global navigation, provides no feedback (when you are in the “design” section, the “design” link looks like the other links, and even stays clickable).

    It is easy to underestimate the trauma of navigating even an excellently designed site. You provided such clarity of thought in your home page article, I’d be very interested in your ideas on the goals of a site’s navigation!

  17. bq. What do you think the function of navigation is, and what types of navigation tend to be succesful?

    My preferred method, with a large multi-layered site, would be to have the navigation for the whole site (or at least for the top 2 levels, maybe 3) in nested lists. Make these into popup menus with CSS and JS to back it up.
    Then – this is where it gets clever – pull the current section out of the dropdown altogether with an id=”currentsection” on the sub-

      , and position it on the page so that it is always there.

      That way, even for people who are unable to use the dropdown menus, they can navigate to the main page in each section and then follow a link from a static menu to pages within that section. And the only thing you have to do is to move the id=”currentsection” on each page – everything else stays exactly the same across the whole site.

      This also helps make it clear to visitors where they are on the site.

  18. It’s funny you mention flock as a site with a good homepage, because the few times I checked the site out, I did have the feeling of ‘what IS this thing?’?

    The site says it’s a browser. Ok. Then it is stated that it offers tools, ok. But what are those tools? What can I do with them? Why is flock better then the next thing? These questions aren’t being answered right away, except in very broad and vague terms.

    Good article otherwise 🙂

  19. This will be helpful for sharing with the Head of Computer Services (and website administrator) where I work. He considers himself a big proponent of Web 2.0, and I thought I was, too.

    But now he’s using our pre-roll-out user studies to argue against including a news section on the homepage, because users didn’t specifically ask for a news section. This sounds like faulty logic (and bad marketing) to me. I mean, they probably didn’t ask for a company logo, either, but of course we have one.

    I agree with the principal of giving ’em what they ask for, but should there be no room at all for giving ’em what we’d like them to KNOW they can ask for (new products, services, staff expertise)?

  20. Nice article Derek.

    Personally, I like to work on the homepage iteratively. But it’s good to hear the methodologies used by others. User experience is something every web designer needs to bare in mind through the page design process!

    Just something I would like to add though, when your talking about designing internal pages and working your way out it sounds pretty ‘high level’. I think a successful web design always starts with good information architecture. If you can keep the content on a leash and have a basic sitemap in mind it makes designing a great-usable site that much easier! 😉

  21. Great article, Derek. As for the earlier comments about how to convince the boss… I think it’s usually better to let someone else do the convincing.

    Try running some cheap and dirty usability tests, and get them on videotape. Bosses can easily dismiss “expert opinions”, but when they’re presented with evidence of real users, stumped by an interface, it’s hard for them to argue.

  22. Great article. I would also mention that home page content is also important. Include only the most relevant, new and persuasive items, and update often.

  23. Designing the site backwards from the inner pages and finishing with the homepage is a great idea. The best part of the article was actually the comment on user traffic. It’s pretty much true across the board in any large web site.

  24. In passing, Derek, you implied that Google had ‘gotten away with’ a bad home page, because it wasn’t apparent from the page design itself what Google was about.

    Is that accurate? And if so, do you still think so? And if you still think so, what elements of it seem counter-intuitive?

  25. i just followed one of the author’s links to see a great page in action and came across his http://jpgmag.com/ page that instantly confused me as to what it is and how to use it. after 10 long seconds of scanning the page, i left it forever.

  26. Good article, Derek. Just picked it up from creativepro.com. I have a question. Here is our URL: http://www.faithefc.com. Note what I call the non-Home Page Home Page. This was originally our home page: http://www.faithefc.com/index2.html. I know the site is not pretty, but there are political reasons for that ;>). But it’s not a bad site. However, in an attempt to show that our church is “with the times,” another staff member created the Flash site and the opening page to give visitors a choice. I don’t like the opening page, and I think the Flash site is less informative, and the flashing clouds, which have nothing to do with our church, are distracting. I think the original home page is more in keeping with your four goals. Honest opinion? Yes, I am the web master, but there are politics and conflicting philosophies involved.
    Thanks to all who help, Alan.

  27. So I read this article about a year or so ago and lived by it. Then I got a massive web application project and learned that the “design backwards” approach is probably one of the worst pieces of advice I’ve ever followed. Basically, this logic completely screwed me on a project..

    What happens is the team started designing page pieces instead of concentrating on the user experience and general look and feel, so when we returned to the home page we were making it out of boring little component parts designed for forms and copy blocks. We got designed into a corner and the client could tell.

    This ended up making the home page ugly and dull, so we wound up designing it differently from the rest of the site, causing a horrible ripple effect of design inconsistency across the board. We had to go back and change so much of the design to account for this.

    Use this technique with caution. My advice, design the home page first, but with the intention of coming back to it with a final sweep after the core of the site is completed.

  28. I came across this article after completing a redesign of our site, and agree with so much of what is written. The previous design (and copy) had dated, and upon reflection, the copy was very fluffy, and it was difficult to discern exactly what it was we were offering. The decision looks to be stating very obviously our main product, and mentioning the others, with a link through to an ‘about us’ page.

    I find the biggest issue is targeting to potential customers, instead of to people like ourselves. Once the page has received some much needed attention, we’ll be running it past people in our target market to see what they think.

  29. I stumbled across this article, and found it to be a pretty neat way of approaching web design. It’s always interesting to hear how others approach design projects, – in my opinion, there’s no right or wrong, but it’s enjoyable to try other methods out and see how they work for you.

Got something to say?

We have turned off comments, but you can see what folks had to say before we did so.

More from ALA

I am a creative.

A List Apart founder and web design OG Zeldman ponders the moments of inspiration, the hours of plodding, and the ultimate mystery at the heart of a creative career.
Career