Agencies
Services
Accessibility & Inclusive Design
Building an Inclusive Experience
It is important that your web sites are accessible, so that people with a diverse range of hearing, movement, sight, and cognitive abilities can interact with your content.
The Illinois Information Technology Accessibility Act (IITAA) requires Illinois agencies and universities to ensure that thier web sites, information systems, and information technologies are accessible to people with disabilities. While the Americans with Disabilities Act and Section 504 of the Rehabilitation Act already require the State to ensure accessibility, the IITAA establishes specific standards and encourages the State to address accessibility proactively.
The Design Framework is built around these requirements, however when creating your web site it is imperative that you follow general author considerations that will make your experience even more inclusive. Your web site will not pass IITAA guidelines if your content is not accessible. Below is a set of design principles based on guidance from the World Wide Web Consortium. Following these design principles will help you adheres to the IITAA requirements, and create web sites that are easy for everyone to use, navigate and enjoy.
Principle 1: Perceivable & Actionable
Information should be presented in ways that are easily perceived and understood.
Text Alternatives
For any non-text information such as images, buttons, or iconography, provide a text alternative. Include transcript options for any video or audio content. Comprehensive text captions should be added to all interactive elements, as well as images.
Distinguishable Content
Provide enough contrast for foreground and background elements such as buttons, images, and text. This will help users to read and scan through content and data more easily. Include imagery to provide visual appeal and utilize blank space to further aid in legibility.
Avoid relying strictly on color by including other design treatments to help ensure that color-blind users understand visual cues. Apply formal elements such as strokes (with enough thickness), visual indicators, patterns, texture, universal iconography, and/or text to describe actions, instructions, and content.
Principle 2: Operable & Responsive
The website should be easy to navigate, regardless of device being used.
Navigation
Provide users with more than one way to navigate through content. Be consistent in navigation in language and design for easy identification by users.
Meaningful Page Hierarchy
Visual hierarchy can be used to provide emphasis to specific areas of the page based on the proportion and scale of a component. Placement or strategic positioning of a design element will help to convey its importance. For instance, a hero image could communicate an important announcement.
It’s also important that headings are used properly. Meaningful page structure will make your pages easier to understand visually for sighted-users and verbally for screen readers. Proper use of headings let screen readers jump around to parts of the page.
Principle 3: Understandable & Readable
Content should be easy to read and understand by as many people as possible.
Language & Readability
Provide simple-to-read text by keeping it brief and descriptive. The same applies to providing succinct labels on form designs, calls-to-action (CTAs), hyperlinks, and buttons. Use clear headings and relevant information hierarchy to convey related content groupings.
Predictable
In order to help users understand which information is most important, we can use visual aids or textual cues. These can include color, text, iconography, shape, or motion. We should maintain consistency in these visual cues so that users remember upon return to the site. This will also help users to navigate to other state agency sites within the ecosystem that will leverage the same component library. This will provide visitors with a sense of muscle memory to perform tasks more accurately while avoiding potential frustration.
Principle 4: Robust & Flexible
Content should be must be robust enough that it can be interpreted by assistive technologies.
Compatible
All interactive elements and functionality should be accessible from a keyboard, such as tabbing to navigate to navigation links, form elements, CTAs, buttons, etc.
