This guide can and should be used to design all public-facing media that is officially affiliated with KCAD. Legally, it is required for "places of public accommodation". This certainly includes enterprises that receive government funding (such as KCAD). Compliance will be required starting January of 2018. Law suits so far have seen some courts, in some states, extending the definition of "public accommodation" (mandated by Title II of the ADA) to privately held enterprise's digital media and other states not. As more court cases are waged and settled, qualitative understanding of what constitutes a "place of public accommodation" will be improved.

Please keep in mind that meeting these accessibility requirements will improve the user experience for "able" people as well, especially in the Functional and Support areas outlined in section 508. That is the philosophy behind UNIVERSAL DESIGN.


One way to think of the relationship between Accessible and Universal Design is to create one-size-fits-all media using "progressive enhancement":

    1. Create the content in a visual narrative form that can be navigated and understood as text alone (semantic design). When that text is either read or heard by the user/audience, they should have an experience that is complete, both emotionally and narratively.
    2. Enhance the experience with graphics, illustration, motion and sound design. This enhancement will engage more parts of the brain for those that can receive it through their available senses and physical abilities (both permanent and situational)
      • "Permanent" could mean being sight or hearing impaired, for example.
      • "Situational" could mean external forces such as being in a quiet room without headphones while watching a video.


Video Writing Example 1 (2 versions needed - one with audio description and one without):

    • Narrator says: Sometimes I wonder what my dog is thinking
    • Image shows: Person on their knees looking directly into a dog's eyes from 6 " away

Video Writing Example 2 (1 version needed - because the narrator describes the visual action):

    • Narrator says: Sometimes I stare directly into my dog's eyes, wondering what she is thinking
    • Image shows: Person on their knees looking directly into a dog's eyes from 6 " away


This guide covers WCAG 2.0 - Level AA + Section 508 accessibility conformance that we can implement using the capabilities that we have. This level is generally considered the minimum requirement for media that is used by government funded organizations and public facing media (including education).


Requires federal departments, agencies and public schools to ensure accessibility of their “electronic and information technology” to individuals with disabilities unless to do so would result in an undue burden, in which case multiple modes of access can be employed (see below). Aids, benefits, and services must be “equally effective”—i.e., they must provide students with disabilities “an equal opportunity to obtain the same result, gain the same benefit, or reach the same level of achievement."


Prohibits discrimination on the basis of disability in all public entities, including public schools, regardless of whether they receive federal funding. Schools are required to take appropriate steps to ensure that communications with individuals with disabilities are as effective as communications with others. The term “communications” refers to the transfer of information, including the verbal presentation of a lecture, printed text of a book, and resources of the Internet. In evaluating the meaning of “as effective as,” OCR has focused on three components of effectiveness:

  • Timeliness of delivery,
  • Accuracy of translation, and
  • Provision in a manner and medium appropriate to the significance of the message and the abilities of the individual.


Prohibits discrimination on the basis of disability in places of public accommodation. This can mean non-governmental and non-public-educational places and media must meet WCAG 2.0 level AA requirements.


UDL On Campus-Legal is a very good guide for understanding the Legal requirements for accessibility. Though the site focuses on higher education, K-12 has the same requirements. Below is a basic summary for our:

  • Instructional materials we create and/or use at KCAD
  • Instructional materials that we create for public educational use.


Federal departments, agencies and public schools are effected by a 2015 update to 508. This requires requires compliance to WCAG 2.0 level AA (Web Content Accessibility Guideline) plus some additional requirements under 508 by January 2018. Websites, Multimedia mobile apps and desktop multimedia will all need to comply or multiple modes of access will need to be offered. The three main components are:

  1. Technical – these requirements make sure the coding of a website, software, operating systems, etc. is compatible with assistive technologies.
  2. Functional – these requirements ensure that in addition to the technical coding, the entire system is usable by someone with a disability.
  3. Support – these requirements make sure that support documents and alternative information is also accessible by people with disabilities.


Requires television programming that is repurposed for online delivery to have captioning. Audio description for television has slightly different requirements that phase in between 2010 and 2020. Currently, the top 60 TV markets are required to describe 50 hours per calendar quarter. The next phase-in is in July of 2018. And the goal is for there to be 100% audio description on television by 2020.


At this time compliance is a judgement call and is being tested in the courts. As more court cases are waged and settled, qualitative understanding of compliance will be increased. This understanding while be compiled and published as guidelines by organizations like WCAG, UDL on Campus and 3PlayMedia

Current plan for D.A.D. program



    • Collaborate with universal design consultant Jean Hanks for continuous improvement in the area of Universal Design curriculum integration.
    • Incrementally add universal design compliance to all on-line course media created by faculty by January 2018. The easiest way to do this is to use the New Google sites which has compliance built in.
    • Incrementally add universal design requirements to all course media created by students for assignments.




  • The content and any forms must be compatible with screen readers
  • The content should be rendered on a 3g connection in 6 seconds or less when tested on
  • If a plugin is required to view the content, a link to plugin download should be provided
  • Non-animated alternative should be provided for integrated animations that deliver content (such as Flash or html 5). Decorative animation does not apply.
  • Use alphabetical ordering organizing directories of information


  • The content should displayed in a left to right, top to bottom hierarchy.
  • Navigation should be consistent.
  • Pages should be navigable using keyboard arrow and tab keys
  • No automatic pop-ups or focus changes triggered by scrolling are allowed
  • The media should be responsive to a variety of screen sizes.
  • There should be ample space between navigation elements that allow for ease of use on a small phone
  • Avoid parallax effects and animation triggered by scrolling


  • Links should always be underlined
  • Links to the same location with different names should not be on the same page.
  • Link names and/or text accompanying links should be descriptive (tell user where they are going before they click the link)
  • A "skip Menu" invisible or visible button should be included if the menu has more than 4 buttons.
  • Pages should have titles (tagged as such)
  • Do not differentiate categories of information using color.
  • A site map page should be included for sites with more than 4 pages
  • Users should be warned of time limits that are essential or longer than 20 hours. Audio and visual warnings (20 seconds in advance) should tell the user when time limits are at hand. Ideally, time limits should be extendable.
  • Tables should have header rows or columns.
  • Symantec Web Design: When all CSS styling of the page is removed, the elements on the page should still be in a logical reading order in the HTML code. Here's how you can test:
      • Use Firefox Developer Edition (Click View > Page Style > No Style in the top menu)
      • Use the WAVE checker (click the "no styles" tab)
      • Check manually that the elements on the page are in a logical reading order.


  • Should be very high contrast against its background (light on dark or dark on light).
  • Should be sized for easy reading.
  • Avoid using image based text. If you do use image based text, the text in the image must be included, in full, in the image alt tag.
  • Should be able to enlarge using devise controls.
  • Ordered and unordered lists work well for creating an organized experience with screen readers
  • Tables should be used only if necessary to present data in a correlated matrix. They add a lot of extraneous audio for a screen reader.
  • Avoid redundant text: especially between title and header tags
  • Hierarchical, use of text tags. For example:
    • Title, Heading, Sub-heading, Normal
    • H1, H2, H3, H4, Normal


  • Descriptive alt tags should be included for all images. They need to succinctly describe the image.
    • An example of a bad tag: figure 2
    • An example of a good tag: cartoon of a drowning fish
  • If an image contains complex information that is critical to understanding the content, a "long description" tag should be used. Wordpress has this capability built into it.
  • Icons should always include text with them.
  • Image captions (when used) should always be located directly below the image and work in tandem with (but not be redundant to) the image alt tag to describe the content and meaning of the image.
  • Do not use images that can cause seizures (no more than 3 blinks per second... or between 2 and 25 hz).


  • Link text should make sense out of context and it should be obvious where the link will take a user.
  • Don't use 'Click Here' or 'More Information' for your link text. Instead, make the text more descriptive.
  • A good example: Visit our on-line knowledge resource: The Digital Learning Center.
  • A bad example: Click here to visit our on-line knowledge resource: The Digital Learning Center.


  • This standard includes images for all uses, including:
    • Interactive
    • Animation
    • Game
    • Print
    • Book
  • Images should be high contrast for the sight impaired.
  • Images should be understandable for the color blind.
  • Images can be tested as gray scale, and 2 types of red-green color- blindness: Protaniopa and Deuteraniopa.
  • Images including text should also include one or both of these:
    • Text in adjacent media that a screen reader can use
    • Audio description


  • Closed Captions: Video should have manually written closed captions (for the hearing impaired). These should include all dialogue and sound effects that are relevant to the narrative or help to characterize an action (such as: laughing sarcastically vs. laughing knowingly vs. laughing to themselves, etc.). Speakers should be identified by name when it is important to to the narrative. Here are instructions for adding closed captions in YouTube: 5 min. How To Video.
  • Audio Descriptions: Video should have audio description accompanying video (for the sight impaired) ... defined as narration added to the soundtrack to describe important visual detail that cannot be understood from the main soundtrack alone. The four cornerstones of audio description are “what, where, who and how”. If there is not time between dialogue to fit all of that in... choose the description that most benefits the story-understanding. Examples:
  • Audio and video can be paused and stopped. Audio/video should not autoplay.
  • Do not create video that can cause seizures (no more than 3 blinks per second).
  • Audio only media should have an audio text transcription... includes a written description (of everything that happens visually and the dialogue/voice over).


Below is narration written for a short animation. The visual narrative component is in italics. When writing like this, A separate version with audio descriptions is not needed.

Scene 1

I'm a local citizen walking in a parade, shaking hands and saying to anyone who will listen; "Vote for me and I'll work hard to provide a great education for our kids"

Scene 2

Woot! I got elected and here I am sitting at the end of a really long table in my first school board meeting.

Scene 3

It's pretty tense. People in the audience are shouting at each other over a disagreement.

Scene 4

But, I am looking cool and collected, using my superhuman capacity to remain calm so I can make an informed decision about the future our local schools....

Scene 5

... Because the kids with their hands raised in this classroom are counting on me!


The concept of multiple modes of access involves creating multiple means for engagement that can be accessed by persons with multiple means of sensory abilities. It is a judgement call as to how different modes can provide a qualitatively equal experience. Comparing a VR app to a website or an instructional video to a text document or an interactive game to one on one tutoring is like comparing apples to oranges. What we must do is apply our best creative and production processes within the capabilities of each medium in which we are producing.

Universal Design advocate Jean Hanks likes to use the Harry Potter franchise as an example. When fans are asked which they prefer; the books or the films, the most typical response is that they are different but qualitatively equal experiences.


Information Regarding 3Play Media


The first step is to transcribe your video, which often takes five to six times real time. And remember that you need to include things like relevant sound effects, and speaker identification, and any other non-speech elements. And once you have your transcript, you can upload it along with your video on YouTube and click Set Timings. And this actually allows you to create a time-coded caption file without having to do any of the time coding yourself, which can be a huge pain. There is also a lot of room for sync errors, if you are setting timings manually.

You can also start with YouTube's automatic captions, which are not accurate enough for compliance by any means, or for really being able to understand whats going on in the video, but they do allow you to edit the audio captions in the interface itself. So you could also start with the YouTube automatic captions and edit them there.

And then, once you have a timed caption file from YouTube, if you need a different format for another video platform, you can use a caption format converter. There are several out there. We have a free caption format converter on our website at 3Play Media. But that allows you to create a caption format that might be otherwise very difficult to create by scratch, because not all of them are that simple to read or that understandable to the average viewer.

When you are creating captions from scratch, it's important to follow best practices for caption quality. There are some standards out there, although there are no real legal guidelines, except for the FCC's caption quality standards. But there are many standards out there. The DCMP Caption Key is a great resource.

But some standards that we feel are really important--

  • Spelling should be at least 99% accurate.
  • And you should include grammar, for readability.
  • Speaker identification should be consistent. So you don't want to use Speaker One in some places, and the name ofthe speaker in another place.
  • You want to include relevant sound effects.
  • You should use punctuation to improve readability.
  • You want to make sure that you have one to three lines per caption frame, with no more than 32 characters per line.
  • It's best to use a non-serif font format.
  • The sync should be perfect, so it should be time coded exactly.
  • No caption should be less than one second in duration.
  • The placement of the caption frame should not obscure other important visual information onscreen.
  • And you should note things like silence or music playing.
  • And those frames can drop off the screen after a few seconds.

And then, there are two different options-- there's verbatim transcription and clean read transcription. So if you're transcribing something that was scripted, you want to make sure you're using verbatim transcription, because every um or other insertion was scripted purposefully, and you want to make sure you capture all of those.

Clean read is something you would use-- for example, this presentation, I have noticed that I've said "um" several times. And it's easier for someone to read a transcript or a caption file that doesn't take into account all of those word insertions.

SRT is a very common web-based format for creating captions. It's used for YouTube and other players, like Wistia.


We very much encourage people to include description in the video production stage. It's by far the least expensive way to create description. And also, it can be tied in with the production in a way that weaves it through the actual content, the audio of that video, while still potentially being something that could be turned on and off.

And another way to describe video that isn't being produced, isn't new production, really, there are multiple steps there. And that requires somebody to sit down and go through and write a script of description of the most important parts of the video that need to be described, and then to align that into the timeline. It then needs tobe edited to make sure that it will fit within available pauses, quietareas of that video. And then, a voice artist needs to voice it. Andit's then mixed with the original audio of that video.

A third way that we have seen people creating description isactually to create a separate version of the video where they'veadded extra time to that description. In some cases, there isn'tenough time available to describe the key important features, andit's necessary to actually create a separate cut of the video whichextends those pauses, or provides some additional time to put inthat description.

What's good enough for description? And at this point, there are no specific standards included in WCAG, coming from the FCC, or within CVAA regulation.



  • The Jaws Screen Reader is the only one that will work with Blackboard because both are JAVA based.
  • JAWS costs around $,1000 per user.
  • JAWS was the most used screen reader but, due to competition with better, less expensive (or free software), it has dramatically decreased in popularity