How to improve accessibility, representation, and inclusivity in mobile apps

As an engineer or leader in the mobile space, you’ll likely be familiar with the subject of mobile app accessibility. Creating an accessible app often means offering variations for people with physical impairments, such as color blindness or hearing disabilities. However, mobile app accessibility is about making the app accessible to a wider range of people, despite what makes them different. So, can the traditional idea of accessibility be challenged to fit the modern time?

Adding accessibility to apps

Many development teams overlook accessibility or view it as a last-minute task to be carried out at the end of the release. This is a costly mistake, as you may be alienating a large portion of the overall user base. The bottom line for businesses is that “15% of the world’s population experience some form of disability”, according to The World Bank. By not prioritizing accessibility, you could be alienating 15% of the world’s population — or about one billion people.

We recently launched a MODAS survey to assess the maturity of mobile teams and found that larger teams are more than twice as likely to adopt ADA compliance testing (the ADA regulations set the standard of accessibility & accessible designs in the US).

24% of large enterprises incorporated ADA compliance during the creation phase (compared to 9% of total organizations), and 15% of organizations did ADA compliance testing during the testing phase (compared to 7% of total organizations).

To start addressing the accessibility of your mobile app, you may start by making your app accessible to those with visual impairments. The WHO reports that “at least 2.2 billion people have a near or distance vision impairment” worldwide. In order for users with visual impairments to use your app, start by contrasting the text and the background. With a color contrast of 4.5:1, users with visual impairments will be able to see the elements on your mobile app. This means that text and elements should always be easy to read against their background color. It is also recommended to avoid the colors red and green, as red/green color blindness is the most common variation.

Adding representation to apps

If you broaden your traditional definition of mobile accessibility, it could include improving representation in a mobile app. When you analyze your user base, you might identify ways you can further represent your entire user base in your app

Representation can show up in your mobile app in many different ways. This could mean giving your users the ability to translate your app into more languages, the ability to create Black or Brown avatars within your app, or even app themes that include a user’s country colors.

For example, emojis can help minority communities feel represented. Not only are there multiple skin tone options for many of the emojis, but there are also apps like Bitmoji, for example — the personalized version of emojis. Bitmoji allows its users to create an avatar of themselves to be used on social media platforms, like Snapchat or Instagram. Bitmoji builds representation into its app by including various skin tones, clothing, headwear, and hairstyle options for users to choose from. They also incorporated physical disability representation into the app, as users can choose to use a wheelchair or a hearing aid with their avatar.

Adding inclusivity to apps

This August, we are celebrating LGBTQIA+ Pride month — a time to celebrate and support Lesbian, Gay, Bisexual, Transgender, Queer, and Intersex people. And while many tech companies simply put up their rainbow-colored logo, you could take the opportunity to build inclusivity into your app.

To add inclusivity to your mobile apps, evaluate your app from your LGBTQIA+ users’ perspective. You may uncover areas to make your app more inclusive. For example, if your app users choose their gender, you can add a non-binary option for those who do not identify as solely male or female. Or, if your user has to choose an avatar, create a non-binary avatar option.

For example, Etsy is a popular e-commerce marketplace for artists to sell handmade goods. Etsy’s sign-up flow includes a section to indicate a user’s gender. Etsy includes the following gender options: “Male”, “Female”, “Prefer not to say”, and a custom field for a users can add their own identification.


Adopting an accessibility-first mindset

When it comes to building the next generation of mobile apps, we all have the opportunity to create with inclusion and representation in mind. We have the ability to put diversity and inclusion at the forefront of our technology to create a more inclusive technological world.

Meta, for example, is creating technology with diversity and inclusion at its core. Meta’s Chief Diversity Officer, Maxine Williams, speaks about wanting to create a “supportive place for underrepresented communities”.

At the TNW conference in Amsterdam earlier this year, Maxine said, “every time we take a step to represent who we are globally — in our fullness, our richness of diversity — it goes a step further to creating opportunity and inclusion for everyone, and having this version of the internet be something which really holds all of us together — not just how we look, not just who we are in terms of ability, but also how we speak.”

How to build an accessible app

In order to build a more accessible app, inclusivity and representation must be at the forefront of app planning and feature planning. To do this, diversity needs to be injected into the planning stage of mobile app development

While creating a new app or planning new features, consider the following:

  1. How do (and which) minority communities use the app? 
  2. How does the sign-up flow differ from user to user and country to country?
  3. Can all users see themselves represented in the app?
  4. Can the entire user base take advantage of all the features?

And for your UI and accessibility tests, use a Mobile DevOps platform like Bitrise to automate some of those tests. When you connect your app repository to Bitrise’s mobile CI/CD platform, you automate a portion of your deployment pipeline to reduce the time-to-new-feature iterations, improvements to UI, and more. The pre-made Steps and Workflows can help you to inject accessibility and UI testing into your CI/CD pipeline earlier and more often.

Happy building! 🌈

For more resources and information about how to support LGBTQIA+ rights and activism, see here:

Get Started for free

Start building now, choose a plan later.

Sign Up

Get started for free

Start building now, choose a plan later.