How to Build an Accessible Website
Create a user interface for all users.
Website accessibility is a concept many organizations take for granted. While many websites are built with the assumption that all users can see or hear the content being presented, some users may be left unable to read or listen.
Whether your business is in real estate, legal services, or finances, lacking website accessibility can lead to consequences more serious than just decreasing clicks and pageviews.
What’s at risk?
Since the 1990s, businesses and organizations have made a more conscious effort to make their physical properties compliant with the Americans with Disabilities Act (ADA).
But while organizations have made much-needed additions to their buildings, many have neglected to make their online presences ADA-compliant, which has led to some legal complications for many companies.
According to the Independent Insurance Agents & Brokers of America, 5,592 lawsuits were filed in the first half of 2019 for website accessibility issues. The average settlement for these cases cost businesses about $20,000. Similarly, maximum penalties for ADA violations can be as high as $75,000; subsequent violations carry a maximum fine of $150,000.
The price for non-compliance is steep, but if you put the time into making your website accessible for all users, you can avoid litigation.
Areas of accessibility
According to the University of California-Berkeley, organizations can make their websites more accessible in several key areas.
First and foremost, make sure your website is using a content management system (CMS) that not only allows for accessible features and widgets, but is accessible itself. WordPress and Drupal are two popular examples.
Next, focus on making your content more accessible. Use heading tags—<h1>, <h2>, etc.—to organize your content in a way that can be interpreted by screen readers, which allow blind or visually impaired users to read online text with a speech synthesizer or braille display.
Screen readers can also interpret text that’s been coded into images. This is known as alt text, and should accurately describe the appearance and function of images on your page. If your image includes any copy, such as an infographic or a graph, use that copy as your alt text. On a similar note, make sure any videos on your website include closed captioning.
When inserting hyperlinks in your copy, make sure you only hyperlink text that is descriptive enough to give users and screen readers a good idea of what you’re linking to. In other words, don’t just write “click here” and use that as your hyperlink.
Finally, make sure dynamic content is accessible. If your website uses lightboxes or modals, make sure users can exit them via keyboard controls. For videos, never use autoplay and ensure videos can be controlled with keyboards.
After you’ve made your content accessible, turn your attention to your website’s layout. Be mindful of your website’s color scheme as it may make content hard to read for users who are colorblind.
If your website uses any forms, be sure properly label every field so they can be interpreted correctly by screen readers. Finally, avoid using tables for layout purposes as they can distract screen readers and users—only use tables for data entry.
Avoid any potential penalties or litigation by creating a user interface for all users.
What are some ways you’re worked to make your website more accessible? Let us know in the comments!