Article authored by Rui Pedro Borges, originally published in Dinheiro Vivo

Picture your favorite website. What does its layout look like? A menu, content on the left, and a sidebar on the right, or vice versa? Nowadays we're so used to interacting with this page layout that we don't stop to think about it. Now imagine you can't navigate with a mouse, that for some reason your mouse doesn't work, that you can only navigate using the keyboard. That makes interaction harder, but clearly not impossible, right? Now imagine having to navigate this site with your eyes closed, seeing nothing. You only have the help of a screen reader and your computer's keys. Sounds impossible? It's the reality for thousands of people with disabilities around the world who browse the Internet every day.

The World Health Organization (WHO), in its World Report on Disability, estimates that worldwide around 15.6% of people over 18 live with some form of disability. The same report notes that "people with disabilities have significantly lower rates of information and communication technology use than people without disabilities," also indicating that little information is available in accessible formats.

Blind users, hearing-impaired users, and users with some cognitive limitation are the people most affected by the lack of accessibility on the Internet. However, someone with poor near vision, color blindness, dyslexia, or partial deafness may also face some difficulty enjoying all the content available on the Internet. As Tim Berners-Lee, creator of the World Wide Web, said, "The power of the Web is in its universality. Access by everyone regardless of disability is an essential aspect." It's up to us, as developers, project managers, and designers, to develop solutions that can be used by everyone, regardless of their limitations. This should be a point of great importance, something to always keep in mind, when creating content for the Internet.

By creating accessible information, we're not only giving a portion of the population the opportunity to consume content they otherwise couldn't, but also improving the experience for the rest of our audience. One example of how an accessible feature can benefit all users is the use of subtitles in a video. Everyone has been in a situation where they wanted to watch a movie but couldn't listen to it, whether on public transport without headphones, in a room with colleagues, etc...

Various organizations have guidelines that guide developers and content managers toward making their products more accessible, and these should be consulted during development. Some key points to keep in mind when developing an accessible site should be:

1. Using the alt attribute

The alt attribute on an image on a site is the only content a screen reader can understand. It should therefore always be present and contain an accurate description of the image shown. Using this feature will also improve the site's SEO, since search engines also process this attribute.

2. Captions and transcripts for audio and video

Adding captions to a video would not only let a deaf user better understand the content, but would also help someone who, momentarily, couldn't hear the video's audio. The same can apply to an audio file being made available. If each file comes with a transcript or a summary of the content, not all the information is lost.

3. Using HTML tags only for semantics

The way an application can identify what is a title, a subtitle, a caption, an abbreviation, etc... is through the use of HTML tags. If these are used for styling the site rather than only for semantics, it becomes harder for a screen reader to understand the relevance of a given piece of text. Correct use of these tags also benefits the site's SEO.

4. Use mechanisms to skip menus and tables

For a blind user navigating a site, it should be possible to skip menus and tables. In the case of menus, they'll hear the same content every time they enter one. In a table, a screen reader will go through the entire area, reading every cell. There are mechanisms to display a button for this purpose, which will only appear if the site is accessed without CSS.

5. Check special guidelines for each type of content

The Web Content Accessibility Guidelines (WCAG) is a document containing a set of guidelines that make content more perceivable, operable, understandable, and robust. These guidelines address every possible type of content that can be shown on a website and some precautions to take during development.

There are also tools, such as WAVE from WebAIM (an organization focused on Internet accessibility), that let you check whether the site you're developing is accessible. Additionally, as developers and content managers, we have to put ourselves in the shoes of whoever will use what we're building and reflect on whether what we're developing can be consumed by people who can't 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?ua=1

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/