HTML documents don't actually contain images - rather they contain instructions to download images and embed them in the document.
The image element is placed in the position within the document where the image is to appear and, as a minimum, must contain the URL, or address, of where the image can be found on the server.
The image element has no closing tag but has a number of attributes, the most important of which are listed below. The image element takes the following form <img src="image.gif"> where "image.gif" is an available image stored on the server.
The src attribute. This is a URL and tells the element where to find the image on the server and is required. The URL can be absolute or relative.
The align attribute aligns the image relative to other elements within the page. This element is depreciated in HTML 4.01 since it can be achieved using a style definition. Some of the values align can take are ...
top - aligns text outside the image to the top of the image.
middle - aligns text outside the image to the middle of the image.
bottom - aligns text outside the image to the bottom of the image.
left - aligns the image to the left of the browser with other elements to the right.
right - aligns the image to the right of the browser with other elements to the left.
The width and height attributes set the height and width of the image in pixels. Images are scalable however the results are usually poor. If no height or width attributes are used the image will display at the size it was saved, however these attributes are required for the document to validate. As well as this, when the page loads, the browser won't know what size to make the image so will have to redraw the page when the image is actually downloaded causing an irritating jump.
The hspace and vspace attributes control the amount of whitespace around the image where the amount is a numerical value in pixels.
The alt attribute should contain an appropriate description that will be displayed if the image isn't displayed for any reason - it also displays within a tooltip in Internet Explorer. It is required for the document to validate properly and to satisfy accessibility guidelines.
The most commonly used image file formats on the web are GIF, JPG and PNG. Occasionally BMP is encountered but it is an uncompressed format that produces very large files so is not recommended.
GIF, JPG and PNG files carry the image in a compressed form.
GIF can display a maximum of 256 colours (one of which may be transparent)
JPG can display more than 16 million colours (does not support transparent)
PNG over 16 million colours (does support transparent).
There is no loss of quality due to compression with GIF or PNG but there is with JPG, where the greater the compression the greater the loss of quality. Which format to use depends on the image.
GIF is suitable for images with large areas of un-graduated colour (such as cartoons) but less well suited to very detailed images like photographs. JPG is more suitable for detailed images like photographs where loss of image quality is less obvious. PNG is suitable for either type of image.
Free Web Design Tutorials
Embedding ImagesURLs ExplainedLinking to DocumentsCreating TablesForms - BasicsInput and TextareaSelect ListsFramesetsThe Frame ElementNested FramesetsTargeting FramesInline Frames
Previous - Creating Lists
Next - URLs Explained 
