Writing Well for the Web
-
Upload
kathy-ohlhaber -
Category
Documents
-
view
213 -
download
0
description
Transcript of Writing Well for the Web
![Page 1: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/1.jpg)
Writing well for the web
Share IT 24th March 2007
![Page 2: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/2.jpg)
Structure
Style
What are we covering today?
2
![Page 3: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/3.jpg)
“That’s a really good site”
![Page 4: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/4.jpg)
Content is What Visitors Care About
! Usability studies show that “users comment
on the content first; if the content isn’t
relevant, they don’t care about any other
aspect of the design”.
![Page 5: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/5.jpg)
Does anyone care about this content?
Why are you creating this content?
![Page 6: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/6.jpg)
An organisation that had a 4,000
page website audited their
content.
They got rid of 1,000 pages….
Quick case study…
![Page 7: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/7.jpg)
Creating Content: 5 Golden Rules
1. Wait to write
2. Know your readers
3. Make all your readers’ lives easy
4. Write to be found
5. Drive your readers to action5
![Page 8: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/8.jpg)
How do we read on the web?
![Page 9: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/9.jpg)
How we read online
![Page 10: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/10.jpg)
Reading on the Web
1. Reading from computer screens is 25%
slower than from paper
2. People almost always scan your pages
3. Users won't read your text
thoroughly in a word-by-word manner
![Page 11: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/11.jpg)
2 key questions
Am I on the right page?
Where do I go next??
![Page 12: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/12.jpg)
Page structure
![Page 13: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/13.jpg)
Most important
Less important
Background
Page structure
Most important
material first (start
with conclusion)
![Page 14: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/14.jpg)
Use headings and subheads
! Make it easy to answer question 1
! “Am I on the right page?”• These are what determine if people read on.
• Visually break up the text - for scanning
• Help to ensure your content is sufficiently focused
• Are important b/c you don’t know where people
arrived from
![Page 15: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/15.jpg)
! Short – max 8 words
! Should be meaningful on its
own
• Remember that titles/headings are
displayed out of context – search
results and bookmarks
! Use keywords of your users• Headings are important for search
engine rankings
Word for word –the title is the
most importanttext on the page!
Take time to getit right.
Headings/Titles – basic tips
![Page 16: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/16.jpg)
Subheadings
! Don't need to be standalone
! Do need to be informative
! Should anticipate the
reader's questions
! Are one of the most
frequently missing pieces
from web content
![Page 17: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/17.jpg)
Compare long articles:
! Boxes and Arrows
! A List Apart
![Page 18: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/18.jpg)
Page structure
is more important than
page length
![Page 19: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/19.jpg)
Making text stand out
from the crowd
![Page 20: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/20.jpg)
Lists
! Use them!
! Bulleted lists or numbered lists make
a big difference – much easier to
scan
! Put as much info in the stem as
possible
! Avoid lengthy bullet items
![Page 21: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/21.jpg)
! Are these lists
easy to scan?
![Page 22: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/22.jpg)
Emphasis
! Use bold to emphasise key phrases.
• This is an underutilised tactic
• Don't bold single words
! Avoid italics (too hard to read)
! Never use underline for emphasis
![Page 23: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/23.jpg)
! What do youthink of thisbolding?
! Notice theheading
! Comparescannabilityto Familyactivity ideassection
![Page 24: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/24.jpg)
![Page 25: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/25.jpg)
Style: the actual writing
![Page 26: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/26.jpg)
Writing guidelines
! Predate the web
! More important now, for impatient web readers
![Page 27: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/27.jpg)
Four simple rules to write by…
41. Shorter
2. Simpler
3. Active voice
4. Casual tone
![Page 28: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/28.jpg)
! Fewer words frees up space, and are
clearer and quicker to read
“If it is possible to cut a word out,
always cut it out.”
George Orwell
Shorter is better
![Page 29: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/29.jpg)
General rule: at least 50% less text than offlineequivalent
Cut your offline text in half, then try tocut in half again.
Steve Krug
How much shorter?
! Short headings: 4 – 8 words
! Short summaries: 30 – 50 words
! Short sentences: 15 – 20 words
! Short paragraphs: 40 – 70 words
![Page 30: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/30.jpg)
Simpler is better
! Commence
! Discontinue
! Execute
! Implement
! Notify
! Obtain
! Utilize
! Dwelling
“Never use a long word where a shortone will do.”
George, again
! Start
! Stop
! Do (or Kill!)
! Do, Make
! Tell
! Get
! Use
! House
![Page 31: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/31.jpg)
“Our Internet support infrastructureautomatically collects informationfrom the user’s system, facilitateseffective communication betweensupport personnel and users, andenables self-healing and automatedproblem resolution.”
- CRM vendor
![Page 32: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/32.jpg)
More…
“Our goals are to increase coordination and toachieve strength, mutuality, and direction withinthe marine scientific community…
…We will achieve them by facilitating theestablishment of coordination mechanisms withour stakeholders and partner agencies.”
![Page 33: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/33.jpg)
More…
![Page 34: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/34.jpg)
More Casual Tone
! Be informal (or less formal)
! Try to make it personal where possible,use “you” and “we”.
! Aim for more conversational style
! Not as easy to do for all organisations,but the more formal, the less inviting.
! Don’t sound like a governmentdepartment or company, sound like aperson.
![Page 35: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/35.jpg)
How would describe the tone of this?
![Page 36: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/36.jpg)
What’s the point of this?
![Page 37: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/37.jpg)
![Page 38: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/38.jpg)
Use the Active voice
! Subtle, but important, difference.
! Passive is impersonal, and slows thepace.
! Active makes your writing more lively,less boring to read.
The issue will be consideredby the committee whenappropriate.
The committee will considerthe issue when appropriate.
After being filled in, the formshould be signed.
Fill in the form and sign it.
passive active
![Page 39: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/39.jpg)
![Page 40: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/40.jpg)
Your turn: rewrite this text….
Under what circumstances will you charge me VAT?
Generally, such taxes must be levied with respect to the ship-toaddress, rather than the bill-to address, on the assumption thatthe ship-to address is receiving the substantial benefit of thepurchase. The tax is triggered if we have a physical store in theship-to country. Currently, those countries for which we mustcharge VAT (when we ship to addresses in these countries) arethe UK, Ireland, Belgium, France, and Spain. We regret anyinconvenience.
![Page 41: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/41.jpg)
Shorter and Simpler
Do I need to pay VAT?
We have to charge VAT on any orders we ship to UK, Ireland,Belgium, France, and Spain. Sorry about that.
(20 words compared to 83 words)
![Page 42: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/42.jpg)
1. Never use a metaphor, simile, or other figure ofspeech which you are used to seeing in print.
2. Never us a long word where a short one will do.
3. If it is possible to cut a word out, always cut it out.
4. Never use the passive where you can use theactive.
5. Never use a foreign phrase, a scientific word, or ajargon word if you can think of an everyday Englishequivalent.
6. Break any of these rules sooner than say anythingoutright barbarous.
From “Politics and the English Language”, 1946.
George Orwell’s Rules for Effective Writing
![Page 43: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/43.jpg)
Critical web writing skill:
Links
![Page 44: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/44.jpg)
! Generally for 2 reasons:
• To find useful information
• To do something useful
! Links help them find it
! Links help them do it
! Links are your call to action
Why do people go online?
![Page 45: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/45.jpg)
Links should be easy, right?
![Page 46: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/46.jpg)
![Page 47: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/47.jpg)
![Page 48: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/48.jpg)
Links - key considerations
! Good links help users scan
! Use meaningful words and phrases (NOT “click
here for info on…”)
! Don’t construct the sentence around the link
phrase – write the sentence normally.
! Try to use verbs as the focus of the link
! Should be able to understand the link without
reading any other text (scannable)
![Page 49: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/49.jpg)
Writing links
! Shorter isn’t necessarily better.
! Most successful links tend to be 7-12 words
• Because they’re more likely to contain the trigger words
• But short enough so you can find trigger word easily
! Well written links help your SEO!
![Page 50: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/50.jpg)
What do you think of these?
![Page 51: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/51.jpg)
Quick recap on everything…
![Page 52: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/52.jpg)
! Don't jump into writing
! Take time to think through what you're doing
! Write an outline
! Even 5 minutes can make a difference!
1: Wait to write
![Page 53: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/53.jpg)
! Do your readers care about this content?
! Is your text anticipating and answering the right
questions?
! Is it written at a level appropriate for the audience?
! Is it written using words they care about, not the
organisation’s internal lingo?
2: Know your readers
![Page 54: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/54.jpg)
! Make the text scannable
! Use simple, clear language
! Use an informal, inviting tone
! Include well written links• Set clear expectation, then meet it
3: Make all your readers' lives easy
![Page 55: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/55.jpg)
! Use the keywords and phrases your visitorsuse throughout the page
! Keep each page clearly focused on one topic
! Use descriptive text links
! Use headings and subheads, with keywords
! Bold words in your text for emphasis
! Keep your content fresh
4: Write to be found
![Page 56: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/56.jpg)
! Aim to give every page a call to action
! Think creatively about what you want your reader
to do with the information you've provided
! Well-written links are the main action!
5: Drive your reader to action
![Page 57: Writing Well for the Web](https://reader033.fdocuments.us/reader033/viewer/2022042901/568c34721a28ab0235907c0f/html5/thumbnails/57.jpg)