Site Content and Layout

1. Informational Design Site Content and Layout

2. Informational Design • Informational Design involves determining a Web page’s content • Content – text and graphics • A successful Web page uses words and images to capture the viewers’ attention and provide information.

3. Think about what the page looks like as well as what the content says!! • Text should be short and easy to read • Must stand out from graphics, animation, navigation, buttons, and other elements. • Graphics should be visually appealing and informative.

4. Types of Elements

5. Viewing Online Content • Users do not read a Web site as they would a printed item. • They scan the page in all directions, looking for something that catches their eye. • They use links to move quickly from one page to another **Don’t burry information – highlight key terms!

6. Organize Web Text • Web text should be organized like an inverted pyramid

7. Tips for Text • Be concise • Take time to review your text • Include strong verbs and nouns; eliminate the passive voice and wordiness • Say exactly what you mean in as few words as possible

8. Content Layout Guidelines • Visitors find it easier to use Web sites that contain short segments of text • Visitors are attracted to sites that are user friendly

9. Eliminate Clutter • Too much content can confuse visitors • Remove unnecessary content • Update information • Choose function over form • Avoid overkill

10. Align Text Consistently • When layout your page, line up items with each other • Avoid mixing alignments

11. Use Proximity, White Space, and Symmetry Proximity • Proximity – closeness of items to each other on a page • Causes readers to make assumptions about how elements related to each other • Try not to create false impressions

12. Use Proximity, White Space, and Symmetry White Space • White spaces – area without content • An area where your eye can take a break • Using white spaces helps frame and draw attention to content

13. Use Proximity, White Space, and Symmetry • Symmetry is a sense of balance in the layout • Page should feel balanced • To create a sense of symmetry you may divide your page in half: • Horizontal • Vertical • Diagonal • Radial • Asymmetric

14. Emphasize Content • A bigger design indicates more important information • A smaller design indicates that an item is less important • Most users look first at bold and larger items

15. Keep Download Time Short • You only have a few seconds to catch viewers attention • Every text item and graphic added increases download time • http://www.sixtiespress.co.uk/ • http://www.sixtiespress.co.uk/ • http://evuk.co.uk/