Accessibility: Some Key Elements for Blended and Online Teachers

There are many elements to consider for an individual seeking to teach or design an online or blended course. This section describes three of the most important techniques for course accessibility. Proper headings, alternative text for images, and captioning videos are three major elements that can help to create a more accessible course. Additionally, this section provides information on a browser extension that may help teachers or other educators evaluate web resources.

Headings

Headings are one of the primary means for navigating a web page or document in a screen reader (for low-vision students). All commonly used screen readers allow a user to pull up a list of headings and move between headings via simple keystrokes.

The main page content should be introduced with an H1 heading, and subordinate content sections should get H2, H3, and so on. The order of headings should always proceed by single increments: H1, H2, H3, H4, etc. Do not skip heading levels. Again, following a logical order helps both screen reader users who can surf a page by heading and heading level and also provides an unambiguous structure for users with cognitive disabilities.

In Microsoft Word, you can format heading styles under the Styles menu.

Headings in MS Word

In Google Docs, you can also format headings under the Styles menu - next to the font options.

Headings in Google Docs

Tips:

  • Use the H1 heading as the main heading of your page. It should reference the content of the page.
  • Use H2 for major sub-sections.
  • Use H3 for sub-sub-sections and so on.
  • Nest headings hierarchically. Do not skip heading levels.
  • Heading text should be unique and meaningful.

In Practice:

Think of a course syllabus you have designed and consider the following:

  • Are there proper headings?
  • Is the BodyText properly labeled as Plain Text, Normal, or Paragraph?
  • Are the section headings meaningful?

Here is an example, Creating an Accessible Syllabus from California State Fullerton.

Colorful frames

Alternative Text for Images or Non-text Elements

In Practice:

Images are an important part of instructional content. Screen reader programs can identify the presence of an image but they cannot tell the student anything about the image unless extra content is provided. Therefore, all images must have an "alt" attribute.

If the "alt" attribute in an image tag is left out, screen readers and other user agents that read web pages aloud will typically read the "src" (source) attribute of the image, which is normally just a path to the image. This superfluous information will be confusing to students.

Avoid uninformative link phrases

It is very important to link meaningful text to web URLs. For example, which makes more sense?

https://www.youtube.com/watch?v=LZy_WviXw2w or Section 508 Awareness Video

https://hshmc.learning.powerschool.com or HSHMC LMS Log In

Links are more useful when they make sense out of context. Authors should avoid non-informative link phrases such as:

  • click here
  • here
  • more
  • read more
  • link to [some link destination]
  • info

In fact, the phrase "click here" is unnecessary, even if it precedes a more meaningful phrase. For example, a link that says "click here to access today's weather" can be shortened to "today's weather." In some cases it may make sense to precede a link phrase with "more" or "read more about," (e.g. "more about global warming"), but if these extra words can be avoided, it is probably best to avoid them (e.g. "global warming" may convey the same meaning as "more about global warming," depending on the context).1

html code
Guy with camera

Video Content

Audio and video materials can be some of the most compelling instructional materials. This type of content allows students to read, listen, watch, and study course materials at a pace and time that accommodates personal schedules and preferred learning modes.

While audio and video materials may benefit the learning experience for all students, including those with disabilities, a lot of these materials are inaccessible. Accessibility considerations need to be well integrated into the design and implementation of audio and video content in order to be effective for students with disabilities. Moreover, the extra effort to make materials accessible, not only satisfies the necessary educational mission of universal usability, but the educational experience of students who have no identified disabilities is enriched and improved.

In Practice:

All video must have time-synchronized captioning that is either enabled by default or easily turned on. It should have good background-foreground contrast and be properly "chunked" for easy reading. The video below provides an overview of captioning in YouTube.* Note, you can view this video directly in YouTube by clicking on the YouTube symbol in the lower right section of the video.

This video will walk you through the process of adding captions and subtitles to a YouTube video. Note: You Tube is ever-improving their process, so video may be somewhat different from current process. However, overall the steps you follow will be the same or similar.


"YouTube Captions and Subtitles - YouTube." 22 Sep. 2008, https://www.youtube.com/watch?v=QRS8MkLhQmM. Accessed 24 May. 2017.

Transcript

E. Classroom Accessibility Tools

Accessibility tools are rapidly becoming available for classroom use. Here are a few that you may find helpful and easy to implement:

Texthelp.com Text to speech, annotation tool. This is an add on for Google Docs. Read&Write. Free with limitations, paid features. Read&Write literacy software makes the web and documents more accessible for children, students and employees with dyslexia and reading difficulties.

EquateIO Speech to text for math equations. This is an add on for Google Docs, you can speak or draw your equation and it converts it to text on the document. Free with limitations (not many), paid features.

VoiceTyping in Google Docs. Click Tools Voice typing. A microphone box appears.

ChromeVox ChromeVox is a free screen reader that brings the speed, simplicity, and security of Chromebooks to visually-impaired users. ChromeVox comes pre-installed on Chromebooks so there’s nothing you have to do besides turn it on.

F. Evaluating Resources

The education market moves quickly and evaluating new Web 2.0 tools and resources can be a challenging task. The W3C Web Accessibility Initiative provides a great variety of resources including a W3C Cheat Sheet that provides a quick guide to accessibility. If you want to check the color contrast of text on your page, the WebAIM Color Contrast Checker is really easy to use.

Also, the Firefox Browser has an Accessibility Extension that can be installed to check web resources for accessibility.

G. Quick Quiz

We have covered many topics in this module and some of the concepts may have been new. Please complete the quiz below to check for understanding.

1"WebAIM: Links and Hypertext - Link Text and Appearance." 1 Oct. 2013, http://webaim.org/techniques/hypertext/link_text. Accessed 3 May. 2017.