HTML: alt attribute

The alt attribute provides a short alternative for an image when the image cannot be seen or loaded.

What you will learn

Informative images

<img src="chart.png" alt="Sales increased from April to June">

Describe the meaning a reader needs, not every visual detail. Keep the text short and avoid starting with “image” or “picture”.

Decorative images

<img src="divider.svg" alt="">

An empty alt tells assistive technology that the image is decorative and can be skipped. Do not omit the attribute when an image is meaningful.

Images that act as controls

<a href="/home.html">
  <img src="logo.svg" alt="Yugien home">
</a>

For an image link or button, write the action or destination. Avoid keyword stuffing and do not rely on the title attribute as a replacement for alt.

Common mistakes