Design: Difference between revisions

From LitWiki
(Added links to other students' pages.)
m (Added references.)
Line 5: Line 5:
==Consistency==
==Consistency==


*The repetition of elements gives a site a consistent identity (Carroll).
*The repetition of elements gives a site a consistent identity<ref name= "Carroll">Carroll, Brian. (2010). ''[http://www.scribd.com/doc/64429015/Writing-for-Digital-Media Writing for Digital Media]''. New York: Routledge.</ref>.
**Colors.
**Colors.
**[http://litmuse.maconstate.edu/litwiki/index.php/Graphics Graphics].
**[http://litmuse.maconstate.edu/litwiki/index.php/Graphics Graphics].
Line 13: Line 13:
**Text placement.
**Text placement.


*Full [http://litmuse.maconstate.edu/litwiki/index.php/Contact contact information] on every page (Carroll, 62).
*Full [http://litmuse.maconstate.edu/litwiki/index.php/Contact contact information] on every page<ref name= "Carroll"></ref>.


*Provide [http://litmuse.maconstate.edu/litwiki/index.php/Relevance_and_Support logical links] that pertain to the text (Carrol, 79).  
*Provide [http://litmuse.maconstate.edu/litwiki/index.php/Relevance_and_Support logical links] that pertain to the text<ref name= "Carroll"></ref>.


*Adhere to an audience-specific style guide (HTML codes used and the grammatical format of text) throughout the site (Carrol, 97, 111).
*Adhere to an audience-specific style guide (HTML codes used and the grammatical format of text) throughout the site<ref name= "Carroll"></ref>.


==Usability==
==Usability==


*Keep text scan-able (Carrol, 32).
*Keep text scan-able<ref name= "Carroll"></ref>.
**Highlight key words.
**Highlight key words.
**Use links.
**Use links.
Line 31: Line 31:
**Practice brevity.
**Practice brevity.


*Keep it simple and [http://litmuse.maconstate.edu/litwiki/index.php?title=Navigation_and_Usability user-friendly]. Break pages into clearly defined areas and minimize distractions (Carrol, 28, 69).  
*Keep it simple and [http://litmuse.maconstate.edu/litwiki/index.php?title=Navigation_and_Usability user-friendly]. Break pages into clearly defined areas and minimize distractions<ref name= "Carroll"></ref>.  


*Include a visual hierarchy for information and navigation on each page (Carrol, 123).
*Include a visual hierarchy for information and navigation on each page<ref name= "Carroll"></ref>.


*Fifty to eighty percent of the page should be reserved for content (Carrol, 67).
*Fifty to eighty percent of the page should be reserved for content<ref name= "Carroll"></ref>.


==Navigability==
==Navigability==


*Easy-to-use navigation tools. A navigation bar is best utilized on the top of the website (Carrol, 35).
*Easy-to-use navigation tools. A navigation bar is best utilized on the top of the website<ref name= "Horton">Horton, Sarah. (2006). [http://universalusability.com/access_by_design/page_layout/consistent.html Page Layout: Apply a consistent design]. Universal Usability.</ref>.


*Each web page must be able to stand alone. Make sure that users know where they are in the site (Carrol, 57-58).
*Each web page must be able to stand alone<ref name= "Carroll"></ref>. Make sure that users know where they are in the site.


*Insert anchors (internal hyperlinks that lead to another page of the same site) for internal page navigation (Carrol, 48).
*Insert anchors (internal hyperlinks that lead to another page of the same site) for internal page navigation<ref name= "Carroll"></ref>.


*Include consistent navigational aids. Each page needs to have easy access back to the main page (Carrol, 60).
*Include consistent navigational aids. Each page needs to have easy access back to the main page<ref name= "Carroll"></ref>.


*Twenty percent of the internal web pages should be reserved for navigation. Shortcuts to the main page should be included on every page (Carrol, 67).
*Twenty percent of the internal web pages should be reserved for navigation<ref name= "Carroll"></ref>. Shortcuts to the main page should be included on every page.


*The home page requires more navigational space and has many purposes (Carrol, 70).
*The home page requires more navigational space<ref name= "Carroll"></ref> and has many purposes.
**Establishes the site’s identity and mission.
**Establishes the site’s identity and mission.
**Shows the site's hierarchy.
**Shows the site's hierarchy.
Line 59: Line 59:
==References==
==References==


#Carroll, Brian. (2010). ''[http://www.scribd.com/doc/64429015/Writing-for-Digital-Media Writing for Digital Media]''. New York: Routledge. Retrieved 2 Nov. 2012.
<references></references>
#Horton, Sarah. (2006). [http://universalusability.com/access_by_design/page_layout/consistent.html Page Layout: Apply a consistent design]. Universal Usability. Retrieved 7 Nov. 2012.

Revision as of 22:27, 13 November 2012

Design is an important aspect to remember when writing for the screen. In digital writing, design pertains to the overall look of the website and arrangement of the text, graphics, and other objects that make up the site. There are three main components to understanding and implementing design: consistency, usability, and navigability.

The design of a site or webpage is what will likely cause viewers to return to the site and continue reading it. The overall appearance must be appealing and entertaining.

Consistency

  • The repetition of elements gives a site a consistent identity[1].
    • Colors.
    • Graphics.
    • Headlines.
    • Typography.
    • Section divisions.
    • Text placement.
  • Adhere to an audience-specific style guide (HTML codes used and the grammatical format of text) throughout the site[1].

Usability

  • Keep text scan-able[1].
    • Highlight key words.
    • Use links.
    • Vary typeface.
    • Use colors.
    • Include subheadings.
    • Make bulleted lists.
    • Use paragraphs with one idea.
    • Practice brevity.
  • Keep it simple and user-friendly. Break pages into clearly defined areas and minimize distractions[1].
  • Include a visual hierarchy for information and navigation on each page[1].
  • Fifty to eighty percent of the page should be reserved for content[1].

Navigability

  • Easy-to-use navigation tools. A navigation bar is best utilized on the top of the website[2].
  • Each web page must be able to stand alone[1]. Make sure that users know where they are in the site.
  • Insert anchors (internal hyperlinks that lead to another page of the same site) for internal page navigation[1].
  • Include consistent navigational aids. Each page needs to have easy access back to the main page[1].
  • Twenty percent of the internal web pages should be reserved for navigation[1]. Shortcuts to the main page should be included on every page.
  • The home page requires more navigational space[1] and has many purposes.
    • Establishes the site’s identity and mission.
    • Shows the site's hierarchy.
    • Shows where to start.
    • Provides shortcuts to the most desired pages and sections.
    • Avoids clutter.
    • Conveys the big picture.

References

  1. 1.00 1.01 1.02 1.03 1.04 1.05 1.06 1.07 1.08 1.09 1.10 1.11 1.12 Carroll, Brian. (2010). Writing for Digital Media. New York: Routledge.
  2. Horton, Sarah. (2006). Page Layout: Apply a consistent design. Universal Usability.