To test the color palette, I first write some text on them. Yet, you can still build an accessible website with yellow, like, let’s say, mine □ I admit I chose orange and yellow for the sake of the exercise since those two can be tricky sometimes when it comes to contrast. I added an anthracite color and a yellow one. I chose a palette based on a vibrant orange and used a complementary green one. Using the CCA color picker to get the color directly from my Photoshop picker Testing the palette If you prefer online tools you can use this one or this one. It provides a color picker I can use anywhere on my screen to test the contrast between a foreground and background color. The tool is a standalone application that you have to launch. This tool which is available for Windows and Mac. Note that an AA accessibility grade can be mandatory sometimes when working with government sites for example.įor the tests I’m using the “ Color Contrast Analyser”. I will take a special interest in the first one: AA. They are 4 levels of contrast: WCAG 2 AA Compliant for normal text and text above 18px and WCAG 2 AAA Compliant for normal text. If you want to understand how contrast is measured you might want to read Calculating Color Contrast. To know if a color combination is accessible, we measure the contrast between the foreground color (usually the text but it could be icons) and the background color. After all, technical constraints are part of a designer’s job too. But that does not mean that you can’t get creative. Or at least you will have to be careful with some of them. I won’t lie to you: yes, you might not be able to use exactly all the colors you want. In this article, I will present you two tools and some quick tips to easily create an accessible color palette for your designs. Everybody struggles at some point with issues linked to lack of contrast in interfaces and websites, color blind or not. Let’s be clear from the start: color contrast will concern every one of you users. Some people think that color accessibility is “only for people with some sort of color blindness disease” so it does not concern their target audience. Some are afraid that color accessibility will limit the color palette they will be allowed to use and so their creativity. Color contrast and color accessibility scares a lot of designers too. It will help users read your text and get a clear understanding of your content. Color contrast is something really important in Design.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |