Web Page Design

1
CHAPTER 6

• Web Page Design

2
Overview

• Basic design structure of most online journalism
  sites
• Principles that guide visual design for the Web
• Effective presentation of text, color and
  graphics
• An example of using authoring software

3
Basic Online Journalism Design

• Layout grids
• Page dimensions
• Usability

4
Basic Grid Design
5
Principles of Design

• Unity
• Contrast
• Hierarchy
• Consistency

6
Poorly Formatted Web Page
7
Improved Web Page Formatting
8
Text Formatting Considerations

• Fonts
• Alignment
• Line length

9
Text Techniques to Avoid

• Avoid line-to-line hyphenation
• Avoid use of underlining except for links
• Avoid italicized text

10
Using Colors

• Most online journalism sites choose relatively
  subdued color schemes and are free of splashy
  color.
• Judicious use of color for text and
  backgroundwith high contrast between the twocan
  create emphasis.

11
Using Graphics

• Can help tell the story visually and liven up the
  design of the Web page
• Use a graphics program (i.e., Adobe Photoshop) to
  create, manipulate and crop images
• Graphics considerations
• Resolution
• Dimension

12
Using Tables to Design Web Pages

• Divides a Web page into sections of vertical
  columns and horizontal rows
• Has evolved to allow more advanced page
  formatting
• Authoring programs (e.g., Macromedia Dreamweaver)
  do the HTML coding
• Tables are no longer used for layout use divs
  in stylesheet to set up content containers