May 2007 May 2007 Search Engines Challenges & Trends David Rashty [email protected].
Writing for the Web A short tutorial David Rashty, Isaac Waisberg.
-
Upload
francis-blair -
Category
Documents
-
view
217 -
download
0
Transcript of Writing for the Web A short tutorial David Rashty, Isaac Waisberg.
![Page 1: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/1.jpg)
Writing for the Web
A short tutorial
David Rashty, Isaac Waisberg
![Page 2: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/2.jpg)
Introduction
• Reading from computer screens is about 25% slower than reading from paper. As a result users feel unpleasant when reading online text.
• You should write 30% less text since it's not only a matter of reading speed but also a matter of browsing and scrolling habits.
• Users don't like to scroll: one more reason to keep pages short.
![Page 3: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/3.jpg)
General guidelines
Three main guidelines
![Page 4: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/4.jpg)
1- Be succinct
• When giving overview information, be concise.
• Save the details for those that want them or have the time, but don't slow down the skimmer.
• This doesn't mean skip the details, just keep them from people who don't need them.
![Page 5: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/5.jpg)
2- Scannability
• Because the online experience seems to foster some amount of impatience, users tend not to read streams of text fully.
• Users scan text and pick out keywords, sentences, and paragraphs of interest while skipping over those parts of the text they care less about.
![Page 6: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/6.jpg)
2.1- Writing for scannability
• Structure articles with two or even three levels of headlines.
• Use meaningful headings (i.e., reading a heading should tell the user what the page or section is about)
• Use highlighting and emphasis to make important words catch the user's eye.
![Page 7: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/7.jpg)
3- Hypertext structure
• Make text short without sacrificing depth of content by splitting the information up into multiple nodes connected by hypertext links.
• Each page can be brief and yet the full hyperspace can contain much more information than would be feasible in a printed article.
• Information of interest to a minority of readers can be made available through a link without penalizing those readers who don't want it.
![Page 8: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/8.jpg)
3.1- Hypertext structure
• Hypertext should not be used to segment a long linear story into multiple pages: having to download several segments slows down reading and makes printing more difficult.
• Proper hypertext structure is not a single flow "continued on page 2"; instead split the information into coherent chunks that each focus on a certain topic.
• The guiding principle should be to allow readers to select those topics they care about and only download those pages.
![Page 9: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/9.jpg)
Content and style
Summary of findings
![Page 10: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/10.jpg)
Provide useful information
• Most people use the web to find information that they can actually use.
• Unless your site is for entertainment purposes, make sure that your readers will find your information useful.
• This means useful for them instead of just useful for you.
![Page 11: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/11.jpg)
The more specific, the more useful
• General overview information is fine, and can be extremely helpful.
• But when people want to act on the information you provide give them all the information they require in order to act.
![Page 12: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/12.jpg)
Make sure people know what each page will do for them
• If someone can't figure it out immediately, chances are they'll go someplace else.
• It's best to do this at the top of the page, so people can see what they'll get from you without scrolling.
• People will scroll, but only if they think there's something of interest to them on your page.
![Page 13: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/13.jpg)
Formatting
Summary of findings
![Page 14: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/14.jpg)
Always start with the headline
• Everyone reads them.
• Condense your most important point down to a one- or two-line headline.
• See Nielsen’s Alertbox on Microcontent for more information at: www.useit.com/alertbox/980906.html
![Page 15: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/15.jpg)
Use plenty of subheads
• People skim headings looking for specific topics — so use subheads liberally.
• If you started by creating an outline, your outline headings will automatically become subheads.
![Page 16: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/16.jpg)
Give 'em the gist of it
• Distill longer documents down to their most important facts by creating an "executive summary."
• A summary at the start of each article containing links to the main subheads in an article allow people to see the article at a glance and easily jump to any important point.
![Page 17: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/17.jpg)
Bold text stands out
• It's best to use it sparingly, such as for lead-in headings at the start of a paragraph.
• Bold words scattered inside the text can be confusing.
![Page 18: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/18.jpg)
Examples
Putting things together
![Page 19: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/19.jpg)
![Page 20: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/20.jpg)
![Page 21: Writing for the Web A short tutorial David Rashty, Isaac Waisberg.](https://reader036.fdocuments.net/reader036/viewer/2022062423/56649ea15503460f94ba4cd9/html5/thumbnails/21.jpg)