Images must have alt text

Definition Each img element must specify an alt attribute or equivalent markup that either defines a text alternative or identifies the image as being used for decoration, spacing or some other stylistic purpose.
  • A text alternative for an image, usually specified with an alt attribute, provides a summary of the purpose of the image for people with visual impairments, enabling them to understand the content or purpose of the image on the page.
  • An image with a text alternative that is an empty string or that has role="presentation" is ignored by assistive technologies. Such markup indicates that the image is being used for decoration, spacing or other stylistic purposes rather than meaningful content.
  • HTML4 Legacy Techniques (Required)
  • HTML5 and ARIA Techniques (Required)
WCAG 2.0 Success Criteria

1.1.1 Non-text Content (Level A, Primary Success Criterion)

Rule Category Images
Scope Element
Target Resources img and [role="img"]
  • area
  • img
  • A text alternative should summarize the purpose of an image as succinctly as possible (preferably with no more than 100 characters).
  • The alt attribute is the preferred and most commonly used way to provide a text alternative for img and area elements.
  • The aria-labelledby attribute can be used to provide a text alternative when an image can be described using text already associated with the image, or for elements with role="img".
  • The aria-label attribute should only be used to provide a text alternative in the special case when an element has a role="img" attribute. Use the alt attribute for img and area elements.
  • The title attribute will be used by assistive technologies to provide a text alternative if no other specification technique is found.
  • Use the attributes alt="", role="presentation" or include the image as a CSS background-image to identify it as being used purely for stylistic or decorative purposes and one that should be ignored by people using assistive technologies.
Informational Links