Alternative Text for Web Images

Include alternative text (or "alt text") for images on NREL.gov to improve their accessibility.

Alt text describes images in words so they can be understood by site visitors who use screen readers or  have images disabled. Section 508 of the Rehabilitation Act requires all images on our websites and applications to have alt text. Optimized images with alt text also perform better in search engine results.

Writing Alt Text

Alt text is a written description of the items, events, and text in an image. Alt text can vary depending on the context of the page and what is important for users to know. Briefly summarize the image based on the context of the content.

When writing alt text, follow these guidelines:

• Convey the meaning the image is conveying to the reader. You don't need to describe everything in the image or describe it in a decorative way.
• Include all critical information, such as numbers and other data.
• Include keywords for search engine optimization, but use them sparingly.
• Do not duplicate information that appears in the image's caption or the content of the page. If the image itself is described elsewhere on the page, be concise and keep the alt text minimal.
• Do not start alt text with phrases such as "Photo of" or "Illustration of."
• Limit alt text to 255 characters. If it needs to be longer, you can:
  
  
  • Incorporate an image description in the body content or image caption.
  • Use the show/hide image description option in the NREL.gov content management system to present the text. If using this option, note in the alt text field that a longer description follows.
  • Create a separate text version page.
  • Include a contact for assistance (e.g., "If you need assistance reading this image, contact the webmaster.") if the content cannot be adequately described or accessed using the options above.

Writing Captions That Complement Alt Text

Present information that would benefit both sighted visitors and visitors using screen readers in the caption. Captions shouldn't duplicate alt text; alt text and captions should supplement each other.

Writing Alt Text for Different Kinds of Images

Some images require different styles of alt text.

Linked Images

If the image is linked, describe the destination of the link in the alt text instead of describing the image.

Graphical Text

If your image includes only text, the alt text should only consist of that text. For example, if the graphic says "Wind and Hydro," the alt text should be "Wind and Hydro."

Decorative Images

Some images are used purely for decorative purposes and add no meaning to the page. Decorative images do not require alt text.

Technical Diagrams, Graphs, and Charts

If an image contains complicated data, charts, or graphs that cannot be described in 255 characters or less, provide the description in the body content, caption, or a text version, as described above. If the image is too complex to describe in a text version, provide a link to the webmaster.

Image Maps

An image map includes hotspots that link to different destinations. When developing an image map, write alt text for each link. In general, the alt text should follow the guidance for linked images. You may also write alt text for the entire image if it adds important information.

Background Images

Cascading style sheets are used to show background images that add to the aesthetic appeal of a page but do not add any real meaning to the content. Because they do not add meaning, these background images do not require alt text. If you use a background image that does add meaning to the page, it should be coded as a regular image with alt text.