====== 5.3.1. Enter the alt attribute to each image map and corresponding <area /> tags ======

Whenever an image map is included in the HTML code:

  * An ''alt'' attribute must be added to the ''<img />'' tag, as well as to each ''<area />'' tag.
  * The ''alt'' attribute of the ''<img />'' tag must state the purpose of the image map. 
  * The ''alt'' attribute of each ''<area />'' tag must state the purpose of the link.

For example, imagine a map of the United States in which you can click on each state to obtain more information about the state: 

<code html>
<img src="images/us-map.png" alt="Map of the United States" usemap="#us-map" />

<map name="us-map">
    <area shape="poly" coords="[…]" href="alabama.html" alt="Alabama (AL)" />
    <area shape="poly" coords="[…]" href="alaska.html" alt="Alaska (AK)" />
    <area shape="poly" coords="[…]" href="arizona.html" alt="Arizona (AZ)" />
    […]
</map>
</code>

===== Related recommendations =====

<note bulle>
  * Previous recommendation: [[notices:html-css:renseigner-l-attribut-alt-sur-les-images-porteuses-d-information]]
  * Next recommendation: [[notices:html-css:integrer-les-balises-map-et-area-juste-apres-chaque-image-mappee-dans-le-flux-html]]
</note>