6
Breaking up and Organizing Content
,Huge documents, dense web pages, and most PDFs are like lectures where one person (the writer) takes up all the time and space. Successful web experiences are conversations.
Over the next four chapters, we’ll look at various aspects of this key guideline: Don’t hog the conversation.
We’ll work on
• breaking up and organizing your content (this chapter)
• answering site visitors’ questions, letting go of words, layering content, starting with key messages, and breaking up walls of words (Chapter 7)
• announcing your topic with an informative headline (Chapter 8)
• writing useful headings within the topic (Chapter 9)
In this chapter, we tackle four important guidelines:
1. Think “information,” not “document.”
2. Divide your content thoughtfully.
1 Think “information,” not “document”
Most people come to the web for information, not for a complete document. They don’t want the manual; they want instructions for the task they are doing. They don’t want the handbook; they want the answer to a question. They want usable, manageable pieces.
Right information in the right amount at the right time to the right person in the right medium should be your mantra. Deciding how to do that is part of your content strategy.
Need: Right information in the right amount
Do you get benefits – health, retirement, vacation – from your employer? How do you get information about those benefits?
In the old, paper-based days, you probably had a three-ring binder of all the information about all your benefits. But did you ever read it all the way through? Probably not.
And even if you read it through once, you almost certainly used it differently. You went to it only when you had a question. And you wanted to find just the answer to that question as quickly as possible.
You were having a conversation with the benefits information – a conversation that you started. You wanted the book divided into many topics with easy access to just the one you needed at that moment.
Problem: Little pieces of paper get lost too easily
What if, instead of the binder, your employer gave you a set of paper index cards with one topic per card all shrink wrapped? Would you have been happy?
I’m sure you said no. Even though you only want one topic, that stack of paper index cards would be hard to store and use.
Solution: Online, “index cards” work well
As we move away from paper, the problem of losing those separate cards goes away. You can think about information in much smaller pieces – satisfying each conversation on a separate index card.
Of course, you’ll have web pages = index cards of different lengths – some covering just one question, some covering several questions that are all part of the same conversation. And you need to make each web page = index card easy to find through good pathway pages and writing that matches site visitors’ search terms.
Thinking of content as index cards brings us to questions about how best to break up and organize content. At a high level of organizing information across a web site, that’s information architecture. Let’s start there. Then, we’ll move down to look at issues in breaking up and organizing specific sections of a web site.
2 Divide your content thoughtfully
Information architecture is a critical part of carrying out your content strategy: How do you divide up and organize the wonderful, valuable content throughout your site? In this section, I’ll explore these seven ways with you:
Card sorting is a great usability technique for finding out how the people whom you want to use your site would sort and group the content. http://usability.gov/methods/design_site/cardsort.html; Spencer, Card Sorting, 2009
Divide web content by questions people ask
Many site visitors come with a specific question. Using those questions is a great way to break up and organize your content at all levels of a site.
Our guy who wants to know the value of his car might well go to the Kelley Blue Book site (Figure 6-1).
Figure 6-1 The folks at Kelley Blue Book know that most people come with one of these four questions.
Divide web content by topic or task
Topics are categories of information that are natural groupings for people’s questions. Tasks are actions people want to or should take. Tasks answer “How do I…?” questions.
For both topic and task, use your site search analytics to know what people are looking for and the words they use.
For topic and task, the question to consider is “granularity” – “grain size” – how much of one task or topic to put together on one web page. Consider some of the other ideas in this section. Also see the next part of this chapter.
The distinction between topic and task may be fuzzy. For example, on the day I grabbed the screen in Figure 6-2, the most popular topic at the Fitbie web site was Simple Ways to Cut 500 Calories. The topic answers the site visitor’s conversation: “I need to lose some weight. I know I have to cut calories. How do I do that?” It’s a topic that leads to calls to action and tasks.
Divide web content by product type
Most e-commerce sites use product type as a major divider for their information architecture. That works when site visitors know what type of product they are looking for. A grocery chain, like Waitrose in the United Kingdom, typically divides its site by the type of goods it has to offer (Figure 6-3).
Divide web content by information type
Most sites organize by type of information for at least some of their content: News goes in its own section. Perhaps Events is a section by itself. E-commerce sites often have a separate section on how to use or take care of their products.
Separating and linking related information
Setting up your information architecture by type of information is often a good content strategy. But so is making sure that site visitors can easily move laterally to related information that sits in a different category. For example, link both ways between
• a policy and the procedures for carrying out that policy
• tips or advice about a topic and products related to that topic
• the news release about a research study and the research report
The University of Otago in Dunedin, New Zealand, keeps policies and procedures on separate, but linked, pages, as you see in Figures 6-4 and 6-5.
Moving the conversation ahead through related links
On each web page, ask yourself: Where would site visitors want to go now? It might be to a related piece that is in a different “information type” bucket. When you include those related links, you help people get to the next part of the conversation they want to have.
Although many sites are much better at this type of cross-linking than they used to be, I still see missed opportunities. Sometimes, the lack of linking is a sign that one part of the organization doesn’t know that another has relevant information. Break down those silos!
Expand your content strategy beyond a single silo, department, group, or medium. Do a content inventory and content audit to find all the information on a given topic, wherever it is in the organization. Use content strategy and information architecture to organize your web site to meet site visitors’ needs – not to reflect internal structures.
Meshing marketing calendars and editorial calendars
I also see marketing sites where the tips or advice (“features,” “articles”) don’t directly relate to any product. The content writers seem to be in a different world than the product marketers.
If that’s true for your site, get the marketing team and the editorial team together. Include them both on the team developing the content strategy.
Make sure they understand the content strategy and their roles in carrying it out. They must work together to see that every piece of content on the site supports the business goals.
Divide web content by people
Another useful way to divide and organize your web content is to think about who is going to use the information. Separating information for different site visitors may work well at many levels within a site.
Dividing by people on the home page
On some web sites, it makes sense to keep information for different people totally separate and have your site visitors self-identify right on the home page. The Tricare site in Chapter 4 (Case Study 4-1) now clearly divides information for new people from information for people already on one of the Tricare plans.
Here’s another example: Husqvarna, a Swedish company that sells mowers, trimmers, chainsaws, and more, divides site visitors into five groups, as you see in Figure 6-6.
Consider, however, these three concerns:
• People have to instantly identify the right group for what they want.
• They have to want to be associated with the name you give their group.
• The same person may be in different groups on different visits.
People have to instantly identify the right group. If your site visitors have to think about which link to choose – or if they might start down a wrong path – this way of dividing information may be more frustrating than helpful.
They have to want to be associated with the name you give their group. Having a section for “Geeks” probably wouldn’t be well received at many sites, but it works well for the Exploratorium – a hands-on museum of science for kids of all ages (Figure 6-7).
Figure 6-7 If you organize content for different groups, be sure those groups like the names you choose.
The same person may be in different groups on different visits. Each visit to your site is a separate conversation. And people can wear many different hats. So they may come one day in one hat for a conversation with one part of your site and then come again in a different hat for a conversation with a different part of the site. You need to help them see clearly which group they belong to for each conversation.
For example, I own a business in which I am both an employer and an employee. If I were in the United Kingdom and had to deal with the tax office, how would I choose the right group at the HMRC web site (Figure 6-8)?
Figure 6-8 The same person may be an employee, an employer, and owner of a business.
Consider whether some people will feel excluded or confused if you divide information by “who you are.”
Dividing by people below the home page
Having different content for different site visitors doesn’t have to start at the home page. It may be relevant only for some of your content. In Chapter 2 (Figure 2-3), you saw how the U.S. National Cancer Institute offers two sets of information for each type of cancer, suggesting one set for patients and their families and the other for health professionals.
Here’s an example from an e-commerce site: Figure 6-9 shows how Bed, Bath, and Beyond helps both gift getters and gift givers on the page for Wedding and Gift Registry.
Figure 6-9 You might divide information by role for content below the home page.
Divide web content by life event
On some sites, the content is for people at different stages of life. These sites are often about babies or elders – focusing on getting started or on retiring. Figure 6-10 shows how Baby Center takes families from before pregnancy through their child’s life stages.
Divide web content by time or sequence
Our seventh and last way of dividing content is by time or sequence. Something happens first, then something else, and so on. For example, Bank of America takes site visitors through a series of interactive videos to help them make good decisions about buying a home (Figure 6-11).
Figure 6-11 Although you can work through these interactive videos in any order, the sequence helps site visitors see the steps in buying a home.
Don’t organize by your org chart!
I’ve shown you several ways that work well for organizing web sites. The one way that does not usually work well is having the web site mirror your internal organization.
Your content and information architecture should not rely on your site visitors knowing the internal workings of the agency, company, or nonprofit.
Most site visitors do not know what topics or tasks belong to which part of the organization. Nor do they care! They just want to satisfy their goals, their needs, their conversations. Your web site and social media succeed only by satisfying your site visitors.
3 Consider how much to put on one web page
So far in this chapter, we’ve talked about web content as index cards rather than big documents. We’ve talked about ways to think about content for your content strategy and information architecture. Now we need to talk about “grain size.” How much information should you put together on one web page?
One page or separate pages? To decide wisely, ask yourself these questions:
What does the site visitor want?
What conversation does the site visitor want to have with the site? How much information does the site visitor need to satisfy that conversation?
If the content that you now have on one page is actually for different conversations, perhaps it should be divided into several small pages (the index cards we talked about at the beginning of the chapter). Here’s an example:
In the first edition, I showed a page from the Australian bookstore, Dymocks. At that time, Dymocks had every bit of their customer service information on one extremely long web page (Figure 6-12). Whether you were looking for the company’s privacy policy, how to use its shopping basket, or whether you can return an item, you got to the same web page. You then had to find your question among the 23 topics on that one extremely long web page.
Figure 6-12 Dymocks’ Help page in 2006
The only conversation that page supported well was the very unlikely one, “I want to read all of your customer service policies and procedures.” Much more likely conversations for customer service are ones like these:
None of these site visitors wants to see the entire customer service page. They each want only the answer to their question – by itself.
For almost all site visitors, a more useful interaction design would be a pathway page with each topic leading to an “index card” – a web page that covers just that topic. That’s what Powell’s of Portland, Oregon, has been doing for many years (Figure 6-13).
Figure 6-13 If each topic answers a different conversation, giving each topic its own web page makes sense.
I’m happy to report that Dymocks got at least part of the message. Their web site now breaks that long page into 12 pages (Figure 6-14).
For large documents, large reports, large sets of disparate information, use the index card model: Create a mini web site with a table of contents (pathway page) where each link leads to a separate page for that part of the document or report or for each topic in the set.
Write informative titles or headlines for each topic. Write informative headings for each section that you break out from a large document or report. Headlines – Chapter 8 Headings – Chapter 9
How long is the page?
Even in the Powell’s model, you have to consider how much information you have on each topic: How long would each “index card” have to be to cover everything about a single topic?
Most people today will scroll vertically (not horizontally) if the page layout indicates that the page continues. But they won’t scroll forever. Think of three or four scrolls’ worth as a maximum length for a web page.
What’s the download time?
You may be working on a very fast connection. Your site visitors may not. And consider the mobile experience. On mobiles, downloads can happen very slowly, even if the provider claims high speed connections.
Conversations should proceed smoothly. If people have to wait a long time for your response, they may be annoyed – especially if your response includes much more than they wanted.
On the other hand, if you break the information onto many small pages and your site visitors need all of it to get what they need, waiting for each one to load may be annoying. You’re conversing in fits and starts, not smoothly. And the time between pages may make it hard for site visitors to put the information together in their heads.
So you have to think about the issue of download time together with the issues of how much of the information people want and how connected it is in their minds.
How much do people want to print?
If people want just one part of the information and have to print pages and pages to get it, they waste ink, paper, and time. That’s frustrating. If you break the information into very short pieces and people have to print several web pages in succession to get what they need, that’s also frustrating. So you have to consider who will want to print and what they will want to print.
Make sure that your pages print well. Always include a way for people to print the content without losing the end of each line of text.
To cover many possibilities, you can offer options as the U.S. National Cancer Institute does for some of its content (Figure 6-15).
You can also show the information as small index cards but print it as one page. The Mayo Clinic does this as you can see in Figures 6-16 and 6-17.
Figure 6-16
Figure 6-17 You can separate parts of an article online and put them together for printing.
The Mayo Clinic gets great SEO for this article for both infant jaundice and baby jaundice at Google, Yahoo, and Bing. The headline is right on target. Each section has the keywords in the first line. I’m not sure how search engines count this, but it’s interesting to note: Although the article is broken into “index card” pieces, each piece is actually a section of the same URL.
What will I do for small screens – and for social media?
The index card model is really important for mobile. In fact, planning for mobile may help you break up and organize your content into very small chunks, as the writers at the U. K. government site, Directgov, have done (Figure 6-18). And, as you write those small chunks, you can think of extracting key messages for your social media conversations.
Figure 6-18 If you break up and organize into small pieces, you can make both your full web site and your mobile version converse well with site visitors.
4 Use PDFs sparingly and only for good reasons
PDF is a way to publish documents online that anyone can open, read, and print as long as they have Adobe Acrobat Reader. A PDF file keeps the layout, page breaks, and fonts of the original document or slide deck.
PDF = portable document format
PDF from Adobe Systems, Inc. www.adobe.com
Never say “never”
I’m sure you see how different a PDF is than the conversational, index card model that I’m advocating. However, I’m not going to say, “Never put up a PDF file.” As always, it comes down to your goals, your site visitors, and their conversations. And often it also comes down to budget. But remember that in most cases, PDF is a way to deliver print information.
When might a PDF file be appropriate?
If you are using your web site to distribute white papers, annual reports, journal articles, or other material that you expect people to print and use on paper, and if your site visitors are comfortable with PDF files, PDF may be the right way to go.
Distribution is the great advantage that the Internet has over paper, even for paper documents.
• You save printing and shipping costs; you shift printing to readers.
• Many people would rather go online than trudge down to the physical library.
• People can get what they want any time – no need to know when the library is open; no need to work only in daytime.
• Searching online may be quicker than hunting in the library – no need to understand the way the library organizes journals; no need to hunt through the library shelves; no worries that someone has already taken out that issue or cut out the article.
• Even people who don’t live near a library or who are in countries where mail delivery is slow or unreliable can get instant access.
But you don’t need PDF to get information to anyone, anywhere, at any time. The Internet serves all these distribution needs through regular web pages, too.
Another appropriate use of PDF is fillable forms, where you need people to fill out what is essentially still a paper form. With PDF, you can set up the form so people fill it out online and send it to you online.
Sometimes, having both PDF and HTML is best
The web sites of most professional journals give subscribers the option of both PDF and HTML versions of articles. In my usability studies for two different journals, I found the same results: Subscribers like having both versions. They use them differently. When they need to study the article carefully offline, they save or print the PDF. When they want to skim the article, check a fact, grab a quote, or use a graphic (with permission and credit), they choose the HTML.
For white papers, annual reports, and other compilations of information, you might also want to offer both PDF and HTML of the entire document. But you also should consider setting up the content in small, reusable pieces that you put together in different ways.
For example, the white paper might be a PDF that you want people to download. But you might also have a series of blog articles from different points in the white paper. You might extract key message tidbits for social media messages. You might pull pieces of the information into HTML pages. And in all of these formats, you link to the other options. This increases your inbound links, helps your SEO, and contributes to marketing your content.
When is a PDF file not appropriate?
For many situations, however, PDF is not the way to build a useful, usable web site – especially when the PDF is the only way you offer the information. PDF is a poor choice when your site visitors
• don’t want the whole document
• are mostly on mobile devices
• are not comfortable with PDF files
• need accessible information (And you should always consider accessibility!)
When people don’t want the whole document
If your site visitors come for information and the PDF has more than they need, a PDF defeats the very purpose and nature of the web.
Yes, PDF files are searchable, but people don’t want to first navigate or search to get the document and then have to navigate or search in a different way within the document.
Yes, you can have a linked table of contents that lets people jump to a specific place in a PDF document; but most PDF files are just put up on the web with no attention to internal links.
When people are mostly on mobile devices
Reading a PDF on the small screen of a smart phone has to be a pretty excruciating experience.
When people don’t want to print
Why make the document look just like paper if it is not meant to be used on paper?
For example, a two-column layout works well on paper. It doesn’t work well on the screen if you can’t see the entire page without scrolling.
When people are not comfortable with PDF files
If your site visitors include many people from the general public, don’t assume that they all know what PDF is, have the software downloaded, or are willing to download anything new. If some of your site visitors are on slow connections, think about their frustration in waiting for a large PDF to open when all they need is a small part of the information.
When people need accessible information
Adobe Acrobat now supports setting up a PDF for assistive technology to read well. But …
• For a PDF to work well with a screen-reader, the author has to set up the file with correctly marked headings, appropriate tags for images, and other elements that the screen-reader needs. Many PDFs aren’t well set up.
For help in making new or existing PDFs accessible: http://www.adobe.com/accessibility/products/acrobat/
• If you just scan a document, it becomes a graphic file and is not accessible. You can make scanned documents accessible through optical character recognition (OCR), but many people don’t.
For help in making a scanned file into an accessible PDF: http://wac.osu.edu/pdf/scan/pdffromscan-textonly.html
Many people who use screen-readers still bypass PDF files. They have seen few examples to change their expectation that the document will not be accessible.
Why else is a PDF not appropriate?
Two more reasons for not using PDFs:
PDF files are optimized for the printed page
A typical PDF is in portrait orientation. Most site visitors are looking at landscape-oriented screens.
PDF files usually come from paper documents
If the author was still in “paper mode,” or “document mode,” or “book mode” when writing what becomes the PDF file, it’s very likely that the writing isn’t going to work well on the web. The paragraphs will be too long. The headings will be too sparse. The author likely assumed that people would read the document from first page to last.
Most old PDFs just aren’t good at conversing with your site visitors. For all these reasons, make part of your content strategy a plan to remove old paper-based PDF files – turning those that still have important information into usable, useful web content.
Summarizing Chapter 6
Key messages from Chapter 6: