Accessible by Design

Person with a ponytail studying at a desk in front of a mural in the student union.

What do we mean by "accessible?"

In online instructional design we talk about student access in two overarching ways. First, can students get to our instructional materials? And second, can they use them?  

When referring to "accessible technology" or "accessible design," though, we need to be more specific. We mean, "Can all users, including users with disabilities, use our instructional materials in a way that is of most benefit to them?"

Benefits of accessible technology

  • Centering equity on our campus requires that all students can access and utilize our content
  • Universal design principles tell us that accessibility efforts support all student learning - even students who may have more typical abilities
  • Accessible content is more compatible with mobile devices, improving access to students using a broad range of technology to access class 

Accessibility and our contract

Creating accessible content is more than our ethical responsibility. Beginning 2022, creating and using accessible content in alignment with federal accessibility requirements is articulated in the HCEA faculty contract (304 Accessible Instruction). In short, we're required to meet standards in document formatting (including our syllabi), accurate video captioning, electronic content, and instructional software, including online textbooks. 

Guidelines for accessible content

You can use these guidelines anywhere you create material: Canvas, any Microsoft Office product, email messages, Google Drive, web pages, and so on. In all things, review your content for clarity and consistency. We all want students to understand what we want from them and unfortunately, the nature of online learning can put up some extra barriers. Here's some tips: 

  • Be explicit. Tell students exactly what you want them to do. What do you want them to give you? Tell them this over and over and over...and over. Give instructions every time. This relieves all students of the stress of having to remember what you want from them.
  • Simplify your language. Define jargon, idioms, and acronyms. Avoid terms with multiple meanings.
  • Keep it simple and clean. Big blocks of text are hard for folks who have trouble reading. Only use images that add to the understanding of the content. Minimize brightly-colored text.

Electronic content - documents, Canvas pages, videos, textbooks, software, etc - must meet federal accessibility requirements by the third quarter (after Summer Quarter 2022) in which they are used, unless a student Letter of Accommodation requires earlier completion. 

 

75% of screen reader users reported hat they 'always' or 'often' use headings to navigate web pages. Headings help all students - even those without screen readers - to better understand the main points of each section and to 'chunk' material preventing cognitive overload. One good example of this is the HC inclusive syllabus template Links to an external site.. In this document you can see an example of how to use headers - and you can base your own syllabus on it!

Use paragraph styles to format headings

Always use the built in formatting tools, as opposed to manually bolding, underlining, etc. Headers need the HTML tags for screen readers to detect them. 

Image of Canvas toolbar. The dropdown box "Paragraph" is circled in red, showing choices of Headings.

 

Use bulleted lists

Image of toolbar in Canvas with bullet icon circled, showing different bulleting styles.

Create descriptive hyperlinks

Screen readers can generate a list of the links on a page so a user can go directly to what they need (instead of listening to the entire page), but this will only work when the text of the link is descriptive. For example, you might find a hyperlink on a site that says, "Read More". This is a problem. It provides no context to aid understanding of the link's resource. It can also be more problematic when many links say "Read More". In this case the screen reader will generate the "links list" with a long list of "Read Mores".

Shows cursor highlighting a short phrase and changing it to a hyperlink using the Canvas toolbar

Rules to follow:

  • Identify the purpose/function of the hyperlink as part of the link name.
  • Be descriptive but succinct. Screen reader users will have to listen to the full link text before moving to the next.
  • Integrate the link into your sentence. 

Ensure adequate color contrast

The difference in color between the background and the text/image (foreground) is called "color contrast".  All students suffer when color contrast is not high; but especially students with low-vision or students who have some form of color blindness. Color, like images, can add visual appeal to your course pages but it has to be perceivable and not interfere with learning.  Learn more about using color to add to your content.

Resources:

Scanned documents

Scans are basically pictures of a page and as such are not readable by a screen reader. Adobe Acrobat Pro can create accessible .pdfs, check existing .pdfs, and creates a report with resources to fix problems.   Resource: Creating accessible PDFs Screen readers can't interpret an image for a blind user, so you have to provide a description of the image called an "alt-text". It's also useful if the image is having trouble loading or if the image breaks. Images that display important content information need alt-text that conveys the information accurately.

Resources: