HTML alt Attribute
Definition and Usage
The alt attribute provides alternative information for an image if a user for some reason cannot view it (because of slow connection, an error in the src attribute, or if the user uses a screen reader).
Note: The alt attribute is required for the <img> element.
Note: For <input> elements, the alt attribute can only be used with <input type="image">.
Tip: To create a tooltip for an image, use the title attribute!
Applies to
The alt attribute can be used on the following elements:
Elements | Attribute |
---|---|
<area> | alt |
<img> | alt |
<input> | alt |
Examples
Area Example
An image map, with clickable areas:
<img src="planets.gif"
width="145" height="126"
alt="Planets"
usemap="#planetmap">
<map
name="planetmap">
<area shape="rect" coords="0,0,82,126" href="sun.htm" alt="Sun">
<area shape="circle" coords="90,58,3" href="mercur.htm" alt="Mercury">
<area shape="circle" coords="124,58,8" href="venus.htm" alt="Venus">
</map>
Try it Yourself »
Img Example
An image with an alternate text specified:
<img src="smiley.gif" alt="Smiley face">
Try it Yourself »
Input Example
An HTML form with an image that represents the submit button:
<form action="/action_page.php">
First name: <input type="text" name="fname"><br>
<input type="image" src="submit.gif" alt="Submit" width="48" height="48">
</form>
Try it Yourself »
Browser Support
The alt
attribute has the following browser support for each element:
Element | |||||
---|---|---|---|---|---|
area | Yes | Yes | Yes | Yes | Yes |
img | Yes | Yes | Yes | Yes | Yes |
input | Yes | Yes | Yes | Yes | Yes |