Wednesday, January 30, 2008

Optimizing Images

Optimizing Images

Almost all web pages incorporate images even if it is just the logo image.

We continue this Web Page Optimization series by looking at optimizing the page Image tag.

Why Optimize Page Images?

Search engines have in recent years added new and specialised search functionality, and now not only can you search for particular words but also for images, sounds and video.

For Examples we can search for images on Yahoo or Google here we look for images of saving private ryan.

:


This is what yahoo returns:

 
 


So how does yahoo Index these images? Well the only things it can index are the image name and the image alt attribute. Therefore for maximum effect you should make both the name and alt tags meaningful.

To illustrate I will show you the image declaration for the image above. The image name I have highlighted in yellow and the alt attribute contents in grey.

<img border="1" src="images/web-page-optimization-images-2.gif"
alt="web Page Optimization-Images-2" width="417" height="231">

 
 

 You should notice that they are almost identical and that they relate to the content of this page. In the example for the Yahoo search then I would have called the image- Private Ryan.... and the alt attribute would have been similar.

What is the alt attribute: The alt attribute is meant for browsers that don't display images or have disabled them. The visitor then sees the text within the alt tag. It has not been normal practise to use these attributes but using the alt attribute is a requirement of XHTML.

Related articles and resources:

 
 

No comments: