Chapter 7 Highlights from Web Style Guide

1. Page Design CGS2826 Web Design Program in Interdisciplinary Computing Florida State University From Web Style Guide, Chapter 7: Page Design

2. Design creates visual logic and seeks an optimal balance between visual sensation and graphic information.

3. Adaptive Design Design creates visual logic and seeks an optimal balance between visual sensation and graphic information. Style sheets can adapt the HTML document for use in different contexts.

4. Content Order

5. “Front Loading”

6. Selective Display

7. Text Alternatives Alternate text comes in many forms. A descriptive caption is an alternative means to convey information contained in an image. Many sites use text links in the footer of the page to provide a text-only alternative to image-based links. You can provide alternate text in the code of the page: for example, using the “alt” attribute of the <img> tag to provide alternate text for images. Audio and video presentations are often presented with captions and a text transcript .

9. Consistency

10. Contrast A page of solid text will repel the casual reader with a mass of undifferentiated gray, without obvious cues to the structure of your information. A page dominated by poorly designed or overly bold graphics or typography will also distract or repel users seeking substantive content.

13. Test your designs on a number of devices and laptops and in a variety of conditions, especially if you are using subtle colors to define important page functions or content. In general it’s best to use a more robust, high-contrast typography color scheme. Overuse of graphic emphasis leads to a “clown’s pants” effect in which everything is equally garish and nothing is emphasized.

14. the ground field around page elements is as active and important a part of the design as any figure element on the page. Filling all the white space on a page is like removing all the oxygen from a room —an efficient use of space perhaps, but decidedly difficult to inhabit.

15. Gestalt Design Principles Centuries of designing documents for readers have taught the world useful lessons in how humans read and absorb information.

19. At normal reading distances the arc of the visual field covered by the macula is only a few inches wide—about the width of a well-designed column of text, or about twelve words per line. Readers can adapt line length in fluid layouts by narrowing the browser window.

20. Page Length Long web pages require the user to remember too much information that scrolls off the screen; users easily lose their sense of context when the navigational buttons or major links are not visible