Coronavirus and Digital Accessibility: How to Make the Web More Accessible
We’re all in self-quarantine for the next 1–2 months while we do our best to flatten the curve and slow down the spread of the coronavirus.
Notice I wrote, “we’re all”. This means everyone, including those with disabilities, will be completely reliant on the web for work, education, shopping, entertainment, communication, etc.
The digital world was already integrated into our daily lives before, but now it’s everything; to call it essential would be an understatement.
This means it’s even more crucial than it was before to make your digital offerings accessible.
Websites, apps, documents, software, and social media require accessibility now more than ever.
Not for legal compliance. Not for lawsuits. But for people.
About 15% of us have a disability that impacts how we interact with the web so we need to account for a wide range of disabilities in our digital offerings.
(Note: You know someone with a disability.)
Here are some of the easier, less technical (but still very important) ways you can make the web more accessible:
Live closed captions
For conference calls, presentations, webinars, broadcasts, etc. you need to have live closed captions. Otherwise people who are deaf or have a hearing impairment are completely left out.
One cost-effective solution is IBM’s Watson. Watson is AI-powered, fairly cheap, and reviews overwhelmingly say the quality/accuracy is good.
You should also look into Microsoft Team’s closed captioning.
Closed captions for pre-recorded video
Of course, any existing video should also have closed captioning.
If you’re using YouTube to host your videos, my how to make YouTube videos accessible article shows you exactly how to edit the automatic closed captions YouTube provides (these usually aren’t accurate enough out of the box).
Alt text
For any meaningful images (graphs, icons, photos, art, gifs, etc.), an alt attribute is assigned and an alt text value is added.
This helps people who are blind or visually impaired access meaning even though they cannot see the image.
WebAIM’s alternative text page not only shows you how to add alternative text inside code (it’s easy to do) but fills in the details on proper techniques and best practices.
Another note: You should avoid using text inside images because text becomes unreadable to screen readers once it’s in image format.
Headings
Headings organize and structure your page’s content. Each page should have one H1 heading followed by H2s and then H3s under H2s and so on.
Great heading structure helps those who are blind or visually impaired quickly locate specific information within content, particularly longer content.
The H1 is the main topic of the page. It provides a broad overview of the content on the page.
H2s divide the main topic into subtopics.
H3s are nestled under H2 and divide the subtopics into sub-subtopics.
Make sure your headings are descriptive of the content that follows.
Anchor Text
Anchor text is the text that forms a link.
We often see “click here” or “learn more” used as anchor text but this is unhelpful to screen reader users who sort by the links on a page because they can’t immediately understand what the linked page is about.
Moreover, avoid long URL strings (e.g. https://amazon.com/category/product-page/product-name/product-locator-number-010203) as these get read in full by screen readers.
Shorter URLs are okay, though.
Page Titles
Descriptive page titles similarly help those using a screen reader understand the main purpose or topic of the page they’re on and whether that is the page they actually want.
Remove Blinking or Flashing
Anything that blinks or flashes is distracting, disorienting, and should be removed from your page.
In some instances, blinking and flashing can cause seizures.
The measures above are a great, relatively non-technical start to make your digital offerings more accessible.
Of course, there are many more things you can do for accessibility such as:
- having sufficient color contrast
- enabling navigation by keyboard only
- coding in labels for form fields and interactive elements
As you continue to improve, you’ll account for a wider range of disabilities and degrees of disability.
But the important takeaway from this article is not to try and do everything (this can overwhelm you), but to start doing what you can and then progress into the medium-difficulty range when you’re able.
Accessibility takes time and a concerted effort but with each and every bullet point you check off, you make the world that much more accessible.
It makes a real difference.
I wrote this article as a result of a great LinkedIn post by Emily Ogle, Senior Regulatory Strategist — Accessibility at Cerner Corporation.
Emily’s post basically said that, especially now with so many of us working remotely because of coronavirus, some people with disabilities may be left out or isolated because of inaccessibility.
