También disponible en Español

Inf@Vis!

The digital magazine of InfoVis.net

Informing Visually
by Juan C. Dürsteler [message nº 45]

Visualising information doesn't necessarily mean putting graphics along with the contents. Especially for the web, some basic techniques help you to explain yourself

During the last month of May the STC (Society for Technical Communication) annual conference took place in Chicago. In it Janice (Ginny) Redish presented a talk entitled "Making Information Visual: Creating effective web pages". The talk set out a series of basic principles about how to make the information presented in a web more visual, more adapted to the medium and, hence, easier to assimilate.

Ginny Redish holds a PhD in linguistics, leads the consulting firm Redish & Associates and has been working on usability since 1985, the year in which she constituted one of the first independent laboratories on usability.

Although the handouts of the talk are available, I think it's worth summarising here the fundamental points of it, that are nowadays part of quite an accepted consensus about what to do in order to visualise information for the web.

Some facts
  • Time is a scarce resource.

  •  Professionals are too busy to read much, they look for quick answers for their questions. 

  • Users of the web basically scan the information. 

  • Even paper documents are read cover to cover by just 15% of the readers, 81% of them "skim" the information in one way or another. 

  • In many cases people "read to do" instead of "reading to learn" (See the attached picture.

     
  • The contents of many web sites do not match what the users are looking for.

In order to adapt the creation and presentation of contents to the web, Ginny Redish proposes the following techniques:

According to Sticht, 1985 and  Redish, 1988, 1993, adapted from the slides mentioned in the text

  1. Give the user only what they need with the least possible words. In order to do this , select the essence of the message without losing the meaning. Remember that Morkes and Nielsen were able to reduce the text in a web by 54% and the users found it more complete than before .

  2. Escape from what Ginny calls "prose mode". You aren't writing a book. Instead, use "Visual writing", that includes the use of 
    • hyperlinks, 
    • fragments, 
    • pictures, 
    • lists 
    • tables.
  3. For example, compare these two possibilities, adapted also from the slides

SZWXY S.L. in a permanet search of profitability had revenues of 3,27 Million Euro during fiscal year 2000. This has allowed us to reach a profitability of nearly 7% due to the profit soaring to 230,000 Euro. The company has 420 employees, highly motivated toward the achievement of the objectives of the company centred in the design of visualisation systems for industrial corporations with large databases, financial entities and B2B portals.  

SZWXY S.L. produces visualisation systems for:

  • industrial corporations with large databases, 
  • financial entities and 
  • B2B portals.  

Year 2000

Revenues:         3.270.000 €
Profits: 230.000 €
Profitability: 7%
Num. employees:    420
  • Even if you have to write prose, use short sentences and paragraphs. One sentence per paragraph better than two.

  • Layer the information. As Rudick and O'Flahavan comment in their article some users only need a bite, others a snack while others want a complete meal. Use links to separate layers providing each user with the "food" they need.

  • Use lists
    • Bulleted lists for individual items or choices. 
    • Numbered lists for instructions or procedures
  1. Use tables 
    • when comparing numbers
    • when using condicional sentences like "if A then B" 
    • to relate results with operations, e.g. "to get A do B"

  2. Think visually. 
    • Consider paragraphs as if they were pictures. 
    • Combine white space with text and pictures in order to clarify the meaning of the message you want the user to get in the most simple form.
  3. Use pictures to save space if that way you make information easier and quicker to access and understand.

  4. Use pictures as examples in informational and e-commerce sites

    As Ginny Redish concludes, the message is "less is more", find the essence and reflect it, escape from prose by thinking visually "with words as well as pictures".

    If you have found the summary interesting, take a look at Ginny's handouts. It's worth doing it


See also two related articles: num 13 Website design: is there anybody out there? and num 14 Website design: who cares?

Links of this issue:

http://www.stc.org  
http://www.redish.net  
http://www.redish.net/handouts.htm  
http://www.useit.com/papers/webwriting/rewriting.html  
http://www.ewriteonline.com/newsletter/issue8R.html  
http://www.infovis.net/printMag.php?num=13&lang=2  
http://www.infovis.net/printMag.php?num=14&lang=2  
© Copyright InfoVis.net 2000-2014