HTML uses the <img> tag to add images to a web page.
<img src=”/images/myimagefile” >
This is a stand alone element, without a closing part. The content added will also be in-line, occurring at the position of the tag.
For an image the source of the content is specified. This may either be relative to the current content html file position, for example src=”logo.jpg” if the file is in the same directory, or its position is known relative to the current file position. It is also possible to reference an image on another website src=”http://www.example.com/images/logo.jpg”. The copyright terms on images referenced in this way should be checked. where the image is available for re-use it is be better to copy the image to your server, rather than use another’s bandwidth. Also there’s the chance that the remote image may be moved or deleted.
Using the image tag in this way there is no control over the size of your image. It will be shown in the browser at the same size as the original image. The image tag also permits the height and width to be specified. If only one of them is specified then the image will be sized proportionately according to that one.
It is better to use the width and height attributes to specify the image size correctly. Specifying a smaller size wastes bandwidth and specifying a larger size will result in a degraded image.
The align attribute may be used to determine the positioning and flow of text around an image. This allows an image to be embedded within paragraph text, generally to the left or the right.
To avoid cramping the image with the adjacent text there are two parameters providing spacing hspace and vspace horizontal and vertical spacing respectively.
The article img Tag Parameters includes a table of the different parameters available.
HTML 5 and all That
HTML 5 requires that tags which are standalone, which don’t use a second closing tag to wrap content, should have a slash included before the closing greater than sign. There is also a requirement to provide alternative text readable by screen readers using the alt parameter.
<img src=”/images/myimagefile” alt=”My image” />
Using the other parameter tags is now deemed to be out of vogue. They should now be implemented through CSS.
SEO
It is considered good SEO to follow the current practice on adding an image. The addition of the alt text description is considered important.
The use of descriptive text and the addition of the closing slash to the tag will reduce the number of errors when the website page is validated against the current standards. This is also considered to be influential.
