Making accessibility visible: a checklist
Following our video series Make accessibility visible, we’ve created an accessibility checklist for content creators, web designers, and developers. Use the checklist to incorporate accessibility best practices into your website design.
Earlier this year, we released the Make accessibility visible series of videos to show what it’s like to browse the Internet with screen readers for blind people. We used examples of accessible and inaccessible websites to show the difference and share best practices along the way.
As a follow-up, we’re sharing an accessibility checklist that addresses the five web design and user experience issues highlighted in the series. Whether you’re new to digital accessibility or familiar with all things accessibility, we encourage you to watch the series and use the checklist to keep your website accessible to people of all skill levels.
A screen reader is a software application that uses text-to-speech technology to read digital content aloud for people who are blind or have low vision.
1. Form field buttons and labels
Buttons and form fields help screen reader users find information and interact with different items to purchase products, subscribe to newsletters and services, fill out forms, and perform other related tasks. line. Here are some best practices for adding form field buttons and labels.
We use titles to organize the content of a web page, following a logical structure. People who use screen readers and search engines rely on headlines to understand the structure of the page and navigate its content. Use the tips below to write useful headlines.
Write meaningful headlines that outline the content.
Resource: Website accessibility: headers, Yale University
Use the headings in hierarchical order to describe the structure of the document. Plan the title structure before creating the web page, to ensure correct order.
Resource: Website accessibility tutorials: titles, W3C
Avoid using titles for their sizing alone. Decorative headers are confusing to screen reader users, it’s a random emphasis.
3. Alternative text of the image
Image alt text, also known as alt text or alt tags, is a written description of an image that screen reading tools can read aloud to people with visual impairments, sensory processing disorders, or learning disabilities. Here are some alt text best practices to keep in mind.
Write alt text for all important images. Include language that evokes the purpose of the image conveyed in its context. Omit the words “graphic” or “link” as assistive technology will convey the context of the item.
Resource: Alternative text, WebAIM
Include null alt text (alt = “”) for images that are not important, are used for layout, or have no function. This ensures that they are hidden from assistive technologies.
Resource: Web accessibility tutorials: decorative images, W3C
If the alt text is a product description, include style, design, materials, features, benefits and care in detail. Colors should also be described whether they have unique or non-standard names.
Resource: Accessibility in e-commerce: use the text “ALT” to communicate the main content of the “informative” images, Baymard Institute
Avoid using image file names as alt text. It does not describe the image and does not help users understand it.
4. Functional elements
Without proper state labels and descriptions of functional elements, screen reader users can potentially miss out on key page features and messages, including status updates that notify users of the results of the page. their actions (modification of a delivery address, for example), progress on a process, errors, etc. Follow the recommendations below to add appropriate descriptions of functional elements.
Clearly define the expected responses of the web page or application to user actions for all controls. It helps developers understand what to build.
Resource: WAI-ARIA 1.1 Creative Practices, W3C
Use ARIA to transmit the status of a control to assistive technology (expanded, collapsed, selected, etc.).
Resource: Use ARIA for status messages, Orange Digital Accessibility
5. Keyboard focus and dialogue behavior
For a website to be accessible, it must be keyboard-only navigable – this is how people with screen readers use the internet. Most interactive elements, such as links or pop-ups, are usually indicated visually on a web page. With a screen reader, you can focus on these items by using the Tab key on a keyboard. Here are some best practices for making your website keyboard friendly.
Don’t know where to start? Check your site’s accessibility status with the AudioEye website scanner and use the checklist to start troubleshooting your site’s accessibility issues.
Ready to test the accessibility of your website?
Scan your site now.
AudioEye Inc. published this content on 22 December 2021 and is solely responsible for the information it contains. Distributed by Public, unedited and unmodified, on December 21, 2021 09:19:17 PM UTC.
Public now 2021
Trends in Technical Analysis AUDIOEYE, INC.
|Short term||Mid Road||Long term|
Evolution of the income statement
|Number of analysts||3|
|Last closing price||
|Average price target||
|Spread / Average target||127%|