Back to Section Home

Accessibility Basics

As instructors, we have legal and ethical obligations to ensure our courses are fully accessible to all learners, including those with disabilities. We use digital resources in our courses because we believe they enhance learning. However, unless carefully chosen with accessibility in mind, these resources can have the opposite effect for students with disabilities, erecting daunting barriers that make learning difficult or impossible.

Accessibility Overview (H2)

Multimedia (H3)

Videos must have accurate captions. Auto-generated captions (auto-captions) can have errors and are not sufficient. Captions help many students in various situations including students who:

  • are deaf or hard-of-hearing
  • are in environments that are particularly loud or where they cannot hear the audio
  • have learning disabilities or difficulty focusing
  • are learning particularly challenging topics or topics with a lot of vocabulary
  • are second-language learners

Audio files must have transcripts. In general, the goal is to have all audio information also visually perceivable and all visual information auditorily perceivable.

Images should have a caption and alternative text (alt text).  Alt text is a brief description (150 characters) that is read by a screen reader.  If the image is too complex to describe in 150 characters, use the alt text to define the image and include a more thorough description in the caption or body of the text. Images that are purely decorative (do not provide any relevant information) should be marked as decorative. 

Text (H3)

Color should be used sparingly and not the sole means of indicating meaning. Text and background should have sufficient color contrast.  These are essential for readability.  Other considerations for readability include avoiding decorative fonts and images of text. 

Hyperlink text must be meaningful.  This is a good link to the Accessibility Toolkit. Don’t use “click here” or the full URL of the link. 

Lists should be created using the feature built in to the content editor, rather than typing the numbers manually. Use numbered lists for sequential lists and bulleted lists for non-sequential lists. 

Styles and structures built into the content editor should be used to create page formatting.  Sighted people can scan a page for bold text, screen readers scan based on headings and styles. Headings should be sequential.  The headings in this section are identified (H1, H2, etc.) as a demonstration.  

Tables are for data not for formatting. It can be tempting to use a table as a way to create columns on a page - with images on one side and text on the other.  However, this causes accessibility issues with the content. Accessible formatting strategies depend on the platform being used.  For web pages, use CSS; for Word, use columns. Because tables are used to organize data, the will need a caption as well as row and column headings. These can be set in the "table properties" feature for most platforms.

WCAG 2.0 (H2)

The Web Content Accessibility Guidelines (WCAG) 2.0, developed by the World Wide Web Consortium, provide an international standard that defines accessibility of web-based resources. The principles of WCAG 2.0 are applicable to other digital assets as well, including software, video, and digital documents. The University of Washington has developed an IT Accessibility Checklist that can help anyone creating or choosing digital resources to understand the accessibility requirements related to the features and functions of those resources.

Wave Accessibility Checker

The Wave Tool by Webaim  checks accessibility of web pages. You can also download a free extension for Chrome and Firefox.  Learn more about how to use the WAVE tool on the Webaim site. Or, watch this video for an Introduction to WAVE  The WAVE tool can be used to check almost all online resources.

The image below shows a sample result from a Wave check.  Notes:

  • The blue circles indicate that headings are present.  
    • The orange box with the letter “h” is an alert that there is a skipped heading level; the headings skip from H2 to H4.
    • One of the headings is missing the heading icon.  This text looks like a heading but was made by changing the font rather than using styles.  Screen readers will not recognize that text as a heading.
  • The list is not identified with a blue list icon.  Therefore, it was not built correctly.
  • Red boxes indicate errors.  In this case, the marked text has very low contrast. 
  • Green indicates things that are done well. For example, alt text is present for the image.  However, the orange photo icon indicates an alert that this alt text may not be accurate.  In this case, the alt text is a file name rather than a meaningful description of the image.

Wave results explained in text

Microsoft and Adobe

Microsoft products (including Word and Ppt) have built in accessibility Checkers. Adobe Acrobat also has a built-in accessibility checker.  You can learn more about these in the Self-Paced Courses from @ONE .  These cheat-sheets from NCDAE  provide a good overview of how to build accessible content.

Accessibility Trainings

For more information about how to build accessible content in Canvas, see the TMI Accessibility page.

For more details about accessibility, take a look at these self-paced accessibility training. 

For facilitated training, sign up for Creating Accessible Course Content through @ONE.

This 5-Day Challenge can help guide you through basic accessibility fixes for your courses.

 

Additional Resources

Butte College | 3536 Butte Campus Drive, Oroville CA 95965 | General Information (530) 895-2511

Back to Top