Online Accessibility: 5 Websites That Get It Right

About 61 million adults in the US — about 1 in 4 — have some type of disability, according to the Centers for Disease Control and Prevention (CDC).

Millions of these people have a disability that makes it more difficult for them to access information online. For some, including the 5.9 percent of US adults who have hearing-related disabilities and the 4.6 percent who have vision-related disabilities, accessing certain information online can be impossible.

But it doesn’t have to be impossible. Websites built with the Web Content Accessibility Guidelines (WCAG) in mind can help ensure that every visitor finds what they’re looking for.

Here are five websites doing online accessibility right.

BBC

The BBC website takes an image-heavy news-magazine approach to visual design, but not without embedding certain functions valuable to those with visual and hearing impairments.

For instance, subtitles are included in BBC News videos, with a Subtitles button prominent in the video playback box. Images include not only alt text but also a high-contrast, simple caption in white text on a black background.

When viewed through a screen reader, the BBC home page provides a convenient Skip to Content button within the heading immediately following the GDPR cookie notice. The site is also enabled for screen readers to search by headline. That way, users can hear the headline before deciding whether they want to read the rest of the story. Headings are wrapped in anchor tags, as well, making it easier for many screen readers to open the article.

The BBC could still improve things for a few screen readers, such as fixing alt text so that certain embedded objects — like those from Twitter — don’t cause the screen reader to read the URL, says Chris Ashton, a developer with the UK’s Government Digital Service. Overall, however, the site is easier than many news sources to navigate, even for those with visual or hearing difficulties.

Couchsurfing

Couchsurfing is a service that connects travelers with locals willing to host them during their visit. The site’s home page relies on a simple, relatively high-contrast combination of blue, white and black text and dividers. The sign-up form indicates what information should be placed in each box with plain text outside the box — a must for screen readers, which typically cannot parse text that sits within the box itself.

The home page is relatively uncluttered, too. It centers the signup and login fields. Below this box are links to additional information, including About, Safety, Support, Blog and Shop nav links in high-contrast, all-caps dark text on a white background.

The home page isn’t visually overwhelming; rather, it isolates the one task most visitors will want to do first (sign up or log in) while still making exploration of Couchsurfing’s offerings easy to find.

Once logged in, the user’s profile page maintains its easy navigability, sticking to high-contrast black text on a white background or blue buttons with white text. Navigation within the site is relatively simple, with plain-text available for screen readers and the site’s major sections marked with both text and large icons at the top right.

One particularly nice gesture Couchsurfing offers is to place the Settings icon in the same top left navigation bar, equal in size and shape to the other navigation icons. When clicked, the icon gives easy access to controls for account details, emails and push notifications, privacy settings, and social media connections. Not having to dig for account settings, privacy and security controls is a refreshing change from many social media sites.

eBay

eBay has been around for decades, and during that time the company has increasingly embraced the need for accessibility in its various properties, including its website and its Android and iOS apps.

According to the company’s accessibility information, eBay “strive[s] for WCAG 2.0 Level AA conformance on all eBay Products.” WCAG 2.0 Level AA is the guidelines’ mid-range compliance level, generally considered important to accessibility but not minimally essential. By aiming for Level AA, the eBay website embraces Level A (essential) compliance by default.

eBay achieves Level AAA compliance in certain areas, such as providing alt text for links and buttons that a screen reader or visually impaired user might otherwise be unable to parse.

In practice, the site uses high-contrast plain text for easier reading, “skip to content” options for screen readers and a keyboard-only navigation option. It also provides a guide to features and common problems experienced by screen reader users, including a list of keyboard shortcuts for faster naivation in some of the most popular screen readers.

Due to the nature of eBay’s business, however, user-generated photos are not always easy to parse visually. Many are low-contrast or have backgrounds in hues that make it difficult for those with certain neurological or visual processing difficulties to figure out exactly what is being displayed. Alt text provides some assistance here, as do clear plain-text captions and descriptions.

Wikipedia

Wikipedia’s accessibility is due in part to the site’s encyclopedia-esque visual design, which has remained relatively stable over the years: Black text on a white background is among the easiest to process visually, while the plain-text approach allows screen readers to follow along, as well.

It’s also due to Wikipedia’s commitment to improving accessibility through its Accessibility WikiProject. According to the Accessibility WikiProject page, the project’s goal is to make sure “people with disabilities can perceive, understand, navigate, and interact with Wikipedia, and that they can contribute to Wikipedia.”

Based on WCAG 2.0, the Accessibility WikiProject provides a clear set of do’s and don’ts for Wikipedia contributors. That list includes the use of alt text and captions for images; text descriptions of charts and diagrams; and sequentially nested section headings. All of these make the site more accessible to users with visual- and information-processing differences.

In a refreshing move for users of screen readers, the project also bans the use of unicode characters as icons or images. Unicode characters are typically read out by screen readers not as the character they appear to be visually, but as the mathematical symbols they are intended to represent.

The result can be not only inaccessible, but infuriating, as a January 2019 tweet from Kent C. Dodds demonstrates. For example, in the tweet, the word “think” rendered in unicode characters was read aloud by the screen reader as “mathematical sans serif italic small t, mathematical sans serif italic small h, mathematical sans serif italic small i, mathematical sans serif italic small n, mathematical sans serif italic small k.”

By requiring text to be presented as text, rather than as unicode, Wikipedia helps curb instances of infuriating and incomprehensible screen-reader stumbling.

Wired

Wired magazine, like Medium, HuffPo and similar sites, has embraced a high-contrast, black-on-white text presentation that makes it easy to scroll through articles. It beats Medium onto this list primarily because Wired’s use of alt text in images is more uniform and widespread. On Medium, alt text is left to the discretion of writers who upload images, which means it’s missing from a number of images.

Wired’s design-specific text in its navigation menu, category tags and dates isn’t the easiest to read visually, though screen readers can parse it just fine. The ability to navigate the same topic sections from a fly-in menu on the side that offers large, sans serif text, however, mitigates these difficulties somewhat.

Wired has room to improve, particularly in the video department. Finding the captioning option on Wired videos takes some work, and it doesn’t appear to be available for every video. Wired does, however, provide transcripts, and while these can be helpful, switching focus from the video to the transcript can also tire viewers quickly. Some transcripts were also presented in relatively low-context black text on a gray background, which can also be tiring to read for long periods.

The Future of Online Accessibility

The fact that even accessible websites have room to improve isn’t surprising. A WebAIM study of the top million websites found that 97.8 percent failed to meet WCAG 2.0’s most basic standards (Level A). On average, 7.6 percent of all home pages had at least one detectable accessibility error, meaning that users with disabilities can expect to find one in every 13 web pages they visit to be inaccessible in some way.

Website accessibility is poised to be a big concern in 2020, as it’s become the basis for an increasing number of lawsuits — many in bad faith. More than 2250 ADA website accessibility lawsuits were filed in 2018, up from 814 such lawsuits in 2017, Minh N. Vu, Kristina M. Launey and Susan Ryan at law firm Seyfarth Shaw write.

These lawsuits, filed in a variety of state and federal courts, have led to some inconsistent holdings that have further muddied the waters for businesses seeking clear guidance on ADA compliance for websites.

For instance, in National Association of the Deaf v. Netflix, a federal court in Massachusetts found that online-only businesses are subject to the ADA, just as physical businesses are. A year later, however, a federal court in California held that only a physical location qualifies as a “public accommodation” subject to the ADA. In two unpublished opinions, the Ninth Circuit affirmed, holding that web-based businesses like Netflix and eBay (at issue in those cases) are not required to comply with the Americans With Disabilities Act.

Some courts have landed in a middle ground, finding that the ADA applies to websites only if the website is sufficiently connected to the business. For instance, some courts have found that restaurant websites are covered by the ADA when the restaurant takes food orders online, as in Robles v. Domino’s Pizza in 2016.

Questions continue over how to apply the ADA to the digital world. When it comes to reaching more customers, however, better accessibility makes better business sense.

“The only way to effectively communicate information on a website or mobile application is to have that website or mobile app be accessible,” says disability attorney Lainey Feingold.

Websites that strive for clarity and accessibility won’t merely protect themselves from the possibility of a lawsuit. They will be able to offer engaging branded content that can reach the widest possible audience.

Author
Recent Posts

Dani Ryskamp

Dani has been writing for Epic Presence since 2017.