What is the accessibility of design for mobile apps and websites? What can designers and developers do to provide full access to mobile services regardless of the physical abilities of a user? In our today’s article, Slava Todavchich, the co-founder of the Moqod company based in the Netherlands, shares the ideas on how to follow the principles of design accessibility, why it is highly important and how mobile accessibility can make the world a bit more warm-hearted.
Over 50% of the world’s internet traffic falls on mobile devices. The problem of information access for people with limited physical abilities is probably of the same significance as the total absence of an infrastructure for such people. It is impossible to be a complete member of society without being able to get the necessary information. Do we consider how to provide comprehensive access to the information for people with hearing or eyesight problems, cognitive impairment and dysmotility?
Now, there’s the list of countries that have already adopted accessibility standards in W3C consortium. The basic principles accessible design of mobile apps are extremely simple: follow a common sense and basics of design guidelines. Quite obviously, any mobile service is a particular tool used for doing some actions in a real life or follows patterns of a real life. Barely any action in a real life of a disabled person takes much more time than of others. That is why the principle of simplicity, purity, and intuitiveness of UI/UX design is especially important.
Source: www.apple.com
To check it, let’s do a simple experiment. Let’s imagine a blind man dreaming to find love. Normal wish for the majority of people. Nowadays love is frequently being created in AWS clouds via Tinder mobile app and the like. A beautiful app with a bright UI familiar to the majority of people; all you need to do is just swipe left and right which is “love” or “don’t love”. Now let’s turn on a VoiceOver mode and try to find her or him. The swipes don’t work. The understandable button labels which could be read by the VoiceOver are missing at all. The product is nearly impossible to use. And all that on the days when the same AWS can identify a photo of a person and provide it with a clear voice description fairly enough.
Now let’s consider an example of a great design accessibility implementation in apps. In EU countries according to the law, digital products of state authorities must be accessible for all the users regardless of their capabilities. The Netherlands is the country where each meter of public space, including an information space, is thought out to the smallest details. Streets of major cities and absolutely all railway stations are equipped with signs and tactile fencing. The Netherlands railway app is designed and developed with regard to these requirements. Eachis signed appropriately in all localizations of the app. With your eyes closed, you can build and plan the route, hear the information about the train, stations, delays, buy a ticket, etc.
Now let’s get back to the principles of design suitable for everyone. First of all, it’s worth mentioning that there are four main areas of impairments outlined in Accessibility design:
These impairments can be both permanent (e.g. paralysis), and temporary (e.g. a broken hand), congenital (autism) and acquired (blurred eyesight or hands tremor for the elderly).
The main principles of accessibility in design are:
The product should be clear even with eyes closed. That includes basic principles of any good design:
The priority should be set to the clarity of the product and its UI, be it contrast, font size, or correct well-placed labels of buttons, tables, and modal elements.
Fortunately, the majority of us were not meant to experience the world as a disabled person. That’s why being designers and developers of digital solutions and products, we should take care to make our information accessible for the maximum audience.
Don’t forget to test apps with accessibility functions. Create interfaces with possible options of accessibility: the dynamic font size, the VoiceOver, the amplified contrast, etc.
No significant efforts are required to integrate accessibility into app design. Here are several effective practices that would extend app accessibility for the disabled.
The easiest and most suggestive step here will be marking the app controls, graphics and the necessary dynamic content with corresponding labels in code. Thus, the built-in mechanism of VoiceOver and Talk Back would transcribe their values.
Testing this function isn’t resource-consuming: QAs should just check out the app in VoiceOver and Talk Back modes, and confirm that all the required elements are transcribed and marked appropriately. In case the app supports several localizations, it should be tested in all of them.
You should apply an appropriate dynamic font that could be scaled if the user sets up an enlarged font in settings. Verify that labels are displayed correctly with an enlarged font and that the UI of the app isn’t broken. Test the app with various accessibility functions on, such as bold font, increased contract, dark mode, etc. Make sure that UI responds correctly to these changes.
All the mentioned doesn’t require substantial expenses for development and testing. For many professional teams, it is an obligatory part of any project.
The guides from Google and Apple have a clear description of the detailed principles of an appropriate design for accessibility. The main task for designers and developers is to make technology accessible. The more accessible a technology is to a greater number of people, the more chances there are to make it beneficial for everyone.
As always, everything depends on the goal. For apps of governmental services and companies, this rule should be obligatory. Hardly it makes sense to be bothered with this if you’re developing another analog of the Instagram with even funnier emojis. However, the broader your audience is growing, the more crucial it is to support the disabled users.
About the author: Slava Todavchich, co-founder and manager at Moqod
Title image by Walid Beno
The original article was published on Telegraf Design
Read an article about empathy in UX design, check the practical definition of usability and review the most hated UI/UX patterns
Essential tips for team managers and members to enhance collaboration, improve communication, and achieve exceptional…
Discover top Figma plugins to streamline your workflow, enhance visuals, and add creative flair to…
Learn how to manage visuals in blog posts to optimize them for SEO in this…
Unraveling Figma’s pricing structure: tips to avoid hefty bills and save money. (more…)
Don't switch tabs to browse icons, illustrations, and photos for your websites. Get them inside…
Transform your Notion space with custom covers! Dive in for easy steps, pro tips, and…
This website uses cookies.