Alternative Text for Images

This help article outlines why alternative (alt) text is important for accessibility and usability, how to ensure images are accessible via alt text, and where it may be most relevant.

...

Table of Contents

• Why is Alt Text for Images So Important?

• How do I Include Alt Text for Images?

• Where Will Alt Text for Images Be Most Relevant?

• University Policy Connection

...

Anchor
why why

Why is Alt Text for Images So Important?

Many times, content creators avoid using non-text content in an attempt to create more accessible resources. But without graphics or illustrations, your content becomes less dynamic and engaging overall, and thus less accessible to visual learners and those with cognitive disabilities. However, inaccessible non-text content can pose accessibility barriers for people who have difficulty perceiving visual content. For this reason, to ensure your non-text content is accessible, navigable, and usable for everyone, you must include alternative text for all contextually relevant non-text content.

Anchor
how how

How do I Include Alt Text for Images?

Web Accessibility in Mind (WebAIM), one of the world's leading authorities in web accessibility, outlines the following, practical criteria for including alt text in their Quick Reference on Web Accessibility Principles:

...

Alt text should present the contextual purpose and function of an image in as few words as necessary. When working with complex images like graphs and flowcharts, it is not always possible to present contextual purpose equitably and succinctly. This can mean that brief alt text, summarizing contextual purpose, should point to an external, long description or tabular representation of associated data. Please refer to the World Wide Web Consortium (W3C)’s tutorial on Complex Images for more detail.

Anchor
where where

Where Will Alt Text for Images Be Most Relevant?

Contextually relevant, non-text content may be included in HTML resources like web pages, web forms, social media posts, enewsletters, or in non-HTML digital resources like documents or presentations. Please reference the following links to learn how alt text can be applied in multiple digital environments:

HTML Content

• For faculty and staff: Content & and Media at pdx.edu 

Non-HTML Content

• Adobe Acrobat

  • Validating PDF Accessibility in Adobe Acrobat Pro

  • Repairing Inaccessible PDFs in Adobe Acrobat Pro

• Foxit PhantomPDF

  • Validating PDF Accessibility in Foxit PhantomPDF

  • Repairing Inaccessible PDFs in Foxit PhantomPDF

• Microsoft Office

  • Microsoft Support for Adding Alternative Text to Graphics

  • Microsoft Support for Creating Accessible Office Documents

Google Workspace

• Accessibility for Google Workspace

Social Media

• Facebook Help for Editing Alternative Text

• LinkedIn Help for Adding Alternative Text

• Instagram Help for Editing Alternative Text

• Twitter Help for Making Images Accessible

...

Anchor
connection connection

University Policy Connection

Making images accessible with alt text is a critical step in complying with Web Content Accessibility Guidelines (WCAG) 2 per Portland State University’s Digital Accessibility Policy. Please reference the following World Wide Web Consortium help article for more information:

• Understanding WCAG 2 Success Criterion 1.1.1: Non-text Content

...