Design for AccessAbility

Guneet Kaur Bhatia April 13, 2017

Let us start with the core definition of accessibility in the digital world. It is nothing but enabling people with disabilities to perceive, understand, navigate, interact with, and contribute to the web.

When we design for disability, it is essential to note that disability is not inborn but rather a mismatch between the products and situation that the person inhabits. Every person has a different set of capabilities and therefore needs, thus it becomes crucial to create products which address the physical, cognitive and emotional needs of each one of them.

Designing for special needs and then extending it to all is an important step towards inclusion. Also, it is important to note that a design which is inclusive is not extended to everyone but in fact is designed in a way such that it is capable of a number of interactions

While the inclusive design helps people with disability, it also has the potential to be a ground for innovation. An apt example is that of the ‘Color contrast’ feature in the mobile phone whose primary function was to help people with low vision read on the mobile phones. But now the same feature is used by people with normal vision to read in the bright sunlight.

The key aspect to emphasize on is that accessibility doesn’t force a designer to make a product that is unattractive, boring, or cluttered. It will introduce a set of constraints to incorporate as you consider your design. These design constraints will give you new ideas to explore that will lead to better products for all of your users. When we developed Braigo in-house, the key to inclusivity was to design in such a way that voice over can guide a visually impaired person easily through the app. The primary and secondary research led to defining key accessibility inferences which are listed in the infographic.

Accessibility parameters

  • Color contrastBelow is an example where color contrast does not meet the prescribed standard. The slider which is white is placed against a white background, thus making it difficult for the color blind people to spot the same. The correct approach should be to provide a color to the slider having sufficient color contrast.
  • Supporting text for the visual cue Many a time, visual cues for the user input are represented with the help of color. Color blind people, who have difficulty in differentiating between green and red will find it difficult to make sense of the cue. The best practice is, therefore, to back the visual cue with text supporting it.
  • ‘Skip to’ link Providing a ‘Skip to’ link as the first tabbing on the page helps people the disability to straightaway jump to the main content of the page. This is helpful for people with motor and visual disability.
  • Provide concise ‘aria label’ People with visual disability depend upon the ‘Aria-label’ of the active elements to understand their meaning. As a single page usually has lots of elements that can accept user input, it is the best practice to describe the function using brief ‘Aria-label’. It is important to note that we describe ‘Aria’ property of the element as the state of the same is read out by the screen reader.

Also, below are the UX principles listed that one should practice while designing for accessibility.

To sum it up, embracing accessibility guidelines is the way forward. Just like we embrace a set of design constraints, these guidelines can in fact be a driving push for innovation. They are a part of the challenge towards creating amazing products.

Guneet Kaur Bhatia

I am a human-centered product designer. I have a keen interest in exploring design and accessibility in technology and education. The zeal to understand and uncover the needs of the users through research insights is what drives me in my work. I have leveraged these skills in making tactile books and building web and mobile products for users with special visual needs.