NDOT Web Accessibility Standards

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision
• Deaf or hard of hearing

Elements

• Buttons
• Check Boxes
• Pictures/Images
• Embedded or Streaming audio or video
• Input Elements
• Object Elements
• Applet Elements
• Frameset elements
• IFrames
• Anchors
• Area Elements

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision
• Deaf or hard of hearing

Alternatives for multimedia content
A video presentation with an audio component requires captioning. The captioning must be completely synchronized with the audio presentation to allow for the viewer to follow the meaning of the content.

If there is only an audio component there is no need for captioning. However, a text equivalent (Full Transcript) "must" be made available.

A time-based presentation can include any form of multimedia, such as a movie, animation or slide show. Equivalent alternatives to these types of presentations are captions (which provide access to audio tracks) and audio descriptions (which provide access to visual tracks).

A text transcript alone is not the ideal method for providing an equitable experience for persons with disabilities. It is widely accepted that on-screen captioning allows deaf and hard-of-hearing people to more fully appreciate the experience of a movie or multimedia production. An almost-equivalent accommodation for people with sight and hearing is the provision of subtitles during foreign-language films or performances. A separate textual transcript that must be read after the fact does not provide an equivalent experience.

Thus the requirement to synchronize the equivalent alternatives. The caption track is an alternative for deaf or hearing-impaired viewers. The audio-description track is an alternative for people who are blind or visually impaired. Synchronizing these alternatives with the main presentation (that is, the video and/or audio) means that nearly all users will get the best experience and the most information available to them. (Bear in mind that for people who do not have access to multimedia-playback devices, or for people who are deaf-blind, a transcript of both the audio and the audio descriptions is still the best alternative.)

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision
• Color blind

Dealing with Color
The use of color does not prevent a page from meeting the accessibility requirements. It is important that designers understand that they can use color and be incompliance with accessibility standards. This paragraph deals with the use of color alone in indicating action or meaning.

Do not display emphasis of a word by color alone. For example, do not create a form that requires users to fill out form field values that are "marked in red." Use HTML Markup like <Strong> or <EM>.

Do not use color alone in an image to indicate an action. Example: Do not say: "Press the red button to cancel your form or the green button to complete your form." Color can definitely be used to augment the design of form but use alternative text and/or text on the image to signify cancel and submit.

It is easy to test your page for compliance to this paragraph.

Printer: Print your web page on a black and white printer. View the output to assure that all text and images are still visible, and that the emphasis requried is still visible.

Screen: View your page on a black and white monitor or set your monitor to black and white view and view the screen to assure that color was not the only way that information has been presented.

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision
• Color blind

Dealing with Style Sheets
Style Sheets are intended to separate presentation from content. They provide an easy and efficient way to format HTML documents. Style Sheets enhance the effectiveness of HTML as well as simplify the process of maintaining a Web site.

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision
• Color blind
• Inability to use mouse
• Motor-Control Challenges

Dealing with Image Maps
An image map is a single image that is used to offer multiple links to content in a Web site. When a user selects a link on an image map, it takes them to the link connected with the referenced part of the image.

There are two type of Image Maps, client and server side. The main difference between the two is where the actual processing of a visitor's action taken on the map is translated.

The rule for redundant text links of a server-side image map is necessary because the actual link is processed on the server so it is not available to users of assistive technology because of their inability to see the map. By presenting the user with a list of links, the map is made accessible.

The rule for preference of client-side image maps is necessary because it allows the use of assistive technology to easily activate regions of the image map. (Related: Rule 1 above)

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision

Dealing with Tables
Tables can be used for design/layout or as a means to present data. Tables that are used to present data should be structured so that those users who cannot view the data with its visual reference points can easily navigate them. The structure of these tables implies meaning to the information within them, based on the organization of the table. Therefore, a screen reader should be able to utilize this table structure.

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision

Dealing with Frames
A Framed Site uses combinations of HTML documents, displayed together in the browser to visually divide the computer screen into separate and distinct areas that can be separately redrawn depending on user action. Frames present difficulties for users with disabilities when those frames are not identifiable to assistive technology. Users of assistive technology will find it difficult to navigate frames if the differences between the frames in the framset are not clearly defined.

To facilitate easy navigation with frames use the "title" attribute available to the frame element and preferably supply a "no frames" link.

Techniques and examples

Disabilities Addressed:

• Photosensitive epilepsy

Dealing with Flicker
The developer should prevent the screen from:

• Flashing
• Flickering
• Blinking
• Or having staggered movement from a control like the marquee or a news bot

If the screen behaves in one of the manners listed above, it could trigger a seizure in an individual with the aforementioned disability.

Techniques and examples

Disabilities Addressed:

• Potentially all disabilities referred to in the standards

Dealing with Text-only Pages
This rule provides a fail-safe measure for pages or content that cannot be made accessible. This is commonly referred to as a "Full Text" version of a web site or page. This alternative should truly be avoided. The cost of maintaining this solution and the likelihood of incomplete content is too high. The task to make a web site or web site content accessible is generally not out of the reach of any organization.

The W3C rule notes that:

"Content developers should only resort to alternative pages when other solutions fail because alternative pages are generally updated less often than "primary" pages. An out-of-date page may be as frustrating as one that is inaccessible since, in both cases, the information presented on the original page is unavailable.... Before resorting to an alternative page, reconsider the design of the original page; making it accessible is likely to improve it for all users.

Techniques and examples

Disabilities Addressed:

• Potentially all disabilities referred to in the standards

Dealing with Scripts
Content developers must ensure that pages are accessible with scripts turned off or in browsers that don't support scripts.

Remember that all script functions should include a NOSCRIPT tag for those browsers or assistive technologies that do not have script support.

• Avoid creating content on the fly locally (client-side). If a user's browser does not handle scripts, no content will be generated or displayed. However, this is different than displaying or hiding already existing content by using a combination of style sheets and scripting; if there is no script, then the content is always shown. This also does not rule out generating pages on the fly on the server-side and delivering them to the client.
• Avoid creating links that use "javascript" as the URL. If a user is not using scripts, then they won't be able to link since the browser can't create the link content. For example, do NOT do this:
  
  <a href="javascript:">...</a>
  because this is a dead-end link for a user agent where scripts are not supported or not loaded.

All JavaScript URLs should have meaningful text so as to be useful for people with disabilities. Developers should avoid event handlers as the only method for navigating or completing a page.

Problematic Handlers:

• onClick
• onDblClick
• onMouseDown
• onMouseUp
• onMouseOver
• onMouseOut
• onChange

Techniques and examples

Disabilities Addressed:

• Potentially all disabilities referred to in the standards

Dealing with Applet or plug-in
Web pages that provide content such as Real Audio or PDF (Adobe Acrobat's Portable Document Format) files must also provide a link to a plug-in that will meet the software provisions.

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision

Dealing with Forms
Currently, the interaction between form controls and screen readers can be unpredictable, depending upon the design of the page containing these controls. HTML forms pose accessibility problems when web developers separate a form element from its associated label or title. For instance, if an input box is intended for receiving a user's last name, the web developer must be careful that the words "last name" (or some similar text) appear near that input box or are somehow associated with it. Although this may seem like an obvious requirement, it is extremely easy to violate because the visual proximity of a form element and its title offers no guarantee that a screen reader will associate the two or that this association will be obvious to a user of assistive technology.

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision

Dealing with Navigational Links
This provision provides a method to facilitate the easy tracking of page content that provides users of assistive technology the option to skip repetitive navigation links. Web developers routinely place a host of routine navigational links at a standard location – often across the top, bottom, or side of a page. If a nondisabled user returns to a web page and knows that he or she wants to view the contents of that particular page instead of selecting a navigation link to go to another page, he or she may simply look past the links and begin reading wherever the desired text is located. For those who use screen readers or other types of assistive technologies, however, it can be a tedious and time-consuming chore to wait for the assistive technology to work through and announce each of the standard navigational links before getting to the intended location.

Techniques and examples

Disabilities Addressed:

• Blind
• Weak vision
• Motor-challenged

Dealing with Timed Responses
Web pages can be designed with scripts so that the web page disappears or "expires" if a response is not received within a specified amount of time. Sometimes, this technique is used for security reasons or to reduce the demands on the computer serving the web pages. Someone's disability can have a direct impact on the speed with which he or she can read, move around, or fill in a web form. For instance, someone with extremely low vision may be a slower-than-average reader. A page may "time out" before he is able to finish reading it. Many forms, when they "time out" automatically, also delete whatever data has been entered. The result is that someone with a disability who is slow to enter data cannot complete the form. For this reason, when a timed response is required, the user shall be alerted via a prompt and given sufficient time to indicate whether additional time is needed.

Techniques and examples

Disabilities Addressed:

• Weak vision

For example, in CSS, use 'em' or percentage lengths or relative constants such as 'small' or x-large' rather than 'pt' or 'cm', which are absolute units. This allows the user to modify the size of the text if it is too small (or too large) to read.