Our civilization has come a long way in terms of human rights protection. Over the past few decades, most developed countries have made tremendous progress in the fight against the horrendous prejudices based in race, gender, or age discrimination. One of the success stories our society can proudly add to its credits is also the […]
Our civilization has come a long way in terms of human rights protection. Over the past few decades, most developed countries have made tremendous progress in the fight against the horrendous prejudices based in race, gender, or age discrimination.
One of the success stories our society can proudly add to its credits is also the provision of better conditions for disabled people. On most respectable TV channels, for example, you can see sign language interpreters during news broadcasts and other shows. Most public and many private buildings are equipped with entrance ramps. The list goes on.
The digital space has undergone important transformations to meet the essential needs of the disabled too. The majority of software vendors are adding features that facilitate the use of their products by people with impairments.
What are the main reasons for doing this?
Accessibility is a particular source of concern for e-commerce companies. Most of them use a content management system as the basis for their stores, with some better suited to the disabled out of the box than others.
One of the e-commerce platforms that tops the chart when it comes to accessibility is Drupal 8. Let’s have a look at what exactly this platform offers off the shelf to make sites easy to interact with for people with disabilities.
Images are an integral part of any site. They take on particular significance on e-commerce websites. Seeing a product is much better than just reading its description.
Your images can be of very high quality and present your goods in the most favorable light. Yet, you might discover that Google ignores them. You might also receive complaints from people with disabilities that they find your site hard to use. What’s the problem?
Almost every image (except decorative ones such as arrows or borders and some others) must be accompanied by a descriptive text. This text is placed in the alt tag of the image. No alt text — no indexing by search engines. The Drupal team was well aware of this and made the alt text mandatory by default in version 8 of the platform (you can disable this feature if necessary). If you don’t provide a description for an image, it won’t be added to the media library.
Apart from the SEO benefit you get in this case, you also do a great favor to people with poor eyesight or those who have lost it. They use screen readers to learn what’s in this or that image.
Adding a description to an image is only part of the story. The description must tell precisely who or what is presented in a photo. The alt text should contain simple words that everyone knows. Avoid academic words or slang to describe your visuals unless your site specializes in a particular niche. You can find numerous materials online for how to perfectly word the alt text.
Modern websites are very dynamic and frequently update their content without reloading an entire page. This can be a problem for people with poor eyesight who depend on screen readers to extract information from a website.
A screen reader is a “sequential” tool. It scans a page in a linear order and thus can’t track updates in a section of the page where it’s not currently positioned. Because of this, disabled visitors may not know that a new post has been added to the blog, for example.
To solve this issue, Drupal 8 now exposes the Drupal.announce() JS function. It has a string argument that represents a message to a visitor about an event that has just occured on the page. This string is read by the screen reader so that the user can be notified about the latest update.
Another important characteristic of a website from the accessibility perspective is the higher contrast between the background and the content. According to the W3C guidelines, the contrast ratio must be at least 4.5:1.
You can find various online tools to determine the current contrast ratio of your website. If you’re using one of the default Drupal 8 themes, though, you are already in the premier league: the themes have been built with accessibility in mind and all have high contrast. Thus, visitors with poor eyesight or those who can’t distinguish among colors can feel comfortable navigating the site and consuming its content.
No one is infallible. People tend to make mistakes. This is also true when filling out forms on web pages. Most modern software systems are smart enough to detect errors in form fields and notify the user what exactly is wrong by printing an appropriate message and changing the color of the field where the error has been made.
In the previous versions of Drupal, these error notifications were placed above a form with the corresponding fields repainted to a different color. The problem is that visually impaired users or those who can’t tell one color from another couldn’t establish a connection between the message and the field. Screen readers were not able to resolve this issue.
Drupal 8 introduced the Inline Form Errors module. Its function is to place the error message next to the form field where this error has occurred. Tremendous help! Mind that the module is not enabled by default.
Some people can be temporarily or permanently disabled in their motor capabilities, unable to grip the mouse in hand. For them, using the keyboard while navigating a Drupal site is one solution.
Drupal 8 has made these people’s lives easier, too, by offering the so-called tabbing manager, a JS feature. It’s chained to the constrain() method. The latter accepts a group of page elements that can be iterated by pressing the Tab key. If there is a page element between two elements included in the group, that element will be skipped.
This feature can also be of great help to the visually impaired.
These are just some of the core Drupal 8 features that help you make your website better suited for the disabled. Apart from taking advantage of the default Drupal functionality, you can take your own steps to improve the accessibility of your site, which we are going to discuss in one of our future blog posts.
You should take the importance of accessibility for your businesses very seriously. The best way to avoid lawsuits, make all your visitors happy, and protect yourself from revenue loss is to hire the GetDevDone Drupal developers.
Talk to us today. We’re always glad to help.
One of the ways to make your website outstanding from a UX perspective is to apply one of the many hover effects. We discuss some of those in this post.
Sass is a popular CSS preprocessor that provides the benefit of variables for web developers. In this post, we have reviewed five Sass mixins to facilitate building web pages.
A crisis is not only a bad time when people are suffering and business growth is stalled or starts going in reverse. A crisis also creates new opportunities. One of the economic sectors that the current COVID-19 pandemic is likely to boost rather than kill is e-commerce. The reason should be obvious. With half the […]
