How to Write Clear, Descriptive Alt Text
You will need to consider alt text for each image you publish online. It's important that your alt text is clear and descriptive to effectively communicate the visual information in the image.
- Don't begin with "Image of..."
A screen reader will already tell the user that this is an image, so you don't need to include the words "image of" in your alt text. However, do mention if your visual is a particular type of image like an illustration, headshot, infographic, collage, chart, or diagram. - Examine the image closely.
What visual information is the image conveying in the context of your page? What information would you not have if you could not see this image? Only mark it as a decorative image if it truly does not convey any important information or if its visual information is already repeated nearby on the page. - If the image is linked, write alt text that describes the link's purpose.
Linked images should have alt text that conveys the function of the link or where the link will transport the user. - Include the text in the image.
It's best to avoid using images with text embedded in them. However, if words are part of your visual, you should include them in your alt text so that screen reader users don't miss out on important text. - Determine if the image is complex.
Complex images such as infographics or charts & diagrams should have brief alt text that identifies the basic properties of the image, followed by a long description that contains the essential text and information communicated by the image.
Example: Alt Text Steps in Action
What would you write for this image's alt text?
For context, this photo features some students with disabilities who participated in a photo shoot at USC. Assume that this image will be posted on our Digital Accessibility website, where we provide resources on how to create accessible digital experiences. This context can help you determine what information to include in your alt text.
Our Alt Text Steps in Action will walk you through how we've arrived at our example alt text, if you're not sure what to write.
Note: This is just one example of a common type of website visual. Check out our Alt Text Examples for a greater variety of scenarios.
Auto-generated Alt Text
It is a best practice to write alt text yourself instead of relying on auto-generated alt text. Pre-written or auto-generated alt text won't take your page context into consideration and may not focus on the visual information that you are trying to convey in the image.
For instance, Microsoft products will auto-generate alt text when you upload an image to your document. You should replace this with your own alt text.