Contact Us

CreativeSCS Home | Content & SEO | Editing Services | Web Development | Service Catalog

4 revisions
6 pages
$9/extra page

11 revisions
12 pages
$9/extra page

Design Notes: Our Standard Layout

We use our own standard four-column layout when designing templates for clients. This consists of a main content column, a navigation/sidebar column, and two extra columns for advertisements, boxes and widgets. There is a flex-width variant, and a more frequently utilized fixed-width version.

In the fixed-width variant, the layout is 1280 pixels in width, as more than half of internet users nowadays have screens larger than 1024x768. To limit display width would waste valuable screen real estate.

While we strive to maximize the utilization of available space, we also try to preserve usability for users with smaller screen sizes, down to and including the 800x600 screen resolution. As only 4% of users still use this display setting, it would not make sense to design for screens that are any smaller.

Our design principle is to make sure that the most important parts of the page are seen, even when available screen space is limited. To this end, we position both content and navigation towards the left side, leaving most advertisements and extras on the right. This way, even with a smaller screen requiring horizontal scrolling, there is no significant loss of usability.

In the basic configuration, we place the content column in the leftmost position, and give it a width of 600 to 640 pixels. In the unlikely event that someone is using a 640x480 monitor to view the page, they would still be able to see the content without using the horizontal scrollbar.

Next comes the navigation sidebar, which adds to the content's width for a total of 800px. Anyone using an 800x600 monitor should thus be able to see both content and navigation at once. After this comes the first ad column, which is 224 pixels wide. With content and navigation, total width adds up to 1024 pixels: just right for the next larger screen size. Finally comes the second ad column, at 256 pixels wide. As you may have observed, the total now adds up to 1280 pixels.

An alternate configuration would have the content and navigation columns switched, since aesthetic considerations as well as usability concerns may favor this more conventional layout. Of course, this would make it a bit more difficult for those with 640x480 screens, but hardly any are left. As most users are less likely to be confused by this layout, this is our favored configuration for our standard 4-column fixed-width templates.

Labels: ,

© 2004–2010 | Clarity template by our web design team | Site Map | Credits | Legal
Powered by Blogger