Accessibility

These web and social media accessibility guidelines help to ensure that all audiences receive MCC messages.

Web Accessibility Guidelines

The Web Content Accessibility Guidelines (WCAG) define requirements for designers and developers to improve accessibility for people with disabilities. It defines three levels of conformance: Level A, Level AA, and Level AAA. Web Content Accessibility Guidelines (WCAG) 2.1, Level AA

Structure

Well-structured content allows the user to follow your page and navigate it with ease. Headings are the best way to tell a user what the main sections are and where they are, and to help them find what they need more quickly.

Color

To conform to WCAG Level AA standards, ensure body text has a contrast ratio of at least 4.5:1 against its background. Large text (18 pt/24 px or larger, or 14 pt bold or larger) and essential graphical elements/UI components require a ratio of at least 3:1.

Links

  1. Use meaningful text for links instead of URLs - explain where the user is going. Do not use the word "link" or "click here" as part of the link text.
  2. Do not use tooltips/screen tips to add additional information.
  3. Avoid forcing links to open in a new window or tab. If opening a link in a new window is necessary, notify the user within the link text (e.g., 'National Science Foundation (opens in a new window)').

Tables

Tables should be used when displaying data, and data cells must be associated with their headers. Keep the tables simple, use a caption, and headers.

Images

Informative Images must have text alternatives that describe the information or function represented by them. See Alt Text Guidelines

Decorative Images: Images that do not convey content are decorative, and already conveyed in text should be null (empty)  (alt=""), ARIA role="presentation", or implemented as CSS backgrounds.

Assistive Rich Internet Applications (ARIA)

ARIA improves the accessibility of web pages and applications by providing extra information to screen readers via HTML attributes. ARIA Roles, States, and Properties

Write for Accessibility

Avoid abbreviations, acronyms, and initialisms

Web Accessibility Tools

Web Accessibility Checklist

View the WCAG 2 Checklist for recommendations on implementing key accessibility principles and techniques to achieve WCAG conformance.

Social Media Accessibility Guidelines

At least 15% of the world’s population has some form of disability. Your goal is to make your social media communication the best user experience for as many people as possible using inclusive design principles.

Best practices include:

  1. Creating alternative text descriptions for images and animated GIFs across platforms (Facebook, Instagram, X) – the descriptions will be read aloud to non-sighted or low-vision users who rely on screen readers. Be sure to include any text that is a part of your image. Most social platforms, including Instagram, allow you to add 'alt text' under their advanced or accessibility settings during the publishing workflow.
  2. Captioning video content that contains speaking (Facebook, YouTube, Instagram Stories) – captioning benefits deaf users and the many users playing videos in silent mode. If you use automatically generated captioning, you must review it carefully to make sure it’s accurate and includes punctuation!
  3. Use CamelCase for multi-word hashtags – it’s easier for users to read and it helps screen readers. Ex. #blacklivesmatter sounds like “black live smatter” vs. #BlackLivesMatter Do not use ALL CAPITAL LETTERS.
  4. Using emojis sparingly – imagine hearing “red heart” ten times in a row!
  5. Put hashtags and mentions at the end
  6. Use a descriptive call to action – avoid writing “click here”
  7. Use an adequate font size – make sure the text used in images is legible and it contrasts with the background color. Check your color contrast

For more information, refer to this Social Media Accessibility Toolkit

Back to Top ⇑