What Is the HTML 5 img Tag?

In HTML 5, the img tag defines an image.

When Do You Use the img Tag in HTML 5?

In HTML 5, you may use the img tag to display images in a web page. These images are then called by the browser when the web page is loaded. The image is not “embedded” in the page, but is linked to it. Note that the more images you have on your page, the longer it will take to load the page, as more requests have to be made by the browser.

The following describes the allowable img tag attributes:

alt

This defines a short description of the image – very useful if the image does not display, and useful for screen readers and also search engines

height

This defines how tall the image is. This can either be a number or percent.

ismap

This defines the image as a “server side image map” – many links over certain parts of the image

src

This is the url path to the image

usemap

This defines the image as a client-side image map – use this with map and area tags to define the clickable areas.

width

This defines how wide the image is. This can be either a number or percent.

How Is the img Tag Used in HTML 5 Documents?

Here is a simple example:


<img alt="Clown with a red nose" class="interior" height="150" src="/images/clown.jpg" width="120">