Web Graphic Layouts

One important issue with web graphics is the placement and layout on a web page. In this article, we will go over the some of the standard layouts of a web page. I say some because web page layouts have been growing changing and expanding rapidly over the last few years. Now we have 1-column 2-columns 3-columns, fixed width, expanding size, etc.

A few of the basic visual and reading habits of web page viewers are basically the same no matter what kind of layout they are on so we will try to go over these and some graphic placement styles geared to these reading and viewing patterns.

Web page graphics should attract people’s attention but not be such visual load that they are hard to read with. I’m sure you have been to websites that had small black text on a big red picture or a large image with small white text on top of it. Layouts like that can be enough to make your eyes burn and have you reaching for the close button.

Usually people look at the top of web pages first. This is called the “header” and is where most people put their main graphics and company logos. The header area should attract attention and draw people in. The header is usually the fist impression so you want it to look nice and give that good all-important fist impression that draws people into your site.

Next, people usually look down at the navigation layout to see what is inside of the site. This should look nice and attractive, but remember, people are trying to read navigation links so the graphics should be simple and easy to read. The basic standard a few years ago was to have the navigation links on the left side bar, but now navigation is across the top, on the left, on the right, and even in the footer (usually not all at once). There is no longer really a basic standard, and if there is it is disappearing fast. Some navigation layouts are very basic and easy to look through and others are more complex and full of drop down menus or graphics in the buttons.

Next, people will want to stay a while and read so they will move on to the body of the content. The content is usually without graphics; just plain text or sometimes a transparent design gets put into the body, but people usually keep them rather dim so people can still read text on top of them.

The footer is the last section on a page. Sometimes the footer has designs and sometimes it is blank. The standard was that the footer area just carried the copyright info and maybe contact links, but many of the newer designs are putting graphics and even navigation layouts in the footer.

This is just a brief introduction to the typical web graphic layout. You will have to decide how your site will be, which can seem daunting with all of the different options. At PixelPly, we can consult with you to make sure that the layout looks good with your content.