Accessibility Design: 4 Principles to Design Mobile Apps for the Visually Impaired

Jan 15, 2020 6:28:46 PM

accessible design

According to WHO, over 280 million people are visually impaired, of whom 39 million are blind. So, if your product is not accessible to all, you’re certainly missing out on a large user base. Thus, to make sure that your app is available to users with a visual disability, it is important to create a user experience that is accessible by all. 

Accessibility design is a design process where the UI/UX is created for people with disabilities like visual or hearing impairment, mobility challenges, etc. It allows users with disabilities to navigate through a solution, understand it, and use the UI. 

Creating an accessible design for a mobile app is different from the usual design creation. Here are 4 prime principles that must be considered for creating accessible UI/UX, along with a few examples of how these principles can be executed. 

1. Perceivable

A perceivable interface is the one that a user is able to understand or interpret in some way, using one or more of their senses. To make mobile app UI/UX perceivable for a user with a disability, you can work on the following factors. 

  • Screen Size

Small screen size is the prime characteristic of mobile devices. These small screens with high resolution render a huge amount of information. However, the Small screen size poses challenges on how much information can be viewed at a time, especially when people with low vision use magnifiers to read the content. When creating an accessible design, the following practices can be adopted to display content on a small screen. 

1. Minimize the amount of information that’s displayed on a page as compared to desktop/laptop. For this, a dedicated mobile version can be created that includes only a few content modules, fewer images, and have an emphasis on mobile usage scenarios. 

2. CSS stylesheets can be used to render content on the different viewport width. For example, the navigation menu can remain hidden unless a user taps on the menu button. 

  • Contrast

Mobile devices are likely to be used in varied lighting conditions. Such scenarios intensify usually pose challenges for users with low vision, making it difficult for them to access the content with poor contrast on mobile devices. Therefore, when creating accessible designs for mobile apps, contrast management can be a great help. 

2. Operable

An operable interface is the one in which the interface components and navigation are seamlessly used. When creating an operable design for the users, some of the factors that can be considered include: 

  • Keyboard Control for Touchscreen Devices

Allowing mobile devices to connect with external keyboards, such as Bluetooth, USB On-The-Go or alternative on-screen keyboards like scanning on-screen keyboards is an important aspect when dealing with different groups of disabilities. Here is how: 

1. Physical keyboards have a number of advantages over the touchscreen keyboards like clearly separated keys, predictable key layouts, etc. 

2. Users with mobility disabilities can benefit from the keyboards optimized to reduce inadvertent presses (like different shaped keys, guarded keys). 

  • Touchscreen Gestures 

To operate mobile devices, there are different gestures available for the users. These gestures can be as simple as a single tap on the screen or can be as complex for a user with a disability to manage it. For example, there can be on-screen reader interaction modes that help in activating elements.

  • Define Position of the Buttons 

For making it easy for users with disabilities to access the buttons, their placement can be defined properly.

 3. Understandable

A design should be able to adjust itself according to the various changing factors. Also, there should be clear layouts with a distinct call to action. 

  • Highlight Actionable Elements

Elements that trigger change should be clearly distinguishable from the non-actionable elements. It is important to highlight areas in a mobile app that might have actionable items like links, buttons, etc. Actionable elements such as shapes, colors, style, positioning, conventional iconography, etc. can be used to distinguish the actionable items. 

  • Screen Orientation 

At times, mobile applications automatically set the screen to display orientation, expecting that the users will adjust by rotating the screen. However, this way of managing the screen display is not an acceptable practice when designing for users with a disability. 

4. Robust

Robust design is the one that can accommodate a variety of users, i.e. people with different visual disabilities (low vision, blind) should be able to use the app. 

Planning to Update your App with Accessible Design? 

Design accessibility has some certain benefits for a universal app. Also, mobile apps that target a group of users with a particular disability needs to pay attention to the standard regulations for creating an accessible design.

At Daffodil, our experts pay special attention to these regulations for creating accessible designs. If you’re planning to update your existing app or create a new one from scratch, then our team specializing in this domain can help you out. To get started, set up a 30-minute free consultation with them who will help you in the execution of accessible design for your app. 

Archna Oberoi

Written by Archna Oberoi

Content strategist by profession and blogger by passion, Archna is avid about updating herself with the freshest dose of technology and sharing them with the readers. Stay tuned here as she brings some trending stories from the tech-territory of mobile and web.