Designing with web accessibility in mind will deliver inclusive access to information and functionality for all users. Learn how to do it and why it's important.
Web accessibility is the process of ensuring people with disabilities don’t experience any sort of barriers when it comes to interacting with or accessing websites on the internet. When websites are designed with web accessibility in mind, they are developed and edited to work for all users, regardless of ability, in order to ensure inclusive access to information and functionality. Although the term ‘web accessibility’ tends to focus on people with disabilities, it’s also beneficial for those experiencing temporary or situational limitations, such as an individual with a broken arm or an individual who has a slow internet connection.
Why is Web Accessibility Important?
The internet is a vital resource for all sorts of people of all ages. In fact, we depend on the internet in our day-to-day lives for everything from recreation to commerce to education to employment. The internet provides us with information and resources we might otherwise have a difficult time finding. For many with disabilities, the internet provides the ability to remain an active part of society.
Web accessibility is vital to ensure equal access for all users, including people with disabilities or temporary/situational limitations. Let’s consider an individual with a disability that makes it difficult to physically go to the store or shopping center. The internet enables them to still make purchases that would otherwise be difficult for them to make.
Aside from assisting persons with disabilities to live easier, more inclusive lives, web accessibility is important when it comes to legal liability. Organizations must keep in mind that various laws and policies require web accessibility. If you haven’t already, look into relevant laws and policies in your state and industry to ensure you’re complying as needed.
Principles of Web Accessibility
The World Wide Web Consortium created the Web Accessibility Initiative (WAI), which consist of the Web Content Accessibility Guidelines (WCAG). The Web Content Accessibility Guidelines should be followed to ensure web accessibility for people with disabilities. The first incarnation, the Web Content Accessibility Guidelines 1.0, was created in 1999. In 2008, the second incarnation, the Web Content Accessibility Guidelines 2.0, came out—offering 12 guidelines organized under four principles. In 2018, another version, 2.1, was published. It addresses 17 additional success criteria.
These four principles: robust, operable, understandable, and perceivable, will lead to more accessible web content. Each of the four principles is related to one or more guidelines. These guidelines and relevant success criteria help address these principles to ensure web accessibility is achieved.
1. Perceivable: All information and user interface components on any given website must be available in ways all individuals can perceive.
2. Operable: All navigation and user interface components on any given website must be operable for all individuals.
3. Robust: All content on any given website must be robust enough that user agents, including assistive technologies, can interpret it.
4. Understandable: All information and user interface operation must be clearly understandable for all users.
As mentioned, each of the four principles includes a list of guidelines to ensure that principle is accomplished. A list of guidelines can be found in the WCAG 2.0 and 2.1 table of contents here and here.
Assistive technology is defined as a piece of equipment or a type of product designed to improve or maintain the functional capabilities of people with disabilities. Assistive technologies can make a world of difference for those with disabilities—helping them lead comfortable, productive lives wherein they’re able to take part in various activities that would otherwise be difficult. There are various assistive technologies available:
- Tools, such as adapted pencil grips or automatic page turners, designed to improve the outcome of educational tasks.
- Cognitive aids, such as electrical assistive devices, created to help challenge memory skills.
- Mobility aids, such as wheelchairs or scooters, designed to help improve the individual’s ability to move.
In terms of web accessibility, assistive technologies can be used to help ensure the individual is able to leverage the internet and any web-related content. Some examples include:
- A mouth stick: A simple device that is placed in the mouth so the user can manipulate as needed for typing or using a mouse.
- A head wand: A simple device strapped to the user’s head, in order to enable them to type, navigate, and have control over web services.
- Oversized trackball mouse: A device that lets users move their cursor easily, despite any fine motor movement limitations.
- Adaptive keyboard: A popular technology featuring raised areas in between keys to help slide the finger into the correct key.
- Voice recognition software: Software that enables users to control web services with simple commands.
Assistive technologies are helpful for people with disabilities who have trouble clicking small areas, typing out sentences, and overall, completing tasks to leverage the web with success.
Color and Contrast
When it comes to web accessibility, colors with good contrast are essential to ensure those with low contrast sensitivity or colorblindness can distinguish between colors. In order to achieve colors with good contrast, colors must have sufficient contrast between text and background. This is technically referred to as “luminosity contrast radio” and must be considered for text on images, buttons, and icons.
If you’re using colors to convey information via maps, diagrams, and other types of images, you must also ensure colors with good contrast are used. This helps those with low contrast sensitivity or colorblindness, but it’s also vital to keep content viewable in different lighting conditions. Web content created with colors with good contrast will be easily viewed by all users.
There are various tools available to help select color combinations that work for all individuals, including people with disabilities. Ideally, web developers should use the tools available to them during the early design stage.
Writing for Accessibility
When it comes to writing content, accessibility should be considered. In fact, most recommendations that make website content more accessible to people with disabilities make website content simpler to read for all individuals. Some helpful tips for writing content to ensure accessibility include:
- Provide informative page titles that describe the content found on each individual page.
- Use headings and subheadings whenever possible to provide clear structure and meaning throughout the content.
- Write link text that directly and clearly describes the content found after clicking on the link.
- Offer meaningful text alternatives for all images, in order to provide information or context as needed.
- Create transcripts and/or captions for multimedia, such as podcasts or videos, to ensure optimal understanding.
- Provide clear instructions and/or guidance when it comes to error messages, forms, and other tasks.
- Use concise and clear content that includes short paragraphs, easy-to-understand words, and bullet points for greater readability.
Sound and Motion
Animated content that includes sound and motion can be distracting for individuals with or without disabilities. If content moves, blinks or scrolls automatically, it creates a barrier for individuals with visual disorders, as well as those with seizure disorders. In fact, visual content that flashes more than three times per second could trigger seizures. When creating web content and/or services, web developers should:
- Provide a mechanism that’s keyboard accessible for users to stop, pause or hide any animated content.
- Keep flashing visual content from flashing more than three times per second at all times.
- Offer the ability to restart content after pausing or stopping from the same point it was stopped.
Meeting Web Accessibility Guidelines
The Web Content Accessibility Guidelines 2.0, published in 2008, consist of 12 guidelines organized under four separate principles: understandable, robust, operable, and perceivable. For a complete list of guidelines, see the W3C website here. The WCAG 2.0 offers instructions for each guideline, as well as success criteria to ensure accessibility.
Who Needs to Comply?
The law states that private or non-profit organizations with 50+ employees, as well as public-sector organizations, must meet the accessibility requirements. January 1, 2014 was the deadline for new public websites, refreshed websites, and any web content posted after January 1, 2012 to meet the guidelines in a Level A manner.
January 1, 2021 is the deadline for new public websites, refreshed websites, and any web content posted after January 1, 2012 to meet the guidelines in a Level AA manner. By January 1, 2021, meeting the guidelines in a Level AA manner must be accomplished aside from criteria 1.2.4 (live captions) and 1.2.5 (pre-recorded audio descriptions).
The first incarnation, the Web Content Accessibility Guidelines 1.0, was released in 1999—creating a huge impact on the world of web accessibility. WCAG 2.0, released in 2008, introduced an important concept wherein there are three levels of conformance, including:
- Level A: Some segment of the population will find some or all of the web content to be completely inaccessible.
- Level AA: Some segment of the population will find some or all of the content to be difficult to use.
- Level AAA: The content is as accessible as reasonably possible with the current state of web content and/or technology.
At this time, meeting Level AAA is not expected or required. For an organization to claim compliance at any specific level, they must meet all of the requirements for that level and all levels below it.
In 2018, the most recent version of WCAG—2.1—was released. All requirements from 2.0 are included in 2.1; however, it contains an additional 17 success criteria that address mobile accessibility, individuals with learning and cognitive and disabilities, and people with low vision. Conforming to WCAG 2.1 standards when developing or updating website content is the recommended course of action.
The Rehabilitation Act of 1973, a federal anti-discrimination law, was the first legislative effort created to ensure people with disabilities were included and considered. The act focuses on individuals with physical and cognitive disabilities. In 1998, the act was amended to include Section 508—expanding on the law to encompass information pertaining to equal access in terms of electronic and information technology.
Section 508 states that the government must not procure any sort of electronic and information technology services and/or goods that don’t meet accessibility guidelines. Section 508 specifically mentions the internet—outlining that web design must be made accessible to all individuals with disabilities.
This means systems must be able to be used without relying on any single ability or sense. If they’re not able to be used, alternative forms of content must be provided to individuals with disabilities. Section 508 standards relating to web accessibility can be found online.
Testing for Accessibility
Accessibility testing is defined as a form of testing to ensure an application or website is usable for people with disabilities. There are various programs available to ensure you’re creating content that is accessible for all users. Click here to view a list of tools that allows you to filter and find the right tool for your unique needs.
When developing or redesigning a website or application, perform testing for accessibility early in the process. This will allow you to resolve issues immediately.
Why test for accessibility? Aside from the legal complications that come with not ensuring accessibility, you also want to make sure you’re catering to the entire population. Approximately 20% of the population has some type of disability. A surprising 1 in 2 people over 65 have reduced capabilities to some degree. If you’re not testing to ensure accessibility, you’re missing a large part of the market.
The first step to implementing accessibility is understanding disabilities and how they impact end users. If you’re a web developer looking to create or design a website or application, it’s important to understand the barriers people with disabilities face. Most of the basics in the WCAG 2.0 guidelines are easy to implement, but you might find yourself struggling if you don’t understand disabilities.
It helps to start with a content management system that supports accessibility. There are many options to choose from. Once you’ve selected a content management system, choose a theme or template that’s accessible. There should be documentation for the theme—outlining notes on accessibility for that particular layout.
When selecting plugins, widgets, and modules, keep accessibility in mind. Most elements, such as video players or editing toolbars, will support the creation of accessible content.
There are many benefits to ensuring an accessible website. First and foremost, you’re able to avoid legal liability. You’re also able to rest assured knowing you’re catering to the entire population—keeping you from missing out on a good portion of the market.
Learn More about Accessibility
We have created a comprehensive whitepaper on accessibility for developers that covers everything from laws to coding to testing.
Download the whitepaper: Accessibility for Developers
Adding Accessibility to Your Apps
One easy way to make sure that you are creating accessible web apps is to start with components from the Kendo UI libraries. Our components are all WCAG complaint and give you great functionality from grids and charts to schedulers and pickers. Get a head start on your app's UI and a head start on accessibility compliance at the same time.
Learn more about: Kendo UI