When it comes to design, colour is a powerful tool in your digital toolbox. It allows us to evoke emotions and establish brand identities. Just pause for a second and think about a brand you love – we’re willing to put money on its brand colours being one of the first things to pop into your head! That’s the power of colour.
However, not everyone can view colour in the same way, and this brings up a whole host of accessibility challenges. Approximately 8% of men and 0.5% of women worldwide experience some form of colour blindness. That’s around 300 million people with colour blindness; to give you an idea of scale, that’s almost the same number of people as the entire population of the USA!
Designing with colour blindness in mind not only ensures inclusivity but also ensures everyone has the best user experience possible…and you can wow more people with your creative vision. Win, win, right?!
So, how can we make sure everyone gets to enjoy and access your designs? We’ve got all the tips and tricks you need right here, so without further ado, let’s get started!
Let’s talk contrast
So, this is going to be a bit of an obvious one, but the obvious stuff we can easily forget in this increasingly techy world of ours, so consider this your refresher! When designing with colour blindness is mind, one of the key things to consider is, are the colours contrasting enough?
Colours that contrast sufficiently enhance their visibility and legibility for users with colour blindness. It’s recommended to use a combination of light and dark colours, such as black text on a white background or vice versa. This contrast ensures everyone can easily view your designs and your designs can become part of the inclusive wonderland we’re all striving for – nice!
Avoid relying solely on colour
Wait, we’re moving away from colour on a blog about colour? Just hear us out, we promise it’s related! While colour can be a powerful visual element, relying solely on colour to convey information can create those pesky challenges for colour-blind individuals.
To overcome this, incorporate additional visual cues like icons, patterns, or labels to provide clarity. For example, if you’re using colour to indicate different states of a button (e.g., active, inactive, or error), consider adding corresponding icons or labels to differentiate between them.
Handle those colour combinations carefully
There are a few things you need to know when choosing which colours to use as some are more problematic than others. Colour combinations, such as red and green (sorry Gucci, you’re out!), can be particularly challenging for individuals with red-green colour blindness. This is the most common form of colour vision deficiency, affecting around 1 in 12 men and 1 in 200 women.
It’s best to avoid these combinations and instead, opt for colour palettes that offer sufficient contrast. If you’re struggling to know if you’ve made the right choice with your colours, online colour contrast checkers can help you determine if your chosen colours meet accessibility standards. These nifty tools can be really useful so don’t be afraid to use them to help inform your designs!
Size does matter
Size *really* does matter when it comes to font size! In addition to colour choice, ensuring you use an appropriate font size is really important. You can pick the most contrasting colours in the world but if you’re using an itty bitty text how is anyone supposed to read it, let alone those with visual impairments? Whack up that font size and make sure it is accessible to all.
Psst, bonus tip – pick a font that’s easy to read too! The handwriting ones with the swoopy S’s and dramatic T’s may make you feel like you’re having a Bridgerton moment, but they can be a nightmare to read. Stick to the easy-to-read classics and save the fonts with extra razzle dazzle for your personal life.
Use icons and symbols to maximum effect
We’re not drifting away from colour again, we promise! Icons and symbols can be excellent for aiding users in understanding functionality or just providing helpful visual cues.
When designing with colour blindness in mind, ensure that the icons rely on shape and form, rather than colour alone, to convey their meaning. This allows colour-blind users to understand and interact with the interface effectively.
For example, we understand red typically means no and green we usually understand to mean yes. Don’t just stick a red and green (we talked about this earlier!) button on your design and call it a day as this can present major challenges for those living with colour-blindness.
Instead, use icons that we typically understand to mean a certain thing – crosses for no, thumbs up for yes, speaker icons for…well volume adjustment. You get the idea!
Time to call in the experts
It’s pointless to sit there and try to guess whether your designs are accessible for those living with colour blindness. Ensuring you conduct user testing with colour-blind individuals is really just common sense as they can offer firsthand insights and feedback that can provide invaluable guidance.
Observing how users with colour blindness navigate your design and listening to their experiences can help you identify areas that need improvement and make necessary adjustments. Plus, you save time on all the guess work, freeing you up to work on other projects.
Embrace accessibility tools
Embracing accessibility tools, such as colour-blind-friendly modes or customisable options, is a significant step towards creating an inclusive environment. Incorporate colour-blind friendly modes into user interfaces and customisable options like font size, contrast settings and those nifty keyboard shortcuts. This allows users to personalise their experience based on their unique needs and you to reach a wider audience.
By embracing these tools, we can foster a more inclusive digital landscape that values diversity and ensures that everyone can fully participate and engage with technology. Sounds pretty wonderful if you ask us!
Want to ensure your website and/or branding are accessible for all? Contact us today, we’d love to help you make sure your designs are top notch and ready to be appreciated by all!
