Site design

Key steps to designing accessible websites

Plan a new site or redesign using best practices

Plan your site before you begin. Use best practices in Web design to make your website 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 websites (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 website is “HTML that is well-formed and uses elements with semantic value.” The IBM website 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.

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 websites accessible unless those sites are substantially modified. However, legacy Web pages must include contact information to insure legacy website 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 website 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 the 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 information accessible, contact the Web Accessibility Committee for assistance.

In addition, the UIC Identity Standards require websites to provide easy-to-find contact information for the unit. This contact information should include a general information phone number, a general information email 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.

Use an Accessible Template as a Guide towards IITAA Compliance

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

Comments are closed.

Switch to our mobile site