5 practical tips to make your website more accessible

Working with accessibility in the creation and management of websites is not just a matter of empathy, but also an audience. There are about 45.6 million people with disabilities in Brazil, and if we stop to analyze it, this is not an insignificant number.

The accessibility work must be taken into account both when creating the layout, the text, and when writing the code. That's why we've put together 5 practical tips to make your site more accessible. Check out!

1 - Put the alt attribute on the images

The alt in images is a property defined in the second version of HTML in 1995, and it originally served as alternative text for an image that could not be rendered at the time of its request. It's an attribute that, at the time, was needed due to widespread slow connection and constant server errors.

Although the web has evolved a lot since 1995 and the use of images on the web has become normal, the use of this attribute has not fallen out of favor as it has become a valuable tool in the identification of images by major search engines such as Yahoo! (1997) and Google (1998), especially after the launch of Google Images (in 2001), which used the alt attribute as the main search criteria (understand the importance of the alt attribute in SEO).

Nowadays, with the development of the web, the issue of accessibility has been emphasized more and more. Since 2000, with the popularization of screen readers (especially Microsoft Narrator, present in Windows 2000), the alt attribute has been very important to help people with visual impairments.

The operation of screen readers is very simple: screen readers go through the image and read what is written in the alt attribute.

Because of this, there was a need to make not only an "alternative text" in the alt attributes, but also "descriptions" of the image and all the careful copywriting work for a good image reading experience for visually impaired users.

Quick tips for good alt descriptions in images:

  • Avoid putting information in alt attributes on purely decorative images (put an empty alt attribute). This detracts from the experience of visually impaired users.
  • If the image is a photo, describe the environment, subjects and actions without value judgments or vague and subjective adjectives like "beautiful" or "ugly". Be direct, impersonal, and descriptive.

2 - Soften the colors and contrasts in the layout

Smoothing out the colors and contrasts in the layouts can help a lot in the daily lives of high functioning autists – who are those who can acquire social skills, allowing them to pursue a professional career, for example.

We can say (very superficially) that autistic people have super-sharp senses. Some of them, for example, feel suffocated when being hugged; still others are bothered to a greater degree by perfumes and noises.

The video below, produced by The National Autistic Society, is an interesting example to help us understand the point of view of an autistic person about the experience of walking through a mall.

Now, as for the site: thinking about layout, the colors used shouldn't be too bright. Very stark colors attack and annoy the autistic person in a very acute way. For this, a tip we give is the use of Adobe Color CC to find the most appropriate colors for use in website layouts.

This tool shows us colors in analogous, monochromatic, triad and complementary color schemes. It is possible to search for a term such as "calm" – which generally have the most pleasant tones for those with this behavioral syndrome.

Regarding contrasts, prefer softer contrasts (be careful though, as you can compromise readability and make it difficult for people with low vision to read).

Instead of setting layouts with extreme contrast polarity, such as a white page (hex value #FFFFFF) with black letters (hex value #000000), try decreasing the polarity to dark gray (#333333) over white (#FFFFFF).

3 - Be careful with figures of speech

Autistic people have some difficulty understanding figures of speech. Expressions like “stop the traffic” are not easy for them to interpret.

Therefore, we must avoid figures of speech, idioms or any type of metaphor or analogy – terms that may result in damage to the user's interpretation, making communication difficult.

You can find out more about the subject on Marcos Prety's YouTube channel, a high functioning autistic person who comments on his experiences in his videos.

When we act as designers or programmers, in general the texts arrive ready-made and with these terms, simply to be added. If you receive a text in which you realize there are metaphors that are difficult to understand, try to have the copywriting professional review the material.

Accessibility should be the focus of the entire company, but if not, you, who are interested in the subject and are more aware, can be responsible for making your project accessible.

4 - Vary the forms of contact

At first glance, it may seem strange to think about accessibility for the deaf on a website, as we soon associate websites with basically an environment of images and texts.

However, if you look closely, there are several small tweaks we can make to a website that make life easier for people with hearing impairments.

Understanding the different types of hearing impairments can help build empathy and deliver the best usability and user experience results.

Among the deaf, we can separate between oral and non-oral.

If your website is only contacted by telephone, people who are deaf and non-oral will not be able to contact you.

For contact areas, it is always good to leave all options available: telephone, visible e-mail, and forms.

5 - Don't be afraid to repeat important information throughout the page

To make your site accessible to people with dyslexia, it's important to repeat important information throughout the page.

Dyslexia is a genetic and hereditary language disorder, of neurobiological origin, which is characterized by the difficulty in decoding the written stimulus or graphic symbol. This condition compromises the ability to learn to read and write correctly and fluently and to understand a text.

It is possible for a person with dyslexia to read and understand information as well (and even better) than other people who do not have this disorder, however, they will have to repeat the same process twice or several times until it is completely absorbed. It is a lack of fluency, not cognitive ability.

Another limitation identified among dyslexics is the difficulty in storing data, such as telephone numbers and people's names. Sometimes it is necessary to repeat the same information several times for them to be able to absorb it.

On websites, we can alleviate this difficulty by repeating links and contacts in the header and footer, as well as some important information throughout the same page.

Conclusion

These are just some of the improvements that can guide the development of your websites. Unfortunately, in the rush of daily life, the tight deadlines, and the lack of dissemination of this subject among professionals and clients, accessibility issues end up being neglected. However, it is worth making an effort in this direction - not just for empathy, but business intelligence.

Tips for further reading:

Compartilhe esse post nas redes sociais:

Mais artigos