Scannability: organizing for the web

How you organize and format your writing can go a long way toward making it readable.

By David Walbert

View this page in context

Web Publishing & Collaboration Guide

LEARN NC works collaboratively with educators and other individuals from a variety of backgrounds to develop web-based resources for teachers and students. This manual guides educators through the process of developing content for publication on the web, including writing, design, technical guidelines, and copyright.

Page 1.6

Writing for the Web

How teachers can more effectively communicate information and ideas via the World Wide Web, to students, parents, colleagues, administrators, and the world.

Page 5

Learn more

Related pages

• Keep it short (but not too short): Shorter paragraphs and pages will help make your writing easier to read on the web, but you don't have to sacrifice important content.
• Lesson plans for teaching organization: A collection of LEARN NC's lesson plans for teaching organization, the second of the five features of effective writing.
• Organization: Organization, the second Feature of Effective Writing, should be addressed after a writer has established a focus and will help strengthen that focus.

Related topics

• Learn more about organization, web design, and writing.

Legal

When you read, do you read every word of every line, in the order they appear on the page? Or do you scan the page, absorbing chunks of text whole and skimming for the particular information you’re looking for?

Most effective readers use different strategies for different situations. If you’re taking a graduate course, you probably have too much reading to read every word of every assignment, so you learn to skim. If you’re reading poetry or a short story, you’ll probably read every word, because the style demands it and you are reading for leisure.

On the web, because of the demands of the medium, readers are more likely to scan the page than to read every word. A good writer has to take that into consideration when organizing and formatting a piece of writing and make writing scannable. But that doesn’t mean reducing everything to bulleted lists of key phrases. Here are some strategies for making longer and more complex writing scannable.

One main topic per page

If what you have to say fits conveniently on one web page (remember what we said earlier about page length), this won’t be a problem. If you have more to say than you feel comfortable asking people to scroll through, try to break it into easily digestible pieces. Each section should cover one major topic, and each section can have its own web page.

Once you’ve divided your writing into major topics, make sure readers can easily move from one topic to the next. Provide a table of contents on your first page or front page. Then clearly link each page back to the table of contents, or (if it’s a short list) include the table of contents on each page. If you intend the pages to be read in a particular order, you might also provide a link at the end of each page to the next page.

If you’re writing with the web in mind, you can organize what you have to say around major topics of appropriate lengths. Sometimes,though, you may be adapting a longer document for the web, and you may have to continue a single major topic onto a second or third page. In that case, at least provide an indication of what topics you’ll cover on the next page.

The inverted pyramid model

Each page, each major topic, also has to be clearly organized. Many people recommend that web writing follow the inverted pyramid model of organization commonly used in newspapers. In this model, you give the most important facts — the broad base of the pyramid — at the beginning of the article, and then provide supporting and background information as you go on. By the end of the article, the narrow tip of the pyramid, you’re providing information that will interest a few readers but is not vital to the story.

This model assumes that most people will not read the entire article — which is true for newspapers and true on the web. (It also anticipates an editor’s need to crop stories to make them fit a newspaper.) By giving the most important information first, you make sure that readers get that information even if they don’t read all the way to the end.

The inverted pyramid model is great for reporting facts, not so great for providing analysis. Even in newspapers, editorials, opinion columns, and analysis of news use the standard “pyramid” format. They begin by setting up the problem, provide evidence as they go, and gradually build to a conclusion. The first paragraph still tells the reader where the article is going, but since mere facts aren’t the point, readers are just going to have to tough it out and read the whole thing if they’re going to understand the author’s point.

Give readers a road map

Even if you don’t use the inverted pyramid model, make sure that you tell readers straight off where you’re going. Imagine that you’re asking them to go on a trip: you need to tell them their destination and, if possible, give them a road map at the start of the journey. The thesis statement in a traditional essay tells readers their destination, then takes them on a journey through evidence and argument to a conclusion.

You may want to give readers an abstract of your text, a one-paragraph summary that appears at the top of the page. If they like what they read here, they’ll read the whole document. This would be perfect for posting your teaching philosophy, for example: write the long version for committed readers but provide a brief summary for parents checking you out from a public library.

For other types of writing — say, a lesson plan — you may want to include a bulleted or numbered list of your main points in your abstract. You can take this a step further by turning this list into a mini-table of contents, providing links that take readers to anchors down the page. (This requires some fancier HTML, but it’s well within the capacity of Netscape Composer or Microsoft FrontPage.)

Headings and subheadings

Even a single page of text will likely cover multiple topics. You can help your readers see those topics by making them into headings, as I have done in this article. Each heading should be clear and informative — it’s tempting to be cute, I know, but try to keep things simple and straightforward.

Clear headings help web readers in at least three ways. First, they allow them to skim the page before reading, to see if they’re really interested. (I may not be typical, but I often scroll partway down a page to see what’s ahead before starting over from the top.) Second, clear headings help a reader who is scanning the page for a particular topic. And third, they help a reader find her place who has followed a link off your page and then returned.

If you mark up your text with an HTML editor like Netscape Composer or Microsoft FrontPage, this is the time to use those heading tags — H1, H2, and so on. H1 is generally used for page titles. On LEARN NC, we use H3 for main headings within a page — the headings on this page are marked as H3. For subheadings or less-important headings (as in a webliography), we use H4.

If you aren’t using an HTML editor, at least make your headings bold and use a larger font, or even a different color. The point is to draw attention to them.

Topic sentences

A topic sentence is the first sentence of a paragraph that tells the reader what the paragraph is about. Strong topic sentences are a key to good organization in almost any kind of writing, but especially so on the web, where readers are more likely to skim. The basic technique of skimming is to read the first paragraph of an article or chapter (or the introduction) and the first sentence of each paragraph.

You can help readers along by making sure that the first sentence of each paragraph really does tell what the paragraph will be about. Don’t hide important points in the middle of a paragraph; if you have something vital to say, start a new paragraph. To test yourself, read only the first sentence of each paragraph out loud and see what’s missing. Of course you can’t say everything in one sentence per paragraph, but they should provide a pretty good summary.

Highlight key words and phrases

A last technique to help people scan a page of text is to put key words and phrases in boldface. This is something I prefer to use sparingly; used too often, boldface can be like the car alarm going off in the parking lot: nobody pays attention after awhile. But used judiciously, it can draw readers’ attention to topics and points they might otherwise miss.

I used this technique earlier in this article. Under the heading “Give readers a road map,” above, I offered two distinct suggestions: an abstract and a mini-table of contents. These didn’t merit their own headings — they were only one paragraph each — but I wanted to make sure readers saw them.

(A hint if you’re using HTML: Although the result in most browsers is the same, use the strong tag to indicate strong emphasis rather than b for boldface. Similarly, use em to indicate emphasis rather than I for italics. Why? It’s in keeping with the spirit of HTML, which is to describe the content of the text rather than the visual style. This is important for visually impaired users accessing your page with text readers. Of course they won’t be visually scanning your page for highlighted text, but they’ll know it when they come to it; while boldface won’t mean anything to them, emphasis can be spoken as well as seen.)