Scanability: Difference between revisions

From LitWiki
m (added link)
 
(33 intermediate revisions by 3 users not shown)
Line 1: Line 1:
[[Web_Based_Digital_Media_for_College_Writing_Students|Home Page]]
Having a good layout and [[Design|design]] when writing online is as important as the writing. Scanability is one of the key tools to online layout. Readers will often look quickly over a page to decide if what they are looking for will be found. Headlines, subheads, and links are all ways to achieve a more scannable page. Making small changes like variation in font size, and color or adding an image/graphic can also help content be more scannable.
== Headlines / Subheads ==
== Headlines / Subheads ==
[[File:Scannability.jpg|400px|thumb|right|This image shows how breaking up large amounts to text using headlines, subheads, and even a graphic can make writing more scannable.<ref>Butler </ref>]]


When writing online it is a good idea to present the most important information first. When reading an outline vs a full text article; the [http://www.netidnow.com/how-to-guides/how-to-design-your-own-website.html readability] is far better in an outline. The outline is easy to read and conveys all of the information the full text does just in a bulleted way. Readers can easily locate what they are looking for in an outline and when they find it, they can go to the full text for the details. Links are like the full text. Practice writing in headlines and subheads to make finding information easy, and link to other good sources to give what has been written more detail.  
"Students often judge sites on how they look. But they usually prefer sites that look clean and simple rather than flashy and busy." <ref> Nielsen </ref> When writing an online it is a good idea to present the most important information first. When reading an outline vs. a full text article, the readability is better in an outline. The outline is easy to read and conveys all of the information the full text does except in a bulleted form. Readers can easily locate what they are looking for in an outline and when they find it, they can go to the full text for the details. Practice writing in headlines and subheads to make finding information easy, and link to other good sources to give what has been written more detail. [[Photos|Graphics]] can also be used for headlines if there is applicable text in the graphic.


[http://www.scribd.com/doc/64429015/Writing-for-Digital-Media#page=45 Headlines]and Subheads are a great way to  
Headlines <ref>Carroll,34 </ref> and subheads are a great way to:
#Break up text  
#Break up text  
#*Reading a long paragraph will likely be off putting to an online reader, visually breaking up text using headlines and even subheads then the reader is more likely to actually read the information.
#*Reading a long paragraph will likely be off putting to an online reader. When visually breaking up text using headlines and even subheads, the reader is more likely to read the information.
#Draw attention
#Draw attention
#*Headlines can be presented in a different font, size or even color than the rest of the text and can early catch the attention of the reader.
#*Headlines can be presented in different fonts, sizes, or colors to catch the attention of the reader.
#Summarize
#Summarize
#*Often the information that is presented can be summarized in a few words, this is helpful so the reader can find exactly what they are looking for.
#*Often, the information presented can be summarized in a few words; this is helpful so the reader can find exactly what they are looking for.


== Links ==
== Links ==


Adding links to online writing makes the work non-linear. If the writing is more like an outline than adding links can add more details without adding visual weight to what has been said. Links should not interrupt the text; they should go with the flow of the writing and unlike headlines should not break up what is being said.
Adding links to online writing makes the work non-linear. If the writing is more like an outline than adding links can add more details without adding visual weight to what has been said."Students were frustrated by sites that provided shallow information. College students demand more evidence than teenagers do." <ref> Nielsen </ref> Links should not interrupt the text; they should go with the flow of the writing and unlike headlines should not break up what is being said. The links used on a page should only create [[Relevance and Support|relevant support]] not extra reading for the user to navigate through.


When [http://www.scribd.com/doc/64429015/Writing-for-Digital-Media#page=47 Linking]
When Linking <ref> Carroll,47 </ref>
#Do not link the words ''click here''
#Do not link the words ''click here''
#*Doing this is redundant, if adding a link the words that are connected to the link.
#*Doing this is redundant, if adding a link the words that are connected to the link.
Line 23: Line 28:
#*Each site may have a different way to format a link, make sure and know how to make links correctly for each site used.
#*Each site may have a different way to format a link, make sure and know how to make links correctly for each site used.


Keep all links up to date and working all the time. Broken links make sites non-crediable and add unnecessary weight to the text. All links should have a purpose, and the site linked to should also follow the other rules of good online writing.
Keep all links up to date and working all the time. Broken links make sites non-crediable and add unnecessary weight to the text. All links should have a purpose, and the site linked to should also follow the other rules of good online writing. [[Usability|Navigating]] to a new page should not distract the reader  from what has all ready been written or cause confusion.
 
== Fonts and Graphics ==
[[File:Images-2.jpg|350px|thumb|right|This image shows how to use images to break up your text. <ref>Butler </ref>]]
 
Variations in font, size, and color can break up text just as much as headlines and subheads. "Besides, elegant fonts can help to convey the message in a more convenient way."<ref>Friedman</ref>
 
*Fonts and colors should blend well together and should be consistent through out the writing.
*Do not use to many colors and make sure the colors you choose go with the theme of the writing.
 
:"There’s a distinction between typefaces that are expressive and stylish versus those that are useful and appropriate to many situations, and our job is to try to find the right balance for the occasion" <ref>Mayer </ref>
 
The same applies with [[Photos|images]], make sure the images are of a similar quality and size. Make sure all of them are applicable to the writing and only add visual interest, not distract from the writing.
 
:"Notice the ways that the selection and placement of text and images, the typography and text size, the use of color, and other design elements help to set a mood and establish a rhythm for the magazine that affects how you react to and move through the content." <ref> Carroll, 62 </ref>
 
== Notes ==
<references />
 
== Also See ==
 
*[http://mca.maconstate.edu/ The Department of Media, Culture, and the Arts]
 
*[http://www.maconstate.edu/ Macon State College]


== Reference ==
== Reference ==
#Carroll, Brian. (2010). ''"[http://www.scribd.com/doc/64429015/Writing-for-Digital-Media Writing for Digital Media]"''. New York: Routledge. Retrieved 2 Nov. 2012.
 
#Butler, Christopher. "[http://www.newfangled.com/formatting_your_blog_posts Formatting Your Blog Posts]". (2010).  Retrieved 26 Nov. 2012
#Carroll, Brian. ''[http://www.scribd.com/doc/64429015/Writing-for-Digital-Media Writing for Digital Media]''. Routledge; New York, 2010. Retrieved 2 Nov. 2012.
#Friedman, Vitaly . "[http://www.smashingmagazine.com/2007/11/08/40-excellent-freefonts-for-professional-design/ 40+ Excellent Freefonts For Professional Design]". (2007). Retrieved 26 Nov 2012.
#Mayer, Dan. "[http://www.smashingmagazine.com/2010/12/14/what-font-should-i-use-five-principles-for-choosing-and-using-typefaces/ What Font Should I Use?: Five Principles for Choosing and Using Typefaces]". (2010). Retrieved 3 Dec. 2012.
#Neilsen, Jakob. "[http://www.nngroup.com/articles/college-students-on-the-web College Students on the Web]". Retrieved 3 Dec. 2012.

Latest revision as of 10:43, 3 December 2012

Home Page

Having a good layout and design when writing online is as important as the writing. Scanability is one of the key tools to online layout. Readers will often look quickly over a page to decide if what they are looking for will be found. Headlines, subheads, and links are all ways to achieve a more scannable page. Making small changes like variation in font size, and color or adding an image/graphic can also help content be more scannable.

Headlines / Subheads

Error creating thumbnail: File missing
This image shows how breaking up large amounts to text using headlines, subheads, and even a graphic can make writing more scannable.[1]

"Students often judge sites on how they look. But they usually prefer sites that look clean and simple rather than flashy and busy." [2] When writing an online it is a good idea to present the most important information first. When reading an outline vs. a full text article, the readability is better in an outline. The outline is easy to read and conveys all of the information the full text does except in a bulleted form. Readers can easily locate what they are looking for in an outline and when they find it, they can go to the full text for the details. Practice writing in headlines and subheads to make finding information easy, and link to other good sources to give what has been written more detail. Graphics can also be used for headlines if there is applicable text in the graphic.

Headlines [3] and subheads are a great way to:

  1. Break up text
    • Reading a long paragraph will likely be off putting to an online reader. When visually breaking up text using headlines and even subheads, the reader is more likely to read the information.
  2. Draw attention
    • Headlines can be presented in different fonts, sizes, or colors to catch the attention of the reader.
  3. Summarize
    • Often, the information presented can be summarized in a few words; this is helpful so the reader can find exactly what they are looking for.

Links

Adding links to online writing makes the work non-linear. If the writing is more like an outline than adding links can add more details without adding visual weight to what has been said."Students were frustrated by sites that provided shallow information. College students demand more evidence than teenagers do." [4] Links should not interrupt the text; they should go with the flow of the writing and unlike headlines should not break up what is being said. The links used on a page should only create relevant support not extra reading for the user to navigate through.

When Linking [5]

  1. Do not link the words click here
    • Doing this is redundant, if adding a link the words that are connected to the link.
  2. Do no use the entire URL
    • URLs can be very lengthy and confusing, this adds unnecessary weight to text and can confuse the reader
  3. Know the sites linking policy
    • Each site may have a different way to format a link, make sure and know how to make links correctly for each site used.

Keep all links up to date and working all the time. Broken links make sites non-crediable and add unnecessary weight to the text. All links should have a purpose, and the site linked to should also follow the other rules of good online writing. Navigating to a new page should not distract the reader from what has all ready been written or cause confusion.

Fonts and Graphics

Error creating thumbnail: File missing
This image shows how to use images to break up your text. [6]

Variations in font, size, and color can break up text just as much as headlines and subheads. "Besides, elegant fonts can help to convey the message in a more convenient way."[7]

  • Fonts and colors should blend well together and should be consistent through out the writing.
  • Do not use to many colors and make sure the colors you choose go with the theme of the writing.
"There’s a distinction between typefaces that are expressive and stylish versus those that are useful and appropriate to many situations, and our job is to try to find the right balance for the occasion" [8]

The same applies with images, make sure the images are of a similar quality and size. Make sure all of them are applicable to the writing and only add visual interest, not distract from the writing.

"Notice the ways that the selection and placement of text and images, the typography and text size, the use of color, and other design elements help to set a mood and establish a rhythm for the magazine that affects how you react to and move through the content." [9]

Notes

  1. Butler
  2. Nielsen
  3. Carroll,34
  4. Nielsen
  5. Carroll,47
  6. Butler
  7. Friedman
  8. Mayer
  9. Carroll, 62

Also See

Reference

  1. Butler, Christopher. "Formatting Your Blog Posts". (2010). Retrieved 26 Nov. 2012
  2. Carroll, Brian. Writing for Digital Media. Routledge; New York, 2010. Retrieved 2 Nov. 2012.
  3. Friedman, Vitaly . "40+ Excellent Freefonts For Professional Design". (2007). Retrieved 26 Nov 2012.
  4. Mayer, Dan. "What Font Should I Use?: Five Principles for Choosing and Using Typefaces". (2010). Retrieved 3 Dec. 2012.
  5. Neilsen, Jakob. "College Students on the Web". Retrieved 3 Dec. 2012.