In part three of this five-part series, I look at the need for scannability in writing for the web. This will form part of a forthcoming book on online journalism – comments very much invited.

Users of news websites are generally task-oriented: they will most likely have arrived at your webpage through a search for something specific. If they don’t find that something specific fast, they will go elsewhere.

How do they find that something? Seventy-nine percent of Web users scan pages. They look for headlines, subheadings, links, and anything else that helps them navigate the text on screen.

Of course, the tendency is not limited to the web. Over hundreds of years print newspapers and magazines have developed a number of techniques to help ‘browsers’ – the headline, the sidebar, the photo, the caption, the subhead, and the inverted pyramid; broadcast news also has its techniques: the intro, the establishing shot, the actualite.

Online news borrows from both, but because it is a medium where users are active readers, scannability is key to effective online journalism. There are a number of techniques that enhance the scannability of any webpage:

• Clear, unambiguous headlines: a reader scanning down a list of search results is not always going to be willing to decode cryptic or punny headlines. They just want to know what the article is about. Also, an online audience is an international audience. They may not understand a culturally-specific pun or clever wordplay, so keep your online headlines clear, functional and unambiguous. More to the point, if you use a key word or phrase in your headline – such as the name of the subject of the story – it will improve your search engine rankings for that word or phrase. For example, the New York Times print article ‘For the Young, Politics Is Social’ was reheadlined ‘Finding Political News Online, the Young Pass It On‘ because people are more likely to search for ‘finding political news online’.
• Intro-as-summary: sound the death knell for the delayed drop. Having your first par sum up what the story is about is useful for many reasons: it is likely to be displayed alongside a link to the story in search results; readers using screen readers will know quickly if the story is relevant to them; and readers using RSS readers will be able to see at a glance whether the story is worth reading. Also, search engines attach more importance to the first paragraphs of a webpage, so including key words there will improve your search engine ranking.
• Subheadings: breaking an article every few paragraphs with subheadings that indicate the content to come gives the reader numerous entry points into the text. Again, make them as clear as possible.
• Bullet or number lists: see how this bullet list caught your eye as soon as you looked at the page? These work brilliantly online – any chance you get, use them.
• Indented quotes: users often look for direct quotes. Help them by indenting any quote that runs over one line (blogs do this very well).
• Hyperlinks: the conventional blue, underlined text screams ‘click me’ and, in blog convention, shows you are supporting your argument. You may be concerned that linking means people will leave your site. Well of course they will: it’s the web, stupid. But because you gave them that lovely, useful link, they will come back time and time again. Until you stop linking.
• Emboldened or highlighted words: this is a good way of highlighting key phrases or words in your piece and again gives the user entry points into the text. Use it sparingly or it loses its impact (note: some websites render links as highlights, in which case avoid. And never underline text for emphasis – it will look like a link and frustrate the user).

Accessibility and Search Engine Optimisation (SEO)

There is a further benefit to making your online journalism scannable: accessibility.

People with limited vision or blindness who use screen reading software will generally browse a webpage by setting it to read out headings and links first (in HTML there are six levels of headings, from h1 to h6. These indicate the level of importance of the heading, with h1 being most important). Adding clear headlines and subheadings means they won’t have to listen to 300 words before they hit the part they want.

If you’re a hard-nosed business type who couldn’t care less about users with screen readers, consider this: the biggest blind users of the web are search engines.

Search engines, quite logically, place higher importance on headings, subheadings, links, and bold text. It helps them index your content, so the more effectively you use these the higher you are likely to be listed, and the more visitors you will have. They also place a lot of importance on your page title (that bit across the blue bar at the top of your browser), which is usually generated from your article headline, so the headline is actually doubly important (if it only says the name of the publication, kick someone).

If you really want to make your headlines optimised for search engines you might also want to consider using something like Google’s Keyword Tool, which will suggest the most popular searches based on the word or phrase you type in (by the way, try a search for your own newspaper and scroll down to ‘Additional keywords to be considered’ to find out what other things your readers are searching for).

The first two words are crucial

Jakob Nielsen has done a lot of work looking at how website users read webpages. In particular, he has found that users read in an F-shaped pattern – the implications of which it’s worth quoting in full:

“Users won’t read your text thoroughly in a word-by-word manner. Exhaustive reading is rare […] Yes, some people will read more, but most won’t.

“The first two paragraphs must state the most important information. There’s some hope that users will actually read this material, though they’ll probably read more of the first paragraph than the second.

“Start subheads, paragraphs, and bullet points with information-carrying words that users will notice when scanning down the left side of your content in the final stem of their F-behavior. They’ll read the third word on a line much less often than the first two words.”

Because of the last point, Nielsen also writes that passive writing works better in headlines online, because it allows you to “front-load important keywords in headings, blurbs, and lead sentences. This enhances scannability and thus SEO effectiveness”.

This runs counter to basic training in headline writing, and so it’s worth adding some qualifications.

Firstly, it’s safe to say the classic ‘Man Bites Dog’ is still better than ‘Dog bitten by man’ online, because it’s short, and a scanning reader will still ‘get it’. But anything longer bears careful consideration. Nielsen’s own example is that:

“Yahoo Finance follows all 13 design guidelines for tab controls, but usability suffers due to AJAX overkill and difficult customization.”

changes to:

“13 design guidelines for tab controls are all followed by Yahoo Finance, but usability suffers due to AJAX overkill and difficult customization.”

To take a more specifically news-based example:

‘Tesco backs ban on cheap alcohol‘

will work better as

‘Cheap alcohol ban backed by Tesco‘.

Essentially the question becomes “Which opening two or three words will be most attractive and useful to scanning readers?”

In this case ‘Cheap alcohol ban’ is more useful and relevant than ‘Tesco backs ban’.

By the same logic, ‘Man bites…’ is more useful than ‘Dog bitten…’, which is why ‘Man Bites Dog’ still wins out.

And the principle extends to standfirsts, first pars and subheadings too.

Nielsen also says:

“Given that users often read only a couple of words from each text element, you should reduce duplication of salient keywords.

“Don’t use the same initial keywords in your headline and summary. You have 4 words to make your point, so use 4 different words.

“Avoid repeating any headline words in the summary, except for the most important one or two keywords. You can repeat these halfway through the summary to reinforce them for people who scanned past them in the headline.”

One final note: if that use of the numeral “4” annoyed you as it did me (old editing instincts die hard), Nielsen also writes that numbers work best as numerals online:

“numerals often stop the wandering eye and attract fixations, even when they’re embedded within a mass of words that users otherwise ignore.”

Why? Because numbers represent facts, he argues. And users’ eyes locate numerals more easily

“The shape of a group of digits is sufficiently different from that of a group of letters to stand out to users’ peripheral vision before their foveal vision fixates on them. 2415 looks different than four, even though both consist of 4 characters.”

“Digits enhance the scannability of Web content. It’s that simple.”

Linking effectively

Links are the lifeblood of the web – and one of the first things people look for when they visit a page: not because they want to leave your site (yet), but because they want to see what value your webpage offers in terms of resources and guidance.

What they don’t want to see as they scan down the page is this:

Click here

It doesn’t matter what sits either side of those two words – “Click here to read..” or “…to find out more click here” – because that’s not what users will immediately see.

A link should make sense on its own. It should be succinct, and unambiguous. Overheid.nl’s guidelines on ‘Writing good link text‘ gives the bad example:

“The SP refers to statements which the mayor made in March.”

Is this linking to the SP? The referral? Or the statements? They instead suggest:

For the same reason you should deep link wherever possible – that is, link to a specific page within a site, not its homepage. Homepages are updated frequently, so the headline story you link to today will be gone tomorrow. For example:

“The BBC reports today on rising gas profits” (link to http://news.bbc.co.uk/)

is bad.

“The BBC reports today on rising gas profits” (link to http://news.bbc.co.uk/1/hi/business/7256096.stm)

is good (and more succinct, too).

Finally, if you are linking to anything other than a webpage – e.g. PDFs, images, Word documents, spreadsheets – it should be made clear, e.g. “In the report (PDF)“.

This will avoid frustrating users who would otherwise wonder why their browser is booting up Word/crashing/displaying an error message: remember that the user may not have the software to open that document – particularly as more people use mobile phones to browse the web.

You might also add information about file size and download times. More information on this at Overheid.nl’s Web guidelines on ‘Links to downloadable files‘.

Low-literacy users

Having said all this about scannability, I want to add a final exception: if your site is aimed at low-literacy users you should not accept all of the above as gospel. In fact, given that Nielsen estimates that 40% of web users will be low-literacy by 2010, you should definitely read his post on how low-literacy users read anyway.