The HTML5 img Tag

It is typical for an HTML page to contain images too aside from plain texts. When it is necessary to add photos and images, the HTML5 <img> is used. The use of HTML5 <img> tag requires the use of two main attributes. Those are the src and alt attributes.

It has to be emphasized that technically, the HTML would not directly carry the image that has to be incorporated within the document. What happens is that the HTML5 <img> tag serves as the tool which holds the link for data regarding the image. By doing so, the mage can be linked directly to the document and it will be placed where the author intends to.

If it is necessary to link the image to another HTML document, the HTML5 <img> tag has to be placed inside the <a> tags.

The use of <img> tag is not the same in HTML4.01 and HTML5. In HTML4.0, the design attributes such as hspace, vspace, align and border can still be utilized. However, these were recognized as obsolete in HTML4.01. Hence, these are no longer applicable for HTML5.

The attributes which work well with the HTML5 <img> tag are the following:






Use of this is required because it provides exact details about the URL where the images can be located



Use of this is also required because it determines the text that serves as alternate detail for the inserted image



It is important in adjusting and determining the height of the image as it appears within the document



This adds details to the image as server –side or image-map



This adds details to the image as client-side image-map



It is important in adjusting and determining the width of the image as it is seen within the HTML document

The use of HTML5 <img> tag is not complicated since it is capable of supporting the Events Attributes in HTML5. Furthermore, it is also compatible with the Global Attributes in HTML5.

Users will also benefit much with the use of this tag. This is easily recognized by the common web browsers like Firefox, Internet Explorer, Opera, Safari and Google Chrome.

Featured pages


Learn about HTML5 architecture, design principles and patterns on HTML5 Overview Tutorial. Become …


Learn about HTML5 tags and discover a new list of HTML5 tags. Find out about HTML5 tags support by…


 Learn HTML5 development techniques, tips and tricks on our website. Find out what is required…

Date Time Picker

HTML5 forms use date and time controls regularly. HTML5 date and time controls are used by booking …