Each week we add a little tip to assist you in your web building. Some of the things you already know and sometimes you will come across a thing or two that you wanted but did not know where to find it. This week we will feature
"Proper Use Of Image Tags"
When including images on your Web pages, there are a few rules you should
follow to enhance the experience for your visitor. Use the following as a
kind of checklist for placing images in your pages.
Define widths and heights:
Make sure you specify width and height attributes in your image tags. This gives the browser the sense that it has
already loaded an image, even if has not, and will it will prevent any nearby text or other elements from "re-wrapping" after the image has loaded.
<img src="myimage.gif" WIDTH="100" HEIGHT="100">
Use the ALT attribute:
This attribute of the image tag shows text on
mousing over the image, and also offers a description if browsers have images turned off. If used effectively it can also increase your ranking on the search engines.
<img src="myimage.gif" ALT="New York Metropolitan Museum">
Specify a border:
Even if your image has no border, it is a good idea to specify a value of none, just in case your image is used as a hyperlink. By defining a zero border, you eliminate that ugly blue box around hyperlinked images.
<img src="myimage.gif" BORDER="0">
Use alignments:
If you place an image next to text, that text defaults to display at the bottom of the image. You can specify an alternative alignment.
<img src="myimage.gif" ALIGN="middle">
Try hspace and vspace:
These attributes create a margin of free space
around your image, both horizontally and vertically, in pixels. This can be helpful in buffering your images from text or other page elements.
<img src="myimage.gif" VSPACE="5" HSPACE="10">
You can also see this little tip (much more elaborated) along with many others at the below link.
[ Little Tips ]