If a page on your website doesn’t load in about 8 seconds, you could be losing 30% of your site’s visitors. 30% of potential customers are lost when they get impatient and leave, likely not to return.

One cause of slow-loading pages is over-sized images. Lots of large images on a page means slower load times.

But, if you optimize each image to load as quickly as possible you dramatically reduce load times, keeping visitors at your website.

Let’s review why optimization is important:

1. What is Optimization?
2. Practical Tips

What is Optimization
Optimizing images for the Web means selecting the right file format and size for each image. This typically means choosing between JPG and GIF.

JPGs are generally used for photos. Use JPG for photography and large images requiring more than 256 colors because JPG compresses these images very well. A 32K file size for Web images is achievable.

GIFs have an advantage of being able to store multiple images in one file (animated GIF), but they’re limited to 256 colors. It’s not a great choice for photographs, but GIF files display crisper line art than JPG.

Practical Tips
What program should be used to optimize the graphics? Even two programs from the same company, such as Photoshop and Fireworks from Adobe, can optimize graphics for the web differently.

Just find a program you like and use it for everything.

You can also resize an image by specifying the width and height in HTML. That means loading an 800×600 image with code telling the image to display at 400×200. The drawback is you’re still loading the full 800×600 image.

The best practice is to resize that image down to 400×200 and optimize it for web before uploading.

Have fun optimizing images!

Tags: Design, Images, resize images

This entry was posted on Thursday, November 19th, 2009 at 11:39 am and is filed under Design, Graphics & Images. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.