Originally published in Dinheiro Vivo.
Picture your favourite website. What does the layout look like? A menu, content on the left and a sidebar on the right, or the other way around? We are so used to interacting with this page pattern that we no longer stop to think about it. Now imagine you cannot use a mouse — for some reason your mouse is not working and you can only navigate with the keyboard. It makes interaction harder, but clearly not impossible, right? Now imagine you have to browse that same site with your eyes closed, unable to see anything. You only have the help of a screen reader and your keyboard. Sounds impossible? It is the daily reality of thousands of people with disabilities around the world who use the Internet every day.
The World Health Organization (WHO), in its World Report on Disability, estimates that around 15.6% of adults worldwide live with some form of disability. The same report notes that "people with disabilities have significantly lower rates of use of information and communication technologies than people without disabilities", and points out that there is little information available in accessible formats.
Blind users, deaf users, and users with cognitive limitations are the most affected by the lack of accessibility on the Internet. But anyone with low near-vision, colour blindness, dyslexia, or partial hearing loss can also struggle to consume all the content the web has to offer. As Tim Berners-Lee, creator of the World Wide Web, put it: "The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect." It is up to us — as developers, project managers, and designers — to build solutions that can be used by everyone, regardless of their limitations. This should be a priority, something to keep in mind whenever we create content for the web.
When we make information accessible we are not only giving a portion of the population the chance to consume content they otherwise could not, we are improving the experience for the rest of our audience as well. A clear example: captions on a video. Everyone has been in a situation where they wanted to watch something but could not turn the sound on — on public transport without headphones, in a room full of colleagues, and so on.
There are guidelines from several organisations that help developers and content owners make their products more accessible, and they should be consulted throughout development. Some key points to keep in mind when building an accessible site:
##1. Alternative text on images
The alt attribute is the only content a screen reader can interpret from an image. It should always be present and contain a correct description of what is shown. As a bonus, using it well also improves your site's SEO, because search engines process this attribute too.
##2. Captions and transcripts on multimedia
Adding captions to a video not only lets a deaf user understand the content, it also helps anyone who momentarily cannot turn the audio on. The same applies to audio files: if every file ships with a transcript or summary, no information is lost.
##3. Semantic HTML, not decorative HTML
The way an application identifies what is a heading, a subheading, a caption, an abbreviation, and so on, is through HTML tags. If those tags are used for visual styling instead of semantics, it becomes harder for a screen reader to understand the relevance of a given piece of text. Using these tags correctly also helps the site's SEO.
##4. Let users skip repetitive blocks
A blind user navigating a site should be able to skip menus and tables. For menus, they would otherwise hear the same content every time they land on a new page. For a table, a screen reader would walk through the entire area, cell by cell. There are mechanisms to expose a skip button for this purpose that is only shown when the site is loaded without CSS.
##5. Follow WCAG and validate with tools
The Web Content Accessibility Guidelines (WCAG) is a document containing a series of guidelines that make content more perceivable, operable, understandable, and robust. These guidelines cover every type of content you can put on a website and call out specific care to take during development.
There are also tools — such as WAVE, from WebAIM (an organisation focused on web accessibility) — that let you check whether the site you are building is accessible. On top of that, as developers and content owners we have to put ourselves in the shoes of whoever will use what we are building, and ask whether it can be consumed by people who do not use the Internet the same way we do.
Sources
- Organization, W. H. (2011). World report on disability 2011 (9241564180). Retrieved from https://www.who.int/disabilities/world_report/2011/report.pdf
- Caldwell, B., Reid, L. G., Vanderheiden, G., Chisholm, W., Slatin, J., White, J., … Cooper, M. (2018). Web Content Accessibility Guidelines (WCAG) 2.1. Retrieved November 16, 2019, from https://www.w3.org/TR/WCAG21/