Creating Accessible Digital Content

General strategies

Tab/Accordion Items

What Is alt text?

Alternative text (alt text) is a brief description of an image that conveys its essential content and function. It is read by screen readers for users who cannot see the image and is displayed when an image fails to load.

Why is alt text important?

Importance

Description

Improves accessibility

Helps users who are blind or visually impaired understand image content.

Supports users with slow connections

Provides context when images do not load.

Enhances usability

Users can understand images even when they cannot view them.

Aids comprehension

Offers context to all users in text-only browsing situations.

How to write effective alt text

Basic guidelines

  • Use specific, meaningful descriptions that convey the image’s purpose.
  • Be concise.
  • Avoid redundant phrases like “image of” or “picture of.”
  • Provide context when necessary, especially for complex visuals.
  • For decorative images, use empty alt attributes (alt="") or include “Decorative.” as the alt text.

Deeper dive

Question

Answer

How do I write alt text for charts and graphs?

Summarize key takeaways in the alt text. Provide a full data description in surrounding text or a linked data table. Example: "Bar chart showing monthly absences: January total 30, February total 25, March total 28."

Should decorative images have alt text?

If an image is purely decorative, use alt="" so screen readers skip it.

How do I write alt text for images with embedded text?

If an image contains critical text, include it in the alt text. If the text is lengthy, summarize and provide a full version elsewhere. Example: "Event flyer for the Accessibility Summit, June 15, with keynote by John Doe."

How should I handle alt text for logos?

Use the company or organization name. Example: "Google logo," not "Blue and red letters spelling Google."

What about complex images like infographics?

Provide a short summary in the alt text. Include a full description in surrounding text or as a linked document. Example: "Infographic summarizing accessibility best practices. Full description in the text below."

Related WCAG standards

1.1.1 Non-text Content (A): All non-text content that is presented to users must have a text alternative that serves the equivalent purpose.

What Is color contrast?

Color contrast refers to the difference in luminance between text (or graphical elements) and its background. Proper contrast ensures that content is readable and perceivable by all users, including those with visual impairments.

Why Is color contrast important?

Importance

Description

Improves accessibility

Ensures content is readable for users with low vision or color blindness.

Enhances usability

High contrast improves visibility in different lighting conditions

Supports compliance

Meets accessibility standards to prevent barriers for users.

Aids comprehension

Clear contrast makes information easier to process.

How to ensure proper color contrast

Basic Guidelines

  • Use a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (WCAG AA).
  • Ensure icons and graphical elements meet a minimum 3:1 contrast ratio against their background.
  • Avoid using color as the sole means of conveying information (e.g., errors should include both color and text).
  • Check contrast across different devices to ensure consistency.
  • Use accessible color palettes that provide adequate contrast.

Examples

Avoid

Use Instead

Light gray text on a white background

Dark gray text on a white background (4.5:1 ratio)

Red error text without additional indicators

Red error text with an icon and text label

Yellow text on a white background

Black or dark text on a yellow background

Deeper dive

Question

Answer

How do I check contrast ratios?

Use tools like the WebAIM Contrast Checker or browser extensions.

What about logos?

Logos are exempt from WCAG contrast requirements but should still aim for readability.

How can I ensure hyperlink contrast?

Ensure hyperlinks are distinguishable from surrounding text by using both color and an underline.

Can I use transparency in backgrounds?

Avoid using overly transparent backgrounds that reduce contrast readability.

What if my brand/template colors don’t meet contrast requirements?

Adjust shade intensity or provide an alternative design for accessibility.

Related WCAG standards

What are headings?

Headings provide a hierarchical structure to content, making it easier for all users to navigate and understand information. Properly formatted headings create a logical outline of a document or webpage.

Why are headings important?

Importance

Description

Improves accessibility

Screen readers allow users to navigate by headings, aiding those who rely on assistive technology.

Enhances usability

Clearly defined sections help all users quickly locate relevant content.

Aids comprehension

Logical organization enhances readability and clarity.

How to use headings effectively

Basic guidelines

  • Use H1 for the main title, followed by H2, H3, etc., in a hierarchical order.
  • Do not skip heading levels (e.g., do not jump from H1 to H3).
  • Keep headings concise and descriptive.
  • Avoid using headings solely for visual emphasis: Use proper styles instead.
  • Ensure headings make sense out of context for screen reader users.

Examples

Avoid

Use Instead

Large bold text for a section title

Properly styled H2 or H3 heading

Skipping heading levels (H1 → H3)

Maintaining a logical sequence (H1 → H2 → H3)

Using vague headings ("More Info")

Using clear, descriptive headings ("Accessibility Guidelines")

Deeper dive

Question

Answer

How many H1s should a document or webpage have?

Each document or page should have only one H1, typically for the main title.

Can I use bold text instead of headings?

No, bold text does not provide the structural benefits of proper headings. Use true heading styles.

What if a section does not need a heading?

Use paragraph text instead. Do not insert empty headings for spacing.

How do I test if my headings are correctly structured?

Use a screen reader or an accessibility tool to navigate by headings.

Should headings be used in tables?

Only if the table needs sectioning; otherwise, use table headers instead.

Related WCAG standards

What Is multimedia accessibility?

Multimedia accessibility ensures that video and audio content can be accessed, understood, and used by people with disabilities. This includes providing captions, transcripts, and audio descriptions.

Why Is multimedia accessibility important?

  • Supports users with hearing or visual impairments by providing alternative formats.
  • Improves comprehension for all users, including those in noisy or quiet environments.
  • Enhances engagement by making content accessible across different learning styles.
  • Meets compliance with accessibility laws and guidelines, such as WCAG and ADA.

How to ensure accessible multimedia

Basic Guidelines

  • Provide captions for all video content.
  • Offer transcripts for both audio and video materials.
  • Include audio descriptions for videos with essential visual content.
  • Use accessible media players that support keyboard navigation.
  • Ensure automatic media playback can be paused or controlled.

Examples

Avoid

Use Instead

Video without captions

Video with accurate, synchronized captions

Audio podcast with no transcript

Podcast with a downloadable text transcript

Complex visual content without description

Video with audio description explaining key visuals

Deeper dive

Question

Answer

How do I create accurate captions?

Use professional captioning services or AI-assisted tools, then manually review for accuracy.

Are auto-generated captions enough?

No, auto-generated captions often have errors. Always review and edit them.

When is an audio description needed?

If the video contains important visual information not conveyed through dialogue.

What is an accessible media player?

A player that supports captions, keyboard navigation, and screen reader compatibility.

How should I handle live video accessibility?

Provide live captions and offer an ASL interpreter when possible.

Related WCAG standards

Automated Checks

Automated accessibility evaluation tools are useful for quickly identifying common issues in digital content, but they have limitations and cannot fully replace human evaluation. Explore what an automated accessibility checker what can and cannot do.

Manual Review

Manual accessibility checks are an essential complement to automated tools. They rely on human judgment to assess aspects of accessibility that tools can't fully evaluate. Explore key manual checks and guidance for evaluating headings, color contrast, link text, keyboard navigation, forms, and tables.

Additional information

Learn more about evaluating accessibility of digital content

Strategies and resources by content type

Tab/Accordion Items

Accessible presentations ensure that slides are readable, navigable, and usable for all audience members, including those using assistive technology. This applies to PowerPoint (PPT), Google Slides, and other slide-based tools.

Key principles of presentation accessibility

Strategy

How to

How to check

Use slide titles for every slide

  • Each slide should have a unique and descriptive title.
  • Avoid blank titles—this helps users navigating via screen readers.

Enable the Outline View (PowerPoint) or check the Slide Titles in Google Slides.

Ensure proper reading order

  • Arrange slide content in a logical reading order.
  • Use the Selection Pane (PowerPoint) or Tab key navigation to verify order.

Navigate slides using the Tab key—ensure elements follow a meaningful sequence.

Use accessible text formatting

  • Use sans-serif fonts (e.g., Arial, Calibri, Verdana).
  • Ensure font size is at least 24pt for readability.
  • Maintain high contrast between text and background.

Run an Accessibility Checker in PowerPoint or Google Slides.

Provide alternative text for images & graphics

  • Add descriptive alt text for meaningful images, charts, and infographics.
  • Mark decorative images as decorative (PowerPoint) or leave blank.

Right-click an image and select Alt Text.

Ensure descriptive links

  • Use meaningful link text rather than raw URLs.
  • Example: “Learn more about accessibility” instead of “Click here.”

Scan for generic phrases like “Click here” and replace with contextual links.

Avoid using color as the sole means of communication

  • Use patterns, labels, or underlines to differentiate key elements.
  • Avoid red/green combinations that may be difficult for colorblind users.

View slides in grayscale mode or use a color contrast checker.

Enable automatic captions for live presentations

  • Use built-in captioning tools
  • Provide a transcript for pre-recorded presentations.

Enable real-time captions and test for accuracy.

Share presentations in an accessible format

  • Export slides as tagged PDFs to retain structure.
  • Avoid distributing slides as images or scanned PDFs.

Open exported PDFs in Adobe Acrobat and use the Accessibility Checker.

Additional resources

Accessible documents ensure that all users, including those with disabilities, can read, navigate, and interact with the content effectively. This applies to word processing files (e.g., Microsoft Word, Google Docs), PDFs, and other text-based documents.

Key principles of document accessibility

Strategy

How to

How to check

Use proper headings & structure

  • Apply true heading styles (H1, H2, H3, etc.) instead of just bolding text.
  • Maintain a logical order (e.g., don’t skip from H1 to H3).
  • Ensure headings accurately describe sections.

Use the document’s built-in Navigation Pane (Word/Google Docs) to verify structure.

Provide alternative text for images

  • Add concise but descriptive alt text to meaningful images.
  • Decorative images should be marked as decorative (Word) or left without alt text.
  • If an image conveys complex data (e.g., charts), include a text summary nearby.

Right-click an image and check for an “Alt Text” option.

Ensure descriptive links

  • Use meaningful link text (e.g., “View the accessibility guide” instead of “Click here”).
  • Avoid raw URLs unless necessary.

Scan document for phrases like “Click here” or “Read more” and replace them with descriptive text.

Use tables properly

  • Define column headers using the table properties.
  • Avoid merged or empty cells that disrupt reading order.
  • Include a table caption or summary for context.

In Word, select the table, go to “Table Design,” and check for a Header Row.

Ensure sufficient color contrast

  • Ensure text has at least a 4.5:1 contrast ratio with its background.
  • Avoid using color alone to convey meaning.

Use a color contrast checker or test by converting the document to grayscale.

Use accessible fonts & formatting

  • Choose readable fonts (e.g., Arial, Calibri, Verdana).
  • Use a font size of at least 12pt for body text.
  • Ensure line spacing is at least 1.5 for readability.

Scan document for small or hard-to-read text.

Verify reading order & logical flow

  • Ensure content is read in the intended order (especially in PDFs).
  • Avoid placing text inside floating text boxes that disrupt navigation.

Use Tab key navigation or screen reader preview.

Convert to an accessible PDF (if needed)

  • Export correctly from Word/Docs instead of printing to PDF.
  • Ensure tags, alt text, and headings remain intact.
  • Use Adobe Acrobat’s Accessibility Checker for validation.

In Acrobat, open the Accessibility Checker (Tools > Accessibility > Full Check).

Additional resources

Accessible video and audio content ensures that all users, including those with hearing or visual impairments, can access the information. This applies to recorded and live-streamed media.

Key principles of video & audio accessibility

Strategy

How to

How to check

Provide captions for all video content

  • Captions should be synchronized, accurate, and complete.
  • Use closed captions that can be turned on or off.
  • Include speaker identification and non-speech sounds (e.g., [music playing]).

Enable captions and verify accuracy by watching the video.

Offer transcripts for audio & video

  • Transcripts should include spoken dialogue and relevant sounds.
  • Make transcripts available as downloadable text or HTML.

Open the transcript and ensure it matches the spoken content.

Provide audio descriptions for visual content

  • Audio descriptions narrate important visual details not conveyed through dialogue.
  • Particularly important for videos with significant visual elements (e.g., charts, demonstrations).

Play the video with audio description and confirm key visuals are described.

Use an accessible media player

  • Ensure playback controls are keyboard accessible.
  • Provide a contrast-friendly interface for visibility.

Test media controls using only a keyboard and screen reader.

Ensure live video accessibility

  • Provide live captions for webinars and virtual meetings.
  • Consider offering sign language interpretation.

Enable live captions and confirm accuracy during playback.

Additional resources

Social media accessibility ensures that posts, images, videos, and interactions are usable by all users, including those who rely on screen readers, captions, and keyboard navigation. Each platform has different accessibility features, but core best practices apply across all.

Key Principles of Social Media Content Accessibility

Strategy

How to

How to check

Write descriptive and clear text

  • Use plain language and avoid unnecessary jargon.
  • Capitalize each word in hashtags (#CamelCase instead of #alllowercase).
  • Keep posts concise and scannable with proper spacing.

Read the post aloud to ensure clarity and ease of understanding.

Provide alternative text for images

  • Add alt text to all meaningful images.
  • Be descriptive but concise (focus on key details).

Enable a screen reader and verify how the image is described.

Ensure video content includes captions and transcripts

  • Use auto-generated captions with manual corrections or upload your own captions.
  • Provide a link to a transcript.

Play the video with captions on and verify accuracy.

Use descriptive links

  • Avoid generic “Click here” phrases—use clear and informative link text.
  • Shorten links with accessible URL shorteners that allow for descriptive slugs.

Review all links to ensure they describe the destination.

Make emojis and special characters readable

  • Use emojis sparingly, as screen readers will read them aloud.
  • Place emojis at the end of a sentence, not in the middle of text.
  • Avoid excessive use of special characters and symbols.

Use a screen reader to test how emojis and special characters are announced.

Ensure posts are keyboard navigable

  • Interactive elements (polls, buttons, forms) should be accessible via Tab and Enter keys.
  • Avoid interactive graphics that require hover actions without alternatives.

Try navigating the post using only a keyboard.

Provide high-contrast images and graphics

  • Text in images should have at least 4.5:1 contrast against the background.
  • Avoid light text on a bright background.

Use a contrast checker to verify readability.

Limit animated and flashing content

  • Avoid rapid flashing content to prevent triggering seizures.
  • Provide an option to pause or stop animations if applicable.

Play the animation and ensure it complies with WCAG flashing thresholds.

Additional resources

PDFs are a common format for sharing documents, but they can pose challenges for accessibility. This guide helps you decide when to use PDFs, when to avoid them, and how to make them more accessible when necessary.


The Pros and Cons of PDFs

Pros

  • Universal format: PDFs maintain consistent formatting across devices and operating systems.
  • Security features: PDFs can restrict editing or protect sensitive information.
  • Print-ready: Ideal for documents that need to be printed exactly as designed (e.g., brochures, flyers).

Cons

  • Accessibility challenges: PDFs often lack proper structure for screen readers (e.g., missing tags, reading order issues).
  • Difficult to edit: Fixing accessibility issues requires specialized software like Adobe Acrobat Pro.
  • Not mobile-friendly: PDFs can be hard to navigate on small screens, unlike responsive web pages.

When to Use PDFs

  • Essential formatting: Use PDFs when document formatting is critical (e.g., forms, official letters).
  • Archived documents: PDFs are acceptable for archived content if they are properly tagged for accessibility.
  • Print distribution: Use PDFs for materials primarily intended to be printed.

When to Avoid PDFs

  • Simple text content: Use a webpage or accessible Word document for straightforward content (e.g., newsletters, updates).
  • Interactive content: Avoid PDFs for forms or applications unless you can ensure full interactivity and accessibility.
  • Frequent updates needed: Avoid PDFs for content that changes often; updating a webpage is more efficient and ensures users access the latest version.

Learn more

Designing Accessible PDFs

Definitions

  • Disability (video)
  • Accessibility
    • Accessibility and availability are different. During the pandemic, we often heard about students needing access to devices and internet connectivity. This is really about ensuring availability.
    • Accessibility is when a person with a disability can acquire the same information, engage in the same interactions, and enjoy the same services in an equally effective, equally integrated manner, with substantially equivalent ease of use as a person without a disability.
    • Accessibility is shaped by what we do, our interactions with the environment, and our personal preferences. Accessibility is essential for some, useful for all (video)
  • Universal design (video)
  • Assistive technologies are designed to address specific barriers persons with disabilities may face when they are completing a task . Examples of assistive technology include text-to-speech, screen readers and speech recognition.
  • Accessible technologies are designed to meet the needs of a lot of different users. The technology includes features that can be customized by the user to meet their individual needs.

Model accessible design

Use this template to create a slide that highlights how you are incorporating accessibility in your content design. This is a simple way to begin elevating the topic of accessibility, model accessible content design, and empower others to design with accessibility in mind.

Template: Designed with accessibility in mind: Presentation slide
(“Use Template” button will allow you to make a copy of this slide.)
Be sure to remove/add information to align with the accessibility strategies you used.

Designing content other than slides?  Copy/paste the slide text to other digital content types.

On This Page Jump Links
Off