Doug's Simplified Website Design Guide

Doug's Simplified Website Design Guide
[ Index ] - [ About Me ] - [ The Basics ] - [ Screen Sizes ] - [ Graphics ] - [ Stuff That Sucks ]


Optimization Techniques

Width and Height

Don't be afraid to use width and height tags on all your images. This will actually help to speed up the loading time of the site because it creates the space on the page that it needs to display the graphic. When you leave out these tags, it shows the text first, then the image will pop up. Often times the browser will have to redraw the page in order for text or any other content to make room for that new, undefined image.

Trim Those Graphics

You want to make your graphics as small as possible, so that they will load faster. One way to do this is to trim off the excess border around your images. The following images are displayed with a border around them, to show you the full size of each one.

Why have all this excess... When you can just do this?

Anti-Aliasing

Nothing looks worse than pictures or graphic text with jagged edges. Most graphics editing software have the option for anti-aliasing, which is basically a function that smooths out the edges of graphics and text. If you find that you are unable to use the available anti-alias option, you should increase the amount of colors used in the image you are working on.

View the graphics above to see the difference that anti-aliasing can make. See how much smoother the top graphic looks? Because there are so many different graphics editing software packages out there, I can only tell you to consult your software's documentation on how to do this.


Copyright 2001 Fungi Software (Wicked Clean Productions)
Email: fungisoft@hotmail.com