Accessibility & the Ann Arbor CIL Website

Introduction is an accessible website with AAA conformance. A team of four University of Michigan students and an Ann Arbor CIL staff member completed this project in four months (Jan’10 to Apr’10). The design of the website was revamped and the new website was developed using CMS (WordPress). The aim was to come up with an easy to maintain, accessible and robust website for the organization.

As mentioned in WCAG 2.0, “Note that even content that conforms at the highest level (AAA) will not be accessible to individuals with all types, degrees, or combinations of disability, particularly in the cognitive language and learning areas.” This should always be kept in mind while assessing the success or failure of this project. Ideally, no single design could be considered as Universal Design, but the Universal Design is something that caters to the requirements of the majority of needs.

What Is Web Accessibility?

Web accessibility means that people with disabilities can use the Web. More specifically, Web accessibility means that people with disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web. Web accessibility also benefits others, including older people with changing abilities due to aging.

Web accessibility encompasses all disabilities that affect access to the Web, including visual, auditory, physical, speech, cognitive, and neurological disabilities. Web accessibility also benefits people without disabilities. For example, a key principle of Web accessibility is designing Web sites and software that are flexible to meet different user needs, preferences, and situations. This flexibility also benefits people without disabilities in certain situations, such as ease and enjoyment of use, people using a slow Internet connection, people with “temporary disabilities” such as a broken arm, and people with changing abilities due to aging.

What are W3C, WAI and WCAG?

The mission of W3C is “to lead the World Wide Web to its full potential by developing protocols and guidelines that ensure long-term growth for the Web.” Though W3C has its detractors, most agree that the W3C today enjoys the respect and support of a wide range of key industries, organizations and individuals. It provides specification and guidelines to make all the web resources accessible, consistent and of high quality. (More info at

The “Web Accessibility Initiative” (WAI) at W3C was launched in 1997. It is an extremely active area in W3C, due to huge public interest in accessibility, bolstered by accessibility legislation in effect in many developed countries. Also, efforts made by other W3C Working Groups to build a Web that ensures equal access for everyone frequently intersect with WAI priorities and objectives.

W3C released WCAG 1.0 in 1993 and it was continuously reviewed to foster the web experience for individuals with disabilities from time to time. At the end of 2008, WCAG 2.0 were released and as still automatic validators for 2.0 are not so common in the market, websites follow 1.0.

Website Compliance

Generally, websites might comply with any one of the criteria (CSS, Mark up Language, WCAG, or Section 508), but they doesn’t ascertain that the website is accessible. If we look at the big picture, then all these factors together make any web resource 100% accessible, user friendly and robust. Lacking in any one of them will hamper the efficiency of use for the website visitor.

Accessibility Features in the Website

The following features were implemented in this website that makes it different from other websites:

  1. All the non-text content of the website has a text alternative in the website. For example, images, which couldn’t be read by the text reader, have an alt text, which tell users what that image is all about. We made sure that all the images have alternate text.
  2. We have provided a link called, “Skip to Content” to bypass the header block, which is repetitive in all the pages. This will avoid repetition of the same block again and again for the user using text reader.Image of disability accessibility features on top right corner of website header
  3. The website allows users to resize the text of the whole website and choose between three available sizes. Due to implementation of resizing feature in all the recent browsers, this functionality is not used that frequently.
  4. Contrast adjuster was incorporated, which allows user to change the normal contrast of the website to high contrast color scheme.
  5. The minimum contrast ratio of 4.5:1 is followed between the main content and the background. For the headings and large text, contrast ratio of 3:1 was followed.
  6. We made sure that no differentiation was made in the website on color alone, as that would mean nothing for individuals who are blind or color-blind. So we used hierarchy in the website (using h1, h2 h3 etc) to show the difference in the priority.
  7. Presently we don’t have any audio-video in the website, but if any of that is included in future, then text script for them should be included along with the main files.
  8. All the features of the website could be accessed and used using Keyboard alone (for people with motor disabilities). Individuals are able to access any link directly by the use of ‘access keys.’ Information on all the access keys is presented at
  9. For the moving and auto-updating image banners at the top of each page, we have provided a feature to navigate across different images via a toolbar. This way the user can shift back to the image he or she wants to view.
  10. The time of image flash (image change) is more than 3 sec, thus it doesn’t interfere with the people who finds it difficult to focus when things are changing too much on a website.
  11. All the links in the website are colored differently than the main content so users can easily trace them. As different links are used for different buttons, users can make sense out of them even without context.
  12. The heading structure was strictly followed and headings were not used for the aesthetics part of the website.
  13. It was recommended to the web administrators and the content writer that the language should be kept simple and direct. It shouldn’t be confusing and ambiguous. If there is any word whose pronunciation might be ambiguous then both textual and audio representation of such words is encouraged.
  14. As our website might be accessed using a text reader, which differentiate languages by LANG tag, we set it to English as default, because right now all the content in the website is in English only.
  15. The website is totally accessible even without any style sheet and the flow of the content is matched correctly in both the navigations formats (visual navigation and the text reader navigation).
  16. The website is tableless and no frames were used in the backed.  Tables cause problems with screen readers.
  17. Style sheets were used to handle the design of the website. We relied upon CSS alone for the page structure.
  18. Website was successfully checked for cross-browser compatibility with most common browsers including IE6, IE7, IE8, Mozilla, Chrome, Safari etc.
  19. The website will work perfectly fine even if all the scripts are turned off and at slow Internet connection speed. JavaScripts are used for text resizing and contrast changer.
  20. Information Architecture of the website goes with the navigation and interaction design. All the popular or more frequently accessed links were placed higher on each page.

If you have any questions or comments about the accessibility of the Ann Arbor CIL website, please contact us.

For more detailed information on the Accessibility features that were implemented in this site, view Divye Bokdia’s Report.


  • By Divye Bokdia, Web Accessibility Consultant

    Image of Divye Bokdia

    Divye is presently pursuing a Masters in the School of Information at the University of Michigan, specializing in Human Computer Interaction (HCI) and Social Computing (SC). He did his undergrad in Usability and User Experience from IIT Guwahati, India. One of his research areas is Accessibility for web products, and presently he is working on the accessibility of small screens. To know more about Divye, his work experience, and his projects, visit

Extra Links

Back to Top