Tips to Improve Your Webpage Performance

ad space

The cliché "a picture is worth a thousand words" must be treated with caution in using images in web pages. Quite often web creators have been using images for pure decoration and without functional purpose. Some image files are bigger than scripts and texts and thus load at a glacial pace.

Images give life to a web page, boosting the overall appeal of its layout and design. Web creators must therefore make sure that web page images are used well. Following are some tips to make the most of web page images:

Optimize images

Not everyone has a fast Internet connection so make sure that you properly optimize (compress) images before placing them on the web pages. This ensures minimal loading time without losing image quality.

Site visitors usually have little patience when it comes to loading web pages. Avoid large images formats such as BMP and TIFF. You can use Photoshop or Adobe Fireworks to optimize web page images.

Use title tags and image alt

For SEO purposes and to ensure the accessibility of images, all title tags and image alt should contain a description of that specific image. As a good SEO practice the image description should consist of keywords.

Visually-handicapped site visitors or those who use text-only browsers can have an idea of what the image in the web page is all about. In Internet Explorer, site visitors can tell if images have an alt-tag by moving the mouse over the graphics.

Unless necessary, don't use incompatible image formats

Many users don't have the latest CSS compliant browsers. Some people, for example, still rely on old Internet Explorer versions that are not compatible with the PNG alpha transparency properties. You have to remember that, when using images, site visitors will view your website using different browsers and different operating systems.

Use GIF or JPEG formats

Web page images should be in .gif or .jpg format as these work best on the web. The JPEG format's lossy compression makes it perfect for images with gradients. On the other hand, you can use the GIF format for animation or an image with consistent color zones. The PNG format is also a good choice, but it is still largely incompatible with older browsers.

What is image interlacing?

Image interlacing allows site visitors to view partial images as they gradually load on the web page. They eventually get clearer as the web page loads, as opposed to displaying the images after they have been completely downloaded. Images interlacing, however, result in bigger file sizes.