Images, such as photos or graphics, enhance the visual appeal of a web page. Images are defined with the <img> tag. It is empty, it contains attributes only, and does not have a closing tag.
Syntax and Example
<img src="/path/to/image" alt="Alternate Text" style="width:128px;height:128px" />
- The src attribute defines the url (web address) of the image.
- The alt attribute specifies an alternate text for the image.
- You can use the style attribute to specify the width and height of an image.
HTML Best Practices
- Always specify the size of an image. If the size is unknown, the page will flicker while it loads.
- For SEO purpose and screen readers, always use appropriate alt attribute.
New in HTML5: Figure Captions
HTML5 introduced the <figure> and <figcaption> elements. The <figure> element is used in conjunction with the <figcaption> element to mark up diagrams, illustrations, photos, images and other things. The <figcaption> element is optional and can appear before or after the content within the <figure>.
<img src="/path/to/image" alt="Alternate Text" />
<p>This is an image of something.</p>
You can now semantically associate captions with their image counterparts.