Archive for November 7th, 2007

The Web offers independence and freedom and provides so many new opportunities to learners. However, these independence, freedom and opportunities will be become reality for all learners unless all educational Web sites are created with Web accessibility in mind. As educators, we need to make our educational Web sites accessible for all of our students. Furthermore, we need to commit to accessibility and provide for accountability, training, and technical assistance to ensure the Web’s full potential for all people.

The World Wide Web Consortium (W3C) established the Web Access Initiative (WAI) to promote and achieve Web functionality for people with disabilities. In 1999, the WAI published the Web Content Accessibility Guidelines 1.0 (WCAG) which consists of fourteen guidelines, each with three checkpoint levels for Web developers to meet.

In addition to a set of fourteen guidelines for assisting Web developers to create accessible Web sites, WAI published a list of ten quick tips to accessible design (W3C, 2003).

  • Images and animations. Use the ALT attribute to describe the function of each visual. ALT text can be used to provide the information about the image. Also, ALT text can be read by a screen reader that tells the visually impaired user about the image.
  • Image Maps. Use client-side map and text for hotspots. Always include a text alternative to the image map since some browsers do not support image maps.
  • Multimedia. Provide captioning, transcripts of audio, and descriptions of video to the users. Deaf users will need video to be captioned and other audio be transcribed.
  • Hypertext links. Use text that makes sense when read out of context. It is important to provide enough descriptive text within the link itself to adequately describe the link destination. Non-descriptive hyperlinks such as “click here” do not help users find information. The blind user will lack adequate understanding of the link if it does not convey needed information. Also, choose colors for the links and text carefully. Colorblind users will have difficulty reading the links and text.
  • Page organization. Use headings, lists, and consistent structure. Use CSS (cascading style sheets) for layout and style where possible. When site text is formatted with CSS, users can override styles to format text to meet their needs. This allows users with limited vision or colorblindness to change color or the size of text. Also, build the same look and feel for navigation wherever possible.
  • Graphs and charts. Summarize or use the longdesc attribute. A long description can be used for graphs and charts requiring ALT text longer than 50 characters. Graphs can be confusing to many disabled users. A text summary can be helpful.
  • Scripts, applets, and plug-ins. Provide alternative content in case active features are inaccessible or unsupported. Older browsers have problems with some scripts, applets, and plug-ins. It is important to provide the information in an alternative format presented by the script or applet.
  • Frames. Use the noframes element and label with the title or name attribute. Some screen readers have difficulty distinguishing between frames. A user with a screen reader may lack the context to understand the frame’s function, and a title or name can clarify that.
  • Tables. Make column by column reading sensible. Summarize data presented in table form and use caption tags to help present the information. Avoid using tables for column layout. Most screen readers can only read text left to right across each row on the screen, and tables can be very confusing.
  • Check your work. Validate the HTML. Use evaluation tools and text-only browsers to verify accessibility and ease of use.

Also, the following tips would be helpful for getting started in designing accessible Web pages. They are based on the WAI guidelines and the Section 508 standards for Web content (Comden & Burgstahler, 2002; Waring, 2004):

General Page Design

  • Maintain a simple, consistent page layout throughout your Web site.
  • Keep the page background simple. Make sure the page has enough contrast.
  • Use standard HTML.
  • Make links descriptive so that they are understood out of context.
  • Use frames sparingly and consider alternatives.
  • Include a note about accessibility on your Web site to notify visitors your concerns about the accessibility and your efforts for compliance.
  • Create a Web page that has a flexible design so the users can customize the page to meet their needs.
  • A Web page degrades gracefully if it can still be used without JavaScript, frames, and multimedia.


  • Design logical, usable, and consistent navigation menus.
  • Use consistent headings and titles throughout the site.
  • Name icons and files appropriately by using simple and direct language.


  • Use high contrasting colors.
  • Color should not be the only means of conveying important information. Consider other alternatives.
  • Allow users to adapt color with the browser preferences.
  • Visit the Vischeck [www.vischeck.com] to check what a color blind person would see on a Web page.


  • Fonts should be easy to read. Use sans serif fonts such as Arial, Helvetica, Comic Sans, and Tahoma.
  • Avoid <BLINK>…</BLINK> and <FONT> tags.
  • Clear definable letter shapes; clear spacing between letter combinations.
  • Use a minimum of text size 12pt or 14pt.
  • Avoid underlining except for hyperlinks.
  • Use bold for emphasis.


  • Use short simple sentences and avoid long sentences of explanation.
  • Give clear instructions.
  • Use concise paragraphs with clear topic headings.
  • Use bullet points or numbering for lists.
  • Use graphics to explain complex text.
  • Consider short pages to reduce the need to scroll.


  • Include appropriate ALT/LONGDESC attributes for graphical elements on your page.
  • Use a NULL value for unimportant graphics.
  • Include descriptive captions or other options for making graphical features accessible.
  • Provide captioning and transcripts for audio and video clips.
  • Provide alternatives for content in applets and plug-ins.
  • Provide meaningful alternatives for learners who cannot access certain media formats.


  • Provide alternatives for forms and databases. Some combinations of browsers and screen readers encounter errors with non-standard or complex forms.
  • Always test forms and databases with a text-based browser.


  • Provide several alternative formats of the same documents.
  • Include notes that describe how to handle downloadable files.
  • Provide an accessible alternative or a d-link to describe the content of a Flash file since Flash is accessible to only a few screen readers.
  • Make Acrobat PDF files and PowerPoint files accessible.
  • Convert PDF files to accessible HTML or Word RTF file. Tagged Acrobat 5.0, 6.0 and 7.0 PDF files are accessible with screen readers whereas Acrobat 4.0 or earlier PDF files are not.
  • Create a text outline version of PowerPoint by saving the presentation as Outline/RTF.
  • Make Microsoft Word and PowerPoint files accessible.
  • Use Accessible Web Publishing Wizard for Microsoft Office [cita.disability.uiuc.edu/software/office/] to convert Microsoft Office documents to accessible HTML formats.
  • Create a text outline version of PowerPoint by saving the presentation as Outline/RTF.

Read Full Post »

%d bloggers like this: