Web Accessibility and Universal Design at UIC
Home >How to design accessible Web sites

Menu

 

Committee Information


Campus Resources

How to design accessible Web sites

 

Key steps

 

Plan a new site or redesign using best practices

Plan your site before you begin. Use best practices in Web design to make your Web site functionally accessible. Use Cascading Style Sheets, create proper headings, label graphics, and structure the site and its content logically from the beginning of the development stage.

Consult the following resources as you plan and design your site:

Consult the following resources as you plan and design your site:

 

The ACCC Instructional Technology Lab provides training and support for developing accessible Web sites (itl@uic.edu).

 

Use Cascading Style Sheets (CSS)

Using CSS is an important part of making a site functionally accessible. Style sheets maintain consistency and allow users to make adjustments to the site to make it easier to read and navigate. The ACCC Instructional Technology Lab (ITL) and the Web Accessibility Committee sponsor training on Cascading Style Sheets. The ITL also provides ongoing support for those needing information on CSS. An online resource for those wanting to learn CSS is available through Western Illinois University.

Use Structured HTML

A simple definition according to IBM's Web site is "HTML that is well-formed and uses elements with semantic value." The IBM Web site outlined some checks to ensure that you are creating structured HTML including:

  • Using heading elements (<h1> through <h6>) to denote a hierarchy of headings.
  • Putting lists of things, especially menus, inside proper list forms.
  • Ensuring that all of the text is inside an appropriate HTML element, such as a paragraph.
  • Creating true data tables by adding the semantic elements that define structure, such as summaries and table heads.
  • Removing every piece of presentational markup from your HTML code. Note: <strong> and <em> are the correct semantic elements that replace <bold> and <italic>.
  • Placing all the presentation details in external CSS files.

Illinois Center for Information Technology Accessibility (iCITA) has a summary of HTML elements that help stucture a site. Here is the summary from their site:

Use to provide a unique title for each Web resource in a Web site

Headers are used to indicate major/minor topics in a Web resource

Use to indicate navigation bars when used in conjunction with the title attribute

Use to indicate ordered and unordered lists of items (you can use the CSS list-style property to change the formatting of bullets and numbering)

Use to indicate lists of related items that have multiple descriptors, like the multiple definitions of a word in a dictionary or the time, location, and date of a meeting

Use to provide an association between controls and their text labels

Use to provide a label that describes the relationship between form controls in a group

Use to provide a title to a tabular data table

Use to associate header cells (th) with a data cell (td)

Use markup to indicate changes in language so speech technologies can automatically change pronunciation to the specified language.

Legacy Pages

Legacy Web pages (sites published before August 20, 2008) are not required to be retrofitted. The Illinois Information Technology Accessibility Act (IITAA) does not require UIC to make previously existing Web sites accessible unless those sites are substantially modified. However, legacy Web pages must include contact information to insure legacy Web site information will be made available in a format accessible to persons with disabilities.

Upon specific request, information on legacy Web pages is to be made available to any individual needing access to such Web content, by revision or by providing an alternate format that is accessible to the person making the request. The unit responsible for the creation of the information on the Web is responsible for providing that access. Each Web site must include contact information for the person designated in that unit to handle requests for access. The contact information should be placed on the entire site, or at minimum on all popular access pages to the site.

Use the following statement (may be placed at the bottom of the page):

"Having problems accessing this site? Contact Webmaster."

Include the email address of the person assigned to handle accessibility concerns within your department. If at all possible, accessibility concerns should be addressed within 24 hours of receipt of the request. If you require assistance in making your Web information accessible, contact the Web Accessibility Committee for assistance.

In addition, the UIC Identity Standards require Web sites to provide easy-to-find contact information for the unit. This contact information should include a general information phone number, a general information e-mail address and the unit’s postal address. The best way to handle this is with a Contact Us link on every page. While a list of department faculty or staff can also be very helpful, make it clear whom a user should contact for general information.

Non-HTML content should also be made accessible

Other formats used on the Web, such as PDFs, Flash, Javascript, Microsoft Word, PowerPoint, or other multimedia content must also be made accessible in compliance with the Illinois Information Technology Accessibility Act (IITAA). For more information go to the UIC Accessibility Guide for Non HTML Formats.

Use Accessible Template as a Guide towards IITAA Compliance

An Accessible UIC Template has been developed. You can download the full packaged version (.zip) of this template.


Having problems accessing this site? Contact Webmaster
© 2008 Board of Trustees University of Illinois