Using the AIS Toolbar



Introduction

CSUN is required by the Americans with Disabilities Act and Section 508 of the Rehabilitation Act to make all instructionally-related material on the web accessible to persons with disabilities who use “adaptive technologies” (e.g. screen readers) to browse the internet. The College of Humanities currently supports the use of the AIS Toolbar for checking web accessibility. However, the AIS Toolbar is not intuitive and its authors have not made available a simple set of instructions. The instructions below are intended to make the use of the Toolbar easier.

For information on the legal requirements for accessibility, see the Appendix at the end of this document.


Before You Begin

The AIS Toolbar works only in Internet Explorer and Opera. You need to test your web pages using the AIS Toolbar in Internet Explorer or Opera, but thereafter you may return to your preferred browser.


Downloading the AIS Toolbar

  1. Launch Internet Explorer or Opera and go to College of Humanities ADA page: http://www.csun.edu/~hmnsys/cgi-bin/ada/.
  2. Click on the Download link under “The AIS Toolbar.” Alternatively, you may download the toolbar directly by clicking this link: http://www.csun.edu/~hmnsys/sw/AIS1-2.exe. If you wish to download the version for Opera, go to http://www.paciellogroup.com/resources/wat-about.html.
  3. Follow the instructions for installation.

On the College of Humanities ADA page you will see the following links to online instructions:

You may find these guides helpful, but I have provided more explicit and useful instructions below.


Turning the AIS Toolbar On and Off

  1. Right-click on the Internet Explorer menu next to the word Help.
  2. A menu will pop up, and you should see Accessibility Toolbar as an option. If you do not, try quitting and re-launching Internet Explorer.
  3. Select Accessibility Toolbar, and the AIS Toolbar should appear.
  4. If you wish to turn the toolbar off, repeat the process and de-select Accessibility Toolbar.

Using the AIS Toolbar

The AIS Toolbar contains a tremendous number of tools for checking your pages. Although it attempts to automate the process, it cannot indicate with 100% certainty whether your web page is ADA compliant. Some degree of personal analysis is required. The following are recommended steps for ensuring that your web pages avoid the most obvious forms of non-compliance.


Validate Your HTML

In the past, web browsers were forgiving of minor variations in the way HTML code was written. For instance, a paragraph beginning with the code "<p>" (paragraph) would display the same regardless of whether or not there was a corresponding "</p"> (end paragraph) at the end. However, over time standards for writing good HTML have evolved, and these standards have been formalised by the World Wide Web Consortium (W3C). Assistive technologies such as screen readers for the blind and partially sighted tend to assume that your web pages will be written according to these standards. Web pages authored before the development of the W3C standards and pages authored by some software (Microsoft Word, for instance) write bad HTML, which cannot be read by assistive technologies. Using the Validate tool ensures that your web pages follow the W3C guidelines for good HTML. To validate the HTML of your web pages, follow the steps below:

  1. In Internet explorer, load your web page.
  2. Click on the Validate menu in the AIS Toolbar.
  3. In the pop-up menu, select W3C HTML Validator, and then Validate HTML. You may also choose to select one of the options that performs the validation in a new window. If you use frames, select the Validate Framed Pages option.
  4. The AIS Toolbar will now validate the HTML in your page. It may take a few seconds for the results to appear. The analysis is very full, so you may have to examine them closely. At the top you will see the Result of the analysis, whether you Passed validation or Failed validation (with the number of errors).
  5. Scroll down to see the errors and warnings, alongside suggestions for fixing them.

Note that not all errors are really errors. The Validator may misinterpret material in your coding, especially in links. If it finds an error in the address of a link, check that the link works before you fix it. If the link works, leave it as it is.

How you fix your HTML will depend on how you produce your web pages. You may need to edit the code directly. If you select Validate > W3C HTML Tidy > Check / Repair HTML, you will receive a new version of your file with suggested changes. But make sure it works before you use it to replace your old file.


Resize Your Screen

Information on your web page may not be readable if it cannot be seen on the screen. Although you may be able to see everything on your screen, others with different sized screens may not be able to see all the information. To check what is visible at different screen sizes, follow the steps below:

  1. In Internet explorer, load your web page.
  2. Click on Resize in the AIS Toolbar.
  3. In the pop-up menu, select all of the different screen sizes and see what happens to your information.

If information is not available when you change the size of the screen, you may wish to change the layout of your web page.


Disable CSS

Cascading Style Sheets (CSS) are the preferred method for giving your web pages visual style. They are much more powerful than the simple formatting features of HTML. However, many assistive technologies can’t read them, so it is important to see what your web page looks like without CSS styling. If you don’t use CSS, disabling it will not change the appearance of your web page. To check whether your web page is readable without CSS, follow the steps below:

  1. In Internet explorer, load your web page.
  2. Click on CSS in the AIS Toolbar.
  3. In the pop-up menu, select Disable CSS. Select Disable CSS again, if you wish to re-enable CSS.

If your web page is still readable when CSS is disabled, you do not a problem. If information is lost or unclear, you may wish to re-design your use of styles so that information is conveyed independently of formatting.


Make Your Images Accessible

If you have content conveyed through graphic images (including images of text), it is important that disabled users have access to the information in those graphics. For fully blind users, it is necessary to label images with ALT tags or captions. ALT tags tell the browser to pop up a description of the image when the cursor passes over it (you may have noticed this). Assistive technologies look for ALT tags to describe graphic content. To check for missing ALT tags, follow the steps below:

  1. In Internet explorer, load your web page.
  2. Click on Images in the AIS Toolbar.
  3. In the pop-up menu, select Toggle Image / Alt. This will replace your images with their ALT tags. Select Toggle Image / Alt again to restore your images.

If the Toggle Image / Alt command replaces your images with empty sets of quotation marks, you do not have ALT tags, and you should consider using them to add captions. Web page authoring software like Dreamweaver normally has a place to add the ALT tag when you add an image. If you are editing the HTML directly, the code for your image will be something like:

<img src “imagename.gif”>

It should read:

<img src “imagename.gif” alt=”Short Description of Image”>

For partially-sighted or some epileptic users, it may be necessary to eliminate blinking, flickering, or scrolling effects. To determine if there are any problem areas on your web page, select the GIF Flicker Test option under Images. Scroll down and read the analysis.


Colour Issues

While you can use colour to make your web page look good, you should not use it to convey information. To check for colour-related problems, follow the steps below:

  1. In Internet explorer, load your web page.
  2. Click on Colour in the AIS Toolbar.
  3. Try out Greyscale and Contrast Analyser to look for any problems. Vischeck colour blindness simulation would be useful, but it is currently not fully functional. You can find a working simulation if you click on Tools > Simulations > Colour Blindness.

Automated Accessibility Checks

There are numerous web-based services which attempt to automate the above processes (and more). They should be used with a critical eye, as they often suggestions which are not necessary to satisfy the current legal requirements or which misinterpret the content. Remember, this is like asking a computer to grade an essay. However, their feedback can be useful. The most useful service you can reach from the AIS Toolbar is The Wave. To check your web pages using this service, follow the steps below:

  1. In Internet explorer, load your web page.
  2. Click on Tools > The Wave > Check Accessibility Issues in the AIS Toolbar.
  3. You will receive a version of your web page with each element rendered as an icon. At the top of the page, you will see the number of Accessibility Errors, Alerts, and Features, along with instructions for using this information. In order to make use of it, you need to click Explanation of icons(opens in new window) near the top of the page. Click on the icon (or scroll down to it) for explanation of the issue and suggested corrections. The current legal requirements are for compliance with both WCAG Priority 1 and Section 508 Guidelines, which are listed in the right column.
  4. In the original rendered version of your web page, click on the Text View tab, and follow the instructions to make sure your page is readable in a text only format.

A similar service is available from WebXact/Bobby, the links to it from the AIS Toolbar don’t work, but you can still use the service if you go to http://webxact.watchfire.com/ and enter the address of your web page (though it probably won’t work for WebCT pages because of the password protection).


Where To From Here?

Many non-compliance issues can be avoided by planning your web page content with accessibility in mind. This means remembering to supply ALT tags, avoiding using style and colour formatting to convey content, and similar considerations. One recommendation is to supply a “Text Only” version of your web pages. This can be automated with LIFT Text Transcoder (which the University owns). Adding the following code to your web pages will place a “Text Only” link:

<a href="https://webtext.csun.edu/referrer" title="text-only page produced automatically by LIFT Text Transcoder">Text Only</a>

Clicking on the link will create a text-only version of your web page, which can be manipulated in various ways to increase accessibility (scroll to the bottom of the page for options). If no content or meaning is lost when you see your web page in this form, your web page is most probably ADA compliant.


Return to Top


Appendix: Legal Requirements

CSUN is required by the Americans with Disabilities Act and Section 508 of the Rehabilitation Act to make all instructionally-related material on the web accessible to persons with disabilities who use “adaptive technologies” (e.g. screen readers) to browse the internet. Both the University and individuals can be legally liable for violations of these laws. This means that individual instructors bear individual legal liability for ADA non-compliance on their instructionally-related web pages.

The accessibility requirement is enshrined in CSUN’s Web Access Accessibility Policy (http://www-admn.csun.edu/vp/policies/900_oversight/900_08.htm). Here are the highlights.

University Web materials authored by University Faculty and Staff in support of the university mission must be accessible by all, including persons with disabilities.

Accessibility: Any person using any kind of standard Web browsing technology must be able to visit any site and get a full and complete understanding of the information contained there, as well as have the full and complete ability to interact with the site.

Procedures: Web developers must create new Web materials and make revisions to existing Web materials in compliance with the World Wide Web Consortium's "Priority One Checkpoints for Web Content Accessibility Guidelines" and validate accessibility via industry standard tools and by conducting manual checks such as evaluating the material using a screen reader or a text browser, carefully considering the sounds used on the site, and accessing the material without using a mouse; i.e., by using tab and direction keys.

The W3C Priority One Checkpoints can be found at

http://www.w3.org/TR/WAI-WEBCONTENT/full-checklist.html.


Return to Top


Author: Scott Kleinman, Department of English, California State University Northridge
First Published: 11 December, 2006.
Last Update: 19 April, 2007.