3. S K I M M I N G A N D S A T I S F I C I N G
• F Patterns
• Headings and links
• Images and captions
• Bold phrases
4. F P A T T E R N S
Source: Nielsen Norman Group, F-shaped Pattern
for Reading Web Content, April 2006
5. M O B I L E S C R E E N S I Z E S
[ F I N D P E W S T A T S O N M O B I L E U S A G E ]
6. 91%
of all Americans own a cell phone
Source: Pew Research, Cell Internet Use 2013
7. 34%
of cell phone internet users
mostly use their phones
to access the internet
Source: Pew Research, Cell Internet Use 2013
8. 4 years
proportion of cell owners who
use their phone to go online has doubled
(2009-2013)
Source: Pew Research, Cell Internet Use 2013
9. O T H E R W A Y S O F R E A D I N G A N D
N A V I G A T I N G
• Screen readers
• Keyboard controls
10. S C R E E N R E A D E R S
• Software that reads screens to the blind
• Reads everything aloud, in order
• Can read only headings
• Can read only links – out of context
11. S C R E E N R E A D E R D E M O
https://www.youtube.com/watch?v=2PMuBQ7LyOw&t=5m1
0s
12. I M A G E S
• Images must have a text alternative
• Captions are optional
• Alt text
• Describe the image for the visually impaired
• How it looks, not who/what it is
• Captions
• Identify people and places
• Credit the photographer (when necessary)
13. A L T T E X T
A dark-colored beetle with
bright yellow stripes and red-
brown legs perches on a
plant with spindly yellow
flowers
The Locust Borer is a pest
affecting the black locust
tree. Both are common in
Eastern North America.
(Photo courtesy of
WikiMedia)
C A P T I O N
14. T R A N S C R I P T S
• Audio: for the hearing impaired
• Video: for the visually impaired
• Required for accessibility
• Also helpful for search engines
15. T A B L E S
• Provide a summary of the table’s highlights or trends
16. P D F S
• Text PDFs vs. scanned images
• Can you select the text?
• Document Properties
• Title
• Author
• Summary
• Does this document need to be a PDF?
• Probably yes / Probably no
20. A C C E S S I B I L I T Y I S S U E S
• Structure vs. presentation
• Alt text
• Transcripts
• Link text
• Keywords
• URLs
21. S E A R C H E N G I N E O P T I M I Z A T I O N
• Structure vs. presentation
• Alt text
• Transcripts
• Link text
• Keywords
• URLs
22. A C C E S S I B I L I T Y & S E O
C H E C K L I S T
• Are headings styled as headings?
• Do all images have alt text?
• Do audio & video have transcripts?
• Do graphs, charts, and tables have summaries?
• Do image map regions have alt text?
24. H E A D I N G S
• Page title and subheadings
• Keywords
• Questions!
• Heading styles, not bigger and bolder
Source: Usability.gov, Writing for the Web, June 2014
25. G O O D H E A D I N G S
• Verb phrases:
• Filling out the Application
• Sentences:
• You Must Get a Permit
• Phrases with pronouns and verbs:
• What You Must Do First
• Where do I get a permit?
Source: plainlanguage.gov, Headings, by Ginny Redish
26. G O O D H E A D I N G S
“How to” buries the action
• How to get a permit
• How to fill out the permit
• How to change your
address
• Getting a permit
• Filling out the permit
• Changing your address
Source: plainlanguage.gov, Headings, by Ginny Redish
27. S T Y L I N G H E A D I N G S
• Use Word heading styles
• Don’t make headings bolder and bigger
• Heading styles become HTML heading tags
• Structure conveys meaning
• Search engines
• Screen readers
• Appearance is meaningless
29. C H U N K I N G
• Subheadings
• Prioritize
• Bullet lists
30. C H U N K I N G E X A M P L E :
H I S T O R Y O F T E X A S A & M F O R E S T
S E R V I C E
• By subject
• Establishment and early leaders
• State forests
• Urban forestry program
• Fire protection program
• Seedling nurseries
• By date
31. P A R A G R A P H L I S T S
The objectives of the Texas Forest Service were to
persuade and aid private owners of forest land in
practicing forestry and converting submarginal agricultural
lands to productive forests; to protect private forest lands
against forest wildfires, insects, and disease; to inform the
public of the contribution that forests, a renewable natural
resource, make to the economy of the state; to educate
Texans in uses and abuses of forest products; and to
assist forest products industries in developing new
products and improving production techniques.
32. B U L L E T L I S T S
•The objectives of the Texas Forest Service were:
• to aid private landowners in practicing forestry and converting
submarginal agricultural lands to productive forests
• to protect private forests against wildfires, insects, and
disease
• to inform the public how forests contribute to the state’s
economy
• to educate Texans in uses and abuses of forest products
• to help industries develop new products and improve
production techniques
33. O M I T N E E D L E S S
W O R D S
“ C U T T E X T B Y H A L F ,
T H E N B Y H A L F A G A I N . ”
34. E X A M P L E
Like the term “weeds”, insect
pests should be reserved for
those insects causing
unreasonable problems to the
products we are trying to
produce.
35. U N N E C E S S A R Y ? R E D U N D A N T ?
Like the term “weeds”, insect
pests should be reserved for
those insects causing
unreasonable problems to the
products we are trying to
produce.
36. R E P H R A S E
Like “weeds,” the term “pests”
should be reserved for insects
causing unreasonable
problems.
Source: plainlanguage.gov, Wordiness Made Spare
37. P L A I N L A N G U A G E V S .
B U R E A U C R A C Y
“Online readers expect a personal, upbeat tone in web
writing.
They find bureaucratic writing so offensive and out-of-
place that they simply ignore the message it's trying to
convey.”
Source: New York University, Writing for the Web
38. P L A I N L A N G U A G E I N
G O V E R N M E N T
• Plain Writing Act of 2010
• PlainLanguage.gov
• Usability.gov
• Center for Plain Language
39. E L I M I N A T E J A R G O N
• Arcane industry terms
• Acronyms
• Abbreviations
• Euphemisms
40. T H E O F F I C E O F N A T I O N A L
S T A T I S T I C S
Statistician: Each Geographical Statistical Output (GSO)
depicts an enumeration district.
Manager: Do you mean ‘each map’?
Statistician: No. We cannot call it a map because each GSO
also contains a table.
Manager: OK. It's a map with a table.
Source: plainlanguage.gov, Keep it Jargon-free, by Nick Wright
41. “I soon realized solving
Bosnia would be easier.”
-- George Robertson, English Defence Minister, on his
attempt to cut out abbreviations and acronyms at the
Ministry of Defence
Source: plainlanguage.gov, Keep it Jargon-free, by Nick Wright
42. E U P H E M I S M S A N D J A R G O N
Jargon Plain
Reduction in force Layoffs
Economic downturn Recession
Friendly fire Shot our own troops
Involuntary undomiciled Homeless
Riverine avifauna River birds
Sources: plainlanguage.gov, Keep it Jargon-free and
Avoid legal, foreign, and technical jargon
43. G O O G L E S E A R C H E S P E R
M O N T H
40,000
“Low fares”
Source: Gerry McGovern, Choosing the Right Classification Words, October 2008
25
million
“Cheap flights”
44. T O N E
• Active voice
• Avoid passive verbs (it was done by…)
• Take responsibility
• Invite the reader to take action
• Personal address
• Talk to a person, not an abstract group
• The reader IS the audience
• Be relevant
Source: plainlanguage.gov, Pronouns Can Establish a Personal Tone
45. A C T I V E V O I C E
Before:
The Texas Forest Service was established by the legislature.
After:
The legislature established the Texas Forest Service.
46. P E R S O N A L A D D R E S S
Before:
This article will help students improve their study habits.
After:
Learn to study more effectively.
47. L I N K S
• Descriptive
• What will the reader find when she gets there?
• Unique
• Starts with a keyword
• File type and size warnings (PDF, 200MB)
Source: Nielsen Norman Group, Writing Links, March 2014.
48. N E V E R W R I T E “ C L I C K H E R E ”
• What is the destination?
• The method doesn’t matter
• And it might not be “clicking” anyway
• Tapping mobile screens
• Keyboard navigation
• Puff sticks and joysticks
• Voice recognition
49. W H A T S C R E E N R E A D E R U S E R S
H E A R
•Click here
•Click here
•Click here
•Click here
•Click here
•Click here
•Click here
52. D O N ’ T L I N K T O N O N E X I S T E N T
P A G E S
53. N E V E R U N D E R L I N E N O N - L I N K E D
T E X T
54. 3 W A Y S T O I N S E R T L I N K S I N
W O R D
1. Control-K
2. Insert -> Hyperlink
3. Select phrase, right click, “hyperlink”
55. K E Y W O R D S
• How would people search for this page?
• “how do I…?” is common
• Jargon AND vernacular
• “low fares” and “cheap flights”
• Two- to four-word phrases are best
56. U R L S
http://tfs.tamu.edu/main/article.aspx?id=13944
http://tfs.tamu.edu/request-assistance-with-forest-recovery-
after-wildfire
/foresthealth/
/foresthealth/insects/
58. W R I T I N G A G O O D W E B P A G E
• Identify and address the audience
• Chunk the text by topic or task
• Cut half the words
• Eliminate jargon
• Write task-based headings and descriptive links
• Add alt text and captions to images
• Summarize tables and charts
• Include keywords in the URL
59. T O O L S
• Style Guide and Page Template
• PlainLanguage.gov Quick Tips
• Plain language checklists
• Center for Plain Language checklist
• PlainLanguage.gov checklist
• Accessibility checklist
Editor's Notes
First, we need to talk about how people read online. It’s pretty different from the way we read printed documents. Then we’ll talk about how to write effectively for this medium.
“Satisficing” is web industry jargon for the way people choose which links to click as they search for something on the web. It’s a compromise between “satisfying” and “suffice.” The thing they want might be at the bottom of the page, but if they see something earlier that’s good enough, they’ll click it.
Eye-tracking software produces these visualizations of the way people’s gazes linger in certain areas as they read. On a printed, page, this would be more like a Z as the person read carefully from left to right. Here, when they don’t find what they want at the top left, they start skimming down the page for subheadings and links that might take them to the information they want.
This image was tweeted a few days ago by Lara Hogan of etsy.com. It’s a representation, by the intensity of the color, of how many people visited Etsy from these different screen sizes. Several people from other large sites like Best Buy followed suit, and they were all pretty similar. Source: http://twitter.com/lara_hogan/status/516660720378052608/photo/1
On mobile, subheadings become even more important. Once people start flicking down the screen, the text is moving too fast for them to read the paragraphs.
This number goes way, WAY up when you’re looking at poor populations for whom cell phones are affordable but home computers and cable internet are not. These folks do everything from their phones or from the computers at libraries.
Think about your audience. Are you speaking to a group of fellow professionals, or the general public? And think about the likely demographics of “the general public” in your context. University financial aid offices have had to make their entire application processes mobile-friendly.
If you have anything that is aimed at disadvantaged teenagers, it had better look good on a phone.
This number goes way, WAY up when you’re looking at poor populations for whom cell phones are affordable but home computers and cable internet are not. These folks do everything from their phones or from libraries.
Some things to note: the software told Colleen how many headings were on the page, and how many links there were. This is her cue to press a button if she wants to stop there and hear only the headings, or only the links.
PDFs can’t be resized to flow better on mobile devices, so you should avoid using them as much as possible. If you have a PDF in which the text can’t be selected, it’s an image that was scanned in, and it’s inaccessible to both screen readers and search engines.
The document properties are usually generated for you from Word or Excel – the original program used to create the file – and they’re seldom what you would want appearing in search engine results.
When we make a site work well for people, including people with disabilities, we make it work better for search engines as well.
Break up long passages with subheadings. Prioritize: make sure the most important part of each section is in the first paragraph, and the most important part of the paragraph is in the first sentence.
Use bullet lists instead of long lists within a paragraph.
The History of the Forest Service page is an excerpt from someone’s dissertation. It’s a perfect example of how not to write for the web. It has its own bibliography. It’s a wall of text with no subheadings, no bullets, no images – nothing to break it up. It’s visually intimidating.
This is one sentence from the history of the Forest Service page.
Steve Krug argues that web pages are more like billboards than books. It’s rare that people settle in to read long passages. They’re looking for something. Their eyes are travelling across the page at 65 miles an hour.
He admits that cutting 75% of a page’s content is often unrealistic, but it’s still a good goal.
This is probably the biggest departure from the way you write other professional materials. You have to balance the need for plain language with the need to maintain credibility with your peers. Knowing the audience for each page is essential. Is it for the general public, or for your fellow professionals? If it’s both, try leaning more toward plain language than jargon.
There is a federal law requiring plain language in federal agency documents. There is a whole government website devoted to plain language. There’s another one devoted to web usability, and it has a section on plain language. There’s an outside watchdog group devoted to calling out agencies that use too much jargon and awarding those that use plain language.
Pretending that our readers won’t realize that we’re talking about unpleasant things doesn’t help. It just makes us sound patronizing, and now the reader feels that we’ve insulted her intelligence on top of the fact that we’re laying off twenty people.
Every airline in the world advertised “low fares” until Google made it clear that in the real world, virtually no one uses that phrase
Write as though you are addressing an individual rather than an abstract group. Make your topic relevant to the reader.
Describe what the reader will find at the link’s destination. You don’t need to tell her how to get there. The web has been part of our professional lives for twenty years; everyone knows what to do with a link.
This is Twitter’s FAQ. Some of the links are very descriptive: protect your Tweets; how to post a Tweet; Twitter widget; direct messages.
But there are three “read more here” links. These need to be rephrased: Read more about follow limits; read more about @replies; read more about direct messages.
If there are no publications, why is there a page for it? Just remove the links altogether.
For twenty years, we’ve been trained that links are underlined. If you’ve underlined something that is not a link, someone out there is picking up her mouse to see if it’s broken.
If the page describes a task, finish the phrase “How do I…?” (e.g. get rid of oak wilt)
Using both the industry jargon (low fares) and the vernacular (cheap flights) will net you both the 40,000 searches and the 25 million.
The first URL has no keywords to indicate what the article is about. Google will rank the first URL lower than the second. A human looking at this URL in a printed page or Tweet will be less likely to follow up on it.
As you edit your pages, you’ll be able to choose aliases for those ugly URLs. Write them with your search keywords in mind.
You can include slashes to indicate a hierarchy – e.g. /foresthealth/insects
The complete rules for writing aliases are in the style guide.