Inclusivity and Accessibility in UI/UX Design

Tuesday, September 28, 2021


As designers, especially those in the UX/UI realm we know the importance of creating with a brands target audience in mind. We create personas and pour details into what we know would meld well with the ideal customer. Every decision is made with that user in mind, but what about the users that don’t fit that mold?


If you are designing a digital experience that excludes groups of people, it’s likely going to marginalize your consumer base. While it is important to make sure the design appeals to your ideal consumer, engagement is also important and limiting the number of people who can access your work can hurt your numbers as well.


Here’s a 3 things to consider when creating a website, app, or other digital experience.


1. Gender Inclusivity


Today gender expression is a fluid construct, we no long live in a binary world, so we should be sure our designs reflect that.


Color Choice

Keep in mind what colors you choose will have an impact on how users will interpret the brand. Leaning too far into the stereotypically gendered colors may drive away potential users.


Onboarding or Registration Questions

Most apps require some form of registration and/or onboarding question to collect data about their users. Many times, this include questions related to gender. While at times it may be necessary for platforms tied to Health Information to ask gender related questions, most times the question can be shipped completely to avoid any friction. In times when gender specific data is necessary, consider leaving it as a text field instead of giving options in a selection dropdown, or including extensive options like “transgender”, “intersex”, “non-binary”, and “prefer not to say”. Avoid including an “other” option because it inherently makes someone feel like they do not belong.  


If you must ask for a user’s gender, consider also asking for their gender identity as well. That way if someone doesn’t feel their assigned gender represents them correctly, they have the space to make it known.


Legal Name vs Nickname

Similarly to gender specific questions, you can alienate some users by requiring they enter their legal name. Apps related to health or money that require sensitive information may require someone enter a name that was given at birth for legal purposes, but that name could cause a painful experience for them if you use it throughout the platform or in your communication efforts.


For example, imagine someone’s given name was Matt, but they are in the process of transitioning and now prefer to be called Martha. Every time they read an email addressed to Matt from your brand or see their legal name on the dashboard of your app, it could be a triggering experience. Consider adding a field for users to enter their preferred name, when a legal name is required.



2. Accessibility for Visually Impaired


There are many other factors that are involved in inclusive design like taking in considerate of possible user disabilities like color blindness, visually impaired users, and potential issues with sizing for older generations with deteriorating eyesight.


Contrast Compliance

Using high contrasting colors and patterns is a simple, yet effective way to make sure your designs are accessibility to visual impaired users. The better contrast, the easier the readably of content, especially text. Making sure your content is legible is key to user engagement, this will also help improve analytics in website design as well. If you are wondering if your colors are compliance to accessibility guidelines you can use tools like https://webaim.org/resources/contrastchecker/ to easily check contrasting colors.

Magnification Ability

While it is important to use fonts and graphic styles that are a good size for readability of all users, it’s not always possible to create large enough graphics for older users. Consider including the ability for users to magnify content. This is already possible in most browser platforms like Google and Safari, but don’t forget how valuable a tool like this can be for older users in mobile apps as well.


Non-Text Descriptors (Like Images or Icons)

Be sure to always include alternative text for things like images and icons. If a blind user is accessing your content from a screen-reader including descriptive captions can help you be sure that everyone can enjoy your imagery, not just those who can see it.



3. Accessibly for HOH, Deaf, and Speakers of Other Languages.


Hard of hearing, deaf, and non-native speakers may also be viewing your work so don’t leave them out either.


Closed Captions

If your platform includes any video element, it’s important to include a closed caption option to give users the option to access it without sound. This is helpful not only for HOH, and Deaf users but also for users who don’t have access to sound on their device, or even just don’t want to have the sounds on.


Language Settings

Depending on the demographic you are trying to reach, you may have designed with the intention of users only needing one language. But if you intend on expanding your reach to users outside of your targeted language speakers consider a setting to change the language. This is not something many people consider, but if you want your website or app to be displayed in multiple languages the text formatting will have to be flexible to fit varying character widths, and work with languages that are read both left to right like English and Spanish, and right to left like Arabic and Hebrew.

Being inclusive in design doesn’t have to be complicated. While there are many things to consider the most important thing to remember is everyone has a different perspective and challenge. What you don’t think twice about, maybe cause issue for users with a different experience than you. Always include people with diverse backgrounds in the design, review processes and remember to be empathetic in your practices. Inclusion of empathy in design is key to creating a successfully digital design.


Interested in chatting more with us about UI/UX design? Contact us at info@irisdesigncollaborative.com.


Posted on:

September 28, 2021

in

Design

category

Ready to scale and grow your business?

Schedule a Call
latest post

The blog

Tech Founders: How to Find Your Product-Market Fit

Everyone who has a great idea should go through some research and validation because you want to make sure you're building a solution to a problem that people actually have! So, let's walkthrough the steps in doing some research and discovery.

Articles
Go to Link
Read more

Hiring a Design Agency vs. an In-House Designer

We know hiring a designer for your app or software is a long-term investment. You want someone who will be there for you through and through! So, how do you find the best fit for you that meets all of your needs? You can go through a hiring process to find someone (which typically takes 1-3 months and then another 1-3 months for them to get acquainted), or you can hire an agency on a rolling month-to-month basis.

Articles
Go to Link
Read more

5 Questions to Ask Yourself When Creating a Meaningful and Impactful App

Have you ever had an experience with an app where you’re like “Oh wow! That is so cool?” It’s these amazing moments that change lives and behaviors. So, how do you cultivate these moments in your app and create a platform that everyone loves to use and come back to?

Articles
Go to Link
Read more

How Founders Save Time and Money in App Development

If you’re a founder, CEO or manager of any online platform, then you know this sentence all too well “it’ll be simple, just one extra screen!” — I have a truth bomb for you, it never is just ONE extra screen! So, how do you figure out if the new feature idea you have is actually in fact SIMPLE or DIFFICULT?

Articles
Go to Link
Read more

Avoid the #1 Mistake That Founder Make: Starting Development Before Design

Think of UI/UX designers as the architects of the building — they say what goes where and they provide a blueprint. Developers and engineering are the construction of the home. Remember, both experts have points of view in different areas, so it’s important to weigh these and do what is ultimately best for your business.

Articles
Go to Link
Read more

How to Make Your Website or App Stand Out with Color

There’s a ton of different ways to make your website or app standout — but one of the biggest (and most obvious ways) is through your branding.‍ This is why picking your color palette is one of the first and biggest things you can do to standout when you’re starting out.

Articles
Go to Link
Read more
The Blog