Provide meaningful Alt text for images. This helps users who rely on assistive technology such as a screen reader to understand the meaning of the image. The screen reader will read out the ALT description to the user.
Example: <img src="../images/womens_history_month_hero_image.png" alt="View the 2019 Women's History Month Opening Ceremony">
Examples of descriptive/meaningful Alt text
<img src="../images/dem_hero_image.png" alt="About the Neighborhood Emergency Response Team">
<img src="../images/city_seal.png" alt="City and County of San Francisco">
Examples of non-descriptive Alt text:
<img src="../images/city_seal.png" alt="image of city logo">
<img src="../images/dem_hero_image.png" alt="em_hero_image.png">
Decorative images that don’t present important content should have null alt text. Example: (alt=""). Or in the event that ALT text is redundant. Screen readers will ignore these images all together.
Here are some general guidelines to follow when providing Alt text. Alt text should:
Be succinct. Typically no more than a few words or a short sentence.
NOT be redundant or provide the same information as text within the context of the image.
NOT use the phrases "image of ..." or "graphic of ..." to describe the image. It is usually apparent to the user that it is an image.
For complex diagrams, charts, maps and graphs a text based equivalent needs to be provided either within the context of the page, such as in an adjacent data table. The alternative text can also be provided by linking to a separate web page that provides the longer description of the complex image.
Additional Information on Writing Effective Alt Text
https://webaim.org/techniques/alttext/