4
Starting Well
Home Pages
,
People get to the information on web sites in many ways, as this illustration shows.
Blogs fit into this picture both as home page and as information page. The entire site may be a blog with the home page showing the latest post. A blog may be just one of many types of information on the site – reachable from the home page through a tab, link, or any of the other pathways in this picture.
In this chapter, we’re looking at home pages of information-rich and task-rich web sites whether people come to them on large screens, tablets, or mobile devices.
Home pages – content-rich with few words
Home pages must satisfy six basic functions:
1. Be findable through search engines. (Which site should I go to?)
2. Identify the site. (Did I get where I thought I was going?)
3. Set the site’s tone and personality. Inspire confidence and trust. (Who are you? Are you credible? Should I trust you?)
4. Help people get a sense of what the site is all about. (What can I do here?)
5. Continue the conversation quickly. (Can I start my task right here?)
6. Send each person on the right way. (Where’s the link I need? Where’s the Search box? Will Search help me?)
In this chapter, we’ll see how to accomplish all six functions without asking people to read much.
1 Be findable through search engines
When people type keywords into a search engine like Bing, Google, or Yahoo, they almost always click on one of the first few items in the search results. If you want people to come to your site through these search engines, your site has to be near the top in the search results.
You can pay for placement with search engines, but I’m talking here about placement in the organic (not paid for) search results.
SEO applies to every page in your site. We’ll talk about SEO again in later chapters because headlines, headings, and content high on the page matter for SEO – and they have to be coded correctly to be counted.
At the time I’m writing this, some key components of good SEO are
• keywords in the title that shows up at the top of the browser
Your keywords must match searchers’ keywords
People type their keywords into the search engine. If you want people to find you, you must have their keywords in your site. If your words and theirs differ, your site won’t come up for them.
You want to be first in the search engine results because the top-ranked result captures about 42% of the traffic. (Halligan and Shah, 2009, p. 58)
Gaming the system doesn’t work
Some people try to get high rankings by putting keywords all over the page – even as a background (called “black hat” techniques). But the search engine programmers know that. So the search engines throw out sites and pages that have the same words too many times on the page.
No one knows just what the threshold is for the search engines to say “too much,” but you don’t have to write a lot to get good SEO. Of course, in this book, I’m describing best practice (“white hat”) SEO.
Remarkable content matters
Search engines rank the quality of your site in part by how many other sites link to yours and the quality of those sites. As Brian Halligan and Dharmesh Shah say in their book, Inbound Marketing, “The best way to rank well in the Google search results is to create content that is rank-worthy.” (emphasis added)
Halligan and Shah also say that you want remarkable content, italicizing the front part of “remarkable” to remind us that the word means “worthy of other people’s remarks.” If you have a remarkable content strategy and remarkable content, you’ll do well in SEO.
2 Identify the site
People want to know “Whose site is this?” “Did I get the site I was going to?” And you want them to recognize the site, relate to your brand, and develop brand loyalty so that they’ll come back to the site.
Your site’s logo, name, and tag line must identify it. Don’t use a paragraph to explain the site. Don’t put paragraph-long mission statements on the home page. Most people won’t read them.
Instead, encapsulate your company or organization’s key message in a memorable tag line – a short phrase that tells people how to think about the site.
on tag lines and other aspects of home pages, pathway pages, and navigation: Steve Krug, Don’t Make Me Think!, 2005
Wilderness Travel does this well (Figure 4-1).
Figure 4-1 Wilderness Travel gives you a good sense of what they do in just seven words and a date.
3 Set the site’s tone and personality
Remember that your web site is part of a conversation. You set the tone for your side of the conversation by sharing the web site’s personality.
Web sites definitely have personalities – expressed in the site’s visual style (colors, graphics, typography) and content strategy (choice of content, writing style, words). Through those personalities, you establish trust with your site visitors (or not), credibility (or not), confidence that they will succeed (or not).
An interesting paper on web sites having personalities: Coney and Steehouder, 2000
Include notes about tone and personality in your style guide. Style Guide – Interlude 5 just before Chapter 15
In 2001, the U.S. Internal Revenue Service (IRS, the tax collectors) had a home page that looked like a tabloid newspaper (Figure 4-2).
Figure 4-2 The web site of the U.S. Internal Revenue Service in 2001
What personality should the IRS site have?
Does the 2011 version in Figure 4-3 do a better job of matching the personality you expect from the IRS? It may not be as exciting as the Digital Daily, but it is much more appropriate and useful.
As Margot Bloomstein, a content strategy consultant who helps organizations find the personality they want to express in all their interactions, says: What you want is “a brand that never breaks character—ever. This all comes down to how the content and visual design (along with interaction affordances and features) all work together to maintain a cohesive voice and consistently manifest the same communication goals, or message architecture.”
Bloomstein, Content Strategy at Work, 2012
Who decides on the site’s personality?
If you own the site (it’s your blog; it’s your company; you are an independent artist or writer; it’s your Facebook wall), you decide on the tone and personality you want to project.
However, if you are part of a larger organization, it’s not your decision alone. In fact, another group (Marketing, Corporate Communications, Web Services) may dictate aspects of the site’s brand – colors, layout, writing style.
Don’t arbitrarily reject those decisions. A lot of effort may have gone into choices within a content strategy, brand strategy, message architecture, social media strategy.
If you want to influence the site’s personality, get involved. Communicate up the chain and across groups. Become part of whatever teams are working on these issues.
As you consider the right tone and personality for the site, think broadly about all the organization’s site visitors, not just those who come for your part of the site. A web site is the whole organization’s face to the world.
4 Help people get a sense of what the site is all about
The trick here is to satisfy Goldilocks: Both too little and too much can keep people from understanding what the site offers.
To help you understand how your site visitors would sort and group content:
• Work with information architects. Morville and Rosenfeld, Information Architecture, 3rd edition, 2006
• Have users sort and group content cards. http://usability.gov/methods/design_site/cardsort.html; Spencer, Card Sorting, 2009
A useful home page
• makes it instantly clear what the site is all about
• is mostly links and short descriptions
• includes calls to action (verb phrases) for your primary site visitors that respond to the conversations they came to have
Smithville, a local broadband service provider in Southern Indiana, does this well while projecting its “we’re local folks just like you” personality (Figure 4-4).
5 Continue the conversation quickly
A successful web site picks up on the site visitor’s conversation right away.
Focus on your key visitors and their key tasks
If you try to give equal emphasis to all things for all people on your home page, you’ll end up satisfying no one. That’s why the planning in Chapter 2 is so important. Who are your primary personas? What are their primary tasks (conversations)?
Look at what Tricare, the military’s primary health care organization, did when they considered these questions (Case Study 4-1).
Case Study 4-1 Focusing on personas and tasks
The “old” Tricare home page looked like this:
When Dian Lawhon and her web team at Tricare considered this page, they thought about:
Among their primary site visitors are military families like Kyle and Susan.
The Tricare team realized that the old home page didn’t make it easy for Kyle and Susan to quickly move ahead in the conversation they came to have with the site. So they redesigned the home page to look like this:
The new Tricare web site is now a good conversational partner.
Tricare saw their satisfaction ratings go up 20 points after they launched the new site.
Let people start major tasks on the home page
The two primary conversations for Tricare are: I have a plan; answer my question about coverage. I’m new; help me choose a plan. The new site caters to both those conversations.
What are the primary conversations for your site? How can you quickly move those conversations along?
To move the first of the primary Tricare conversations along requires that the site visitor fill out a brief form. In fact, many tasks people come to do involve forms.
It’s been interesting to watch over the years as more and more forms come to the front of web sites. Years ago, travel sites required several clicks before you began to arrange your travel. Now they all let you start a reservation immediately (Figure 4-5).
Figure 4-5 When the most common task on a site involves a form, it’s a great idea to put the form high on the home page.
More on all aspects of web forms, including realizing they are about relationship, conversation, and appearance: Jarrett and Gaffney, Web Forms that Work, 2009. Design details for forms: Wroblewski, Web Form Design, 2008
Make sure the forms are high on the page
If you have forms on the home page, make sure they are easy to find – high enough to be seen immediately. The large pictures that many sites have on their web pages sometimes push critical tasks and critical information below what people see when the web page first comes up.
As people move to higher screen resolutions, some of the worries I had about this in the first edition go away. However, check your site with various browsers and monitors. Also, remember that people are now working on tablets, mobiles, and some are still on old computers.
Yes, many people today scroll down web pages; but I still see many people in usability tests who don’t scroll on home pages. If they expect something to be near the top of the page, they don’t go looking for it further down.
Don’t put unnecessary forms up front
Starting people on forms they want or need on the home page is good. Forcing people to fill out forms that they don’t want or need – or before they are ready to give you the information – is likely to be counterproductive.
Think carefully about the benefits and perils of asking for information when people are not ready to give it to you. If you ask too early, or you ask for too much, or you ask for information that people have to struggle to get for you, you risk losing more than you might gain. If you want people to spread the word in social media, don’t annoy their friends by asking new site visitors to fill out a form before getting what you offered through the social media link.
Consider the trade-offs. If you are asking people to register so you can market to them later, do you lose more than you gain by having people leave early? If people put in fake information just to get past your form, does that end up being a costly pain for you?
6 Send each person on the right way
The great irony of the home page is that it must both
Remember from Chapter 1: In the Nielsen and Loranger study, average time on the home page was 30 seconds.
For most sites, most site visitors’ task on the home page is to figure out how to move beyond the home page! You want them to do that by moving forward – and not by leaving the site.
Web sites give people only two ways to move:
Put Search near the top
If your site has search capability (and any large site should), put the Search box near the top of your web pages – and put it in the same place throughout the site. Don’t expect people to scroll to the bottom to look for Search as the site in Figure 4-6 does.
Having the Search box before other content also helps people who listen to the screen. Screen-reading software starts each page at the top. Imagine having to listen to the entire screen before finding where to type your search word.
Use your site visitors’ words in your links
When people come to your web site to start a conversation, they have a topic or question in mind. And they are saying that topic or question to themselves in their words. When they see links with those words, they gain confidence that you will satisfy their conversation. If they don’t see links with their words, they may conclude that you have nothing for them.
Headlines as links – Chapter 8 Other points about links – Chapter 12
Don’t use cute, made-up names for programs or projects or article headlines that aren’t going to make good connections for your site visitors. Cute doesn’t work if it doesn’t help your site visitors know where to click.
Don’t use your internal organization language for site visitors who don’t know that jargon. And don’t make people wonder which link to click on.
Look at the web site in Figure 4-7. Then, think about Don and Mariella Garcia who need to finance their new car. (Their story was one of our scenarios in Chapter 2.) What would they click on at this credit union’s site? Loans? Rates? Services?
Figure 4-7 Home pages have to help people choose quickly and confidently. Confusing tabs may hinder your site visitors.
If the tabs and links at your site confuse people, they may just leave without exploring further. You’ve lost their business before they’ve read any of your copy.
In mobile versions, strip down to the essentials
Mobile first! is a good mantra. It can help you focus on your primary personas and their primary conversations. It can help you let go of words.
Wroblewski, Mobile First, 2011; Hinman, The Mobile Frontier, 2012
On the small screens of mobile devices, your site visitors want to move ahead with the conversation even faster than they do when sitting at their desks. You don’t have room for everything. So, the key is to figure out who wants to use your site on a mobile and what their top conversations are – and then make those options clear and easy to find and use.
Compare Lufthansa’s web site and mobile app in Figure 4-8. The top task on the web site is booking a trip. The top task on the mobile is checking flight status. The link to book a flight is still there, just not first. And, of necessity, the form that’s on the home page of the web site is one click away – but easy to get to – on the mobile.
Figure 4-8 For your mobile site or app, focus on top tasks for site visitors who are using a mobile device. They may be different from top tasks for other situations.
Summarizing Chapter 4
Key messages from Chapter 4:
– Your keywords must match searchers’ keywords.
– Gaming the system doesn’t work.
– Remarkable content is what matters.
• Set the site’s tone and personality.
• Help people get a sense of what the site is all about.
• Continue the conversation quickly.
– Focus on your key visitors and their key tasks.
– Let people start major tasks on the home page.
– Make sure the forms are high on the page.
– Don’t put unnecessary forms up front.
• Send each person on the right way.
– Use your site visitors’ words in your links.
– In mobile versions, strip down to the essentials by thinking about who uses your site on a mobile and the information and tasks that they most want when using a mobile.