1. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's1 Document and Web design has five goals: to make a good impression on readers to help readers understand the structure and hierarchy of the information to help readers find the information they need to help readers understand the information to help readers remember the information

2. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's2 To plan a design, take these two steps: Analyze your audience and purpose. Determine your resources.

3. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's3 For multicultural readers, consider four cultural preferences: paper size text direction typeface preferences color preferences

4. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's4 Determine your resources: Time. What is your schedule? Money. Can you afford professional designers, print shops, and Web developers? Equipment. Do you have graphics software, desktop-publishing programs, and a printer?

5. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's5 There are four principles of design: proximity alignment repetition contrast

6. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's6 Proximity organizes this image: Source: U.S. Department of State, 2011.

7. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's7 Alignment organizes this image: Source: Carnegie Science Center, n.d.

8. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's8 Repetition organizes this image: Source: Myers, 2007, p. 362.

9. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's9 Contrast clarifies this image: Source: Lambert Coffin, 2010.

10. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's10 Understand how learning theory relates to page design: chunking queuing filtering

11. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's11 Consider using six typical accessing aids: icons color dividers and tabs cross-reference tables headers and footers page numbering

12. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's12 Use two elements to create your page layout: page grids white space

13. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's13 Margins have four purposes: They limit the amount of information on the page, making the document easier to read. They provide space for binding and allow readers to hold the page without covering up the text. They provide a neat frame around the type. They provide space for marginal glosses.

14. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's14 A document bound like a book has these margins:

15. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's15 A multicolumn design offers three advantages: Text is easier to read because the lines are shorter. Columns allow you to fit more information on the page. Columns let you use the principle of repetition to create a visual pattern.

16. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's16 Typography includes seven elements: typefaces type families case type size line length line spacing justification

17. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's17 Different typefaces make different impressions: This paragraph is typed in Monotype Corsiva typeface. You are unlikely to see this style of font in a technical document because it is too ornate and too hard to read. This paragraph is Times Roman, an effective typeface for text in the body of technical documents. This paragraph is Tahoma, which has a modern, high- tech look. It is best suited for headings and titles in technical documents.

18. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's18 Two main categories of typefaces are serif and sans serif: N serif sans serif

19. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's19 A type family includes many variations: Some of the members of the Helvetica family: Helvetica Helvetica Bold Helvetica Bold Italic Helvetica Narrow Helvetica Narrow Bold Helvetica Narrow Bold Italic

20. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's20 Case affects readability: Lowercase letters are easier to read: Individual variations are greater in lowercase words THAN THEY ARE IN UPPERCASE WORDS.

21. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's21 Different functions call for different type sizes: footnotes: 8- or 9-point type indexes: 2 points smaller than body text slides or transparencies: 24- to 36-point type

22. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's22 Use line spacing carefully when designing headings: Summary In this example, the writer has skipped a line between the heading and the text that follows it. Summary In this example, the writer has not skipped a line. The heading stands out, but not as emphatically. Summary. This run-in style makes the heading stand out the least.

23. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's23 Use other design features for clarity and emphasis: rules boxes screens marginal glosses pull quotes

24. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's24 These seven principles will help you design effective Web sites and pages: Create informative headers and footers. Help readers navigate the site. Include extra features readers might need. Help readers connect with others. Design for readers with disabilities. Design for multicultural readers. Design simple, clear Web pages.

25. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's25 Follow these five guidelines for making your site easy to navigate: Include a site map or index. Use a table of contents at the top of long pages. Help readers get back to the top of long pages. Include a link to the home page on every page. Include textual navigational links at the bottom of the page.

26. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's26 This is a typical site map: Source: National Institutes of Health, 2010.

27. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's27 This is a typical table of contents: Source: U.S. Copyright Office, 2010.

28. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's28 Consider these three types of disabilities: vision impairment hearing impairment mobility impairment

29. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's29 Follow these three suggestions when designing for multicultural audiences: Use common words and short sentences and paragraphs. Avoid idioms, both verbal and visual, that might be confusing. If a large percentage of your readers speak a language other than English, consider creating a version of your site in that language.

30. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's30 Follow these three guidelines for designing a simple site: Use conservative color combinations to increase text legibility. Avoid decorative graphics. Use thumbnail graphics.

31. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's31 Follow these three suggestions to make text easy to read: Keep the text short. Chunk information. Make the text as simple as possible.

32. Chapter 7. Designing Documents and Web Sites © 2013 by Bedford/St. Martin's32 Follow these two suggestions to write clear, informative links: Structure your sentences as if there were no links in your text. Indicate what information a linked page contains.