Chapter 2. Creating Effective Layouts

In This Chapter

  • Identifying and organizing page contents

  • Including essential Web page elements

  • Emphasizing important information

  • Making pages usable and accessible

  • Creating wire frames

This chapter helps you begin the process of designing the pages for your Web site. Before you proceed with the page‐level design process, you must have a clear idea of what your pages need to include. (If you want help defining your project, check out the information about this important step in Book I, Chapter 3.) You also need a site map that shows how the pages you're designing relate to one another within the site.

Creating wire frames for page‐level layouts is an important and helpful step in the process of building a Web site. Wire frames are working sketches of the page‐level layouts for your site. The process of creating these sketches gives you an opportunity to think about how the elements of your site (the pages) work together regardless of details like specific colors and photos.

In addition to showing you how to create wire frames, this chapter gives you basic design rules, tells you what essential elements to include, and advises you how to fashion an accessible design.

Wire frames should not include finished art. The point of creating wire frames is to make sure that the elements you want to include lay out on your pages in a useful and aesthetically pleasing way. Figure 2-1 shows a sample wire frame; notice that the sample represents page elements but not ...

Get Building Web Sites All-in-One Desk Reference For Dummies® now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.