Article Index
10 Easy Ways to Promote Your Website
5 Simple Steps to Accepting Payments
5 Steps to Understanding HTML
5 Ways to Avoid the 1998 Look
7 Reasons Why You Need a Website
7 Ways to Make Your Web Forms Better
A Question of Scroll Bars
Ads Under the Radar Linking to Affiliates
AJAX Should You Believe the Hype
All About Design Principles and Elements
An Introduction to Paint Shop Pro
An Issue of Width the Resolution Problem
Avoiding the Nuts and Bolts Content Management Software
Beware the Stock Photographer Picking Your Pictures
Building a Budget Website
Building Online Communities
Clean Page Structure Headings and Lists
ColdFusion Quicker Scripting at a Price
Column Designs with CSS
Content is King
Why You Should Put Your Content in a Weblog Format

The Smaller the Better Avoiding Graphical Overload

The Smaller, the Better: Avoiding Graphical Overload.

When you're designing your website, it's easy to start loading it up with graphics, creating images that you think look good and piecing them together to make a design. While it's a tempting way to do things, you have to try to avoid it as much as possible otherwise, you'll end up with graphical overload. Why is that a bad thing? Here's why.

It Takes Too Long to Download.

The first reason to cut down on graphics is that the more there are, and the larger they are, the longer it will take each of your pages to download. Now that many people have broadband connections, they're much more impatient than they used to be when it comes to waiting for pages to download: in most cases, you have around five seconds before your visitors start hitting the Back button.

What can you do about this, apart from using fewer pictures? Well, you can also make sure that you resize your images in a graphics editor so that their file sizes get smaller. If you just resize images by specifying a width and height in HTML or CSS, then they still take just as long to download as they would have, without the extra time serving any useful purpose.

Also, you might want to consider turning on compression in your image editor: JPEG files especially can often be compressed by 20-30% before there's any noticeable difference to the human eye. Try out different formats and compression levels to see what works.

It Gets Too Busy.

If you've ever tried to use a site that has more than three or four different images on the page at once, you'll know what I mean by that. Your eye is forced to dart all over the page, not sure where to focus: the page simply has too much going on at once. Instead of making your site busy by loading it up with graphics, you should try your best to keep it as simple as you can.

One thing I would suggest is that you take a look at the front pages of a few newspapers, and notice how they only ever lead on one picture. Putting two pictures on a front page is considered to be very bad: the reader doesn't know where to look. That goes double for websites, where the viewable area is much smaller than a newspaper page. Even if you have more than one thing to say, it's better to 'go large' with one picture and then explain the other things in text, next to it or below it.

It Distracts from the Content.

Don't forget that most of the people on your site are there to get information, not to look at your graphics. Too many graphics will distract visitors from your content, or, worse, even hide it from them, forcing them to look around before they find it. Any time your graphics get in the way of people using your site, you're suffering from graphical overload.

What's the solution to this one? You simply need to think about whether all those graphics are really needed the chances are, they're not. Don't just add graphics because you think they look nice. Every graphic on your site should have a purpose.

An Exception: Photo Galleries.

If photography is the purpose of your site, then you obviously shouldn't be afraid to put a lot of graphics on one page. However, you really shouldn't just post large photographs one after the other. Instead, you need to provide thumbnails: smaller versions of each image, with the visitor being able to click on one to make it larger.

This lets you fit more pictures on each page, and avoids visitors having to spend their time and your bandwidth downloading files that they don't want to see. You can even add 'back' and 'next' navigation to each photo page, so the visitor doesn't have to go back to the thumbnails to see your next photo, if they want to see them all.


News Online