Web Design

Tuesday, November 22, 2005

PAGE DESIGN

PAGE DESIGN

If you ask why something works and you push back far enough, eventually everything seems to be based on contrast: the ability to distinguish one thing from another. Composition, sequencing, even legibility all rely on devices that affect the contrast between things.

We seek clarity, order, and trustworthiness in information sources, whether traditional paper documents or Web pages. Effective page design can provide this confidence. The spatial organization of graphics and text on the Web page can engage readers with graphic impact, direct their attention, prioritize the information they see, and make their interactions with your Web site more enjoyable and efficient.

Visual logic

Graphic design creates visual logic and seeks an optimal balance between visual sensation and graphic information. Without the visual impact of shape, color, and contrast, pages are graphically uninteresting and will not motivate the viewer. Dense text documents without contrast and visual relief are also harder to read, particularly on the relatively low-resolution screens of personal computers. But without the depth and complexity of text, highly graphical pages risk disappointing the user by offering a poor balance of visual sensation, text information, and interactive hypermedia links. In seeking this ideal balance, the primary design constraints are the restrictions of HTML and the bandwidth limitations on user access ranging from slow modems to high-speed connections such as Ethernet or DSL.

Visual and functional continuity in your Web site organization, graphic design, and typography are essential to convince your audience that your Web site offers them timely, accurate, and useful information. A careful, systematic approach to page design can simplify navigation, reduce user errors, and make it easier for readers to take advantage of the information and features of the site.


Visual hierarchy

The primary task of graphic design is to create a strong, consistent visual hierarchy in which important elements are emphasized and content is organized logically and predictably.

Graphic design is visual information management, using the tools of page layout, typography, and illustration to lead the reader's eye through the page. Readers first see pages as large masses of shape and color, with foreground elements contrasting against the background field. Secondarily they begin to pick out specific information, first from graphics if they are present, and only then do they start parsing the harder medium of text and begin to read individual words and phrases:

Diagram: Visual scanning of page structure over time

Contrast is essential

The overall graphic balance and organization of the page is crucial to drawing the reader into your content. A dull page of solid text will repel the eye as 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 looking for substantive content. You will need to strike an appropriate balance between attracting the eye with visual contrast and providing a sense of organization:

Diagram: Dull page versus balanced page

Visual balance and appropriateness to the intended audience are the keys to successful design decisions. The most effective designs for general Internet audiences use a careful balance of text and links with relatively small graphics. These pages load into browsers quickly, even when accessed from slow modems, yet still achieve substantial graphic impact:
Screen shot: Balance of text, links, and graphics on Williams-Sonoma recipe page
www.williams-sonoma.com

When establishing a page design for your Web site, consider your overall purpose, the nature of your content, and, most important, the expectations of your readers.



Google