Приглашаем посетить
Отели (hotels.otpusk-info.ru)

Chapter 5. Basic Page Layout

Previous Page
Table of Contents
Next Page

Chapter 5. Basic Page Layout

Chapter 5. Basic Page Layout

OK, we're ready to start creating some actual page layouts where CSS controls the positioning of elements. These examples are simple, easily reproduced layouts that show you the basics. They also demonstrate that you can create clean and attractive layouts without extraneous graphics and lots of little boxes everywhere.

Chapter 5. Basic Page Layout

In these examples, I do not create some styles that I might create for a real-world site. For example, I don't first set the margins, I eliminated these steps so I can keep these examples simple and clean.


It's easy to forget that the purpose of a Web page is to connect the user with the content; I try to ensure that anything I add to a page is content or an element that helps the user either access that content or understand the relationships between the various types of content. The proximity in which elements are placed to one another and a few rules (meaning, in this case, thin lines) are often all a Web page needs. The other elements are usually eye candy, meant to give the page appeal and individuality. But too much of that clutters the page and distracts the viewer.

Simple designs not only render most consistently across a wide variety of user agents, but they make it easier for the viewer to interact with the content. As soon as the viewer starts to wonder where to go or what to do next because of poor organization or excessive screen junk, the interface becomes the focus, not the content. A well-designed interface is, in this respect, invisible to the user.

Enough philosophy; let's start with a simple two-column layout.

    Previous Page
    Table of Contents
    Next Page