Note: For ease of reading by dyslexic readers, the printed version of this article was laid out using the font Google Lexend. Please download the PDF at the end of this article.
As part of their daily work, educators have to make a range of materials for their classes, such as handouts, worksheets, and rubrics, for instance. Furthermore, if they are serious about their profession, they may also be running professional development sessions or presenting at academic or professional conferences. Therefore, they might also have to make flyers to advertise these events and infographics and slideshows to use during their sessions. However, there are a few areas many teachers seldom consider when making these digital artefacts—one of these being colour blindness, more accurately called colour vision deficiency (CVD). A study by Enchroma (n.d.-a), a company that makes glasses to help people with CVD, found that only 20% of teachers adapt their work to be CVD friendly. Even designers are not immune to ignoring CVD; “Out of the many vision-based disabilities out there, it is the most common behind nearsightedness and farsightedness, it is the most under-reported, and it’s among the least likely to be corrected” (Purcell, 2020, para. 4). With around 8% of men and 0.5% of women having some form of CVD (Berisso, 2018, p. 93) it is likely that some of an educator’s audience that receive their handouts and worksheets and/or look at their slideshows will have some degree of difficulty with the colours used on them if care is not taken with colour selection. Therefore, making these digital artefacts accessible to as many people in the audience as possible is something achievable and worthwhile for educators to aim for.
Research explaining the medical science behind what causes CVD is easy to find (Berisso, 2018; National Eye Institute, 2023; Walraven & Alferdinck, 1997) and while these are worth a read for those interested, a detailed discussion of that aspect of CVD is outwith the scope of this article. In brief, human eyes process colours by using cones in the retinas. There are three types of cones: red, green, and blue. Monochromatism or achromatopsia describes those without or only one type of cone, and this results in colours appearing in black and white. Then there are people with dichromatism who have two cones but are missing one. The cone that is missing will determine the type of CVD they have; people with tritanopia dichromatism (blue cones missing) cannot see blue colours, people with deuteranopia dichromatism (green cone missing like this author) cannot see green colours, and people with protanopia dichromatism (red cone missing) cannot see red colours. Lastly, there is another type of CVD called anomalous trichromacy. This is where people have all three cones but one or more does not work properly, and again this results in some colours being difficult to see, such as in the case of dichromatism above. Far and away the most common type of CVD is the red and green types of dichromatism and anomalous trichromacy, with about 99% of those with CVD having some form of red-green deficiency.
Therefore, to address the needs of these CVD people some basic guidelines and practices to follow for making educator-created materials more accessible to those with CVD are necessary. Greater accessibility can be achieved through the usage of greyscale or monochrome shades instead of colours, as this is the most helpful approach, especially for those who only see in black and white. This can also be accomplished by using light and dark contrasts between two different primary hue colours as well as shadings and shapes (if more than two colours are needed). Here CVD simulators can also help open educators’ eyes (pun intended) to these problems by showing how the world looks to those with CVD, and how they do not always perceive subtle contrasts between colours. Specifically in regard to contrast, this article also highlights a browser-based tool called Snook that is very useful in terms of checking the contrast ratios and their suitability for people with CVD.
CVD Guidelines
For all people with CVD, the biggest issue with colours is the lack of contrast between different colours. On a normal text page, the page is white, and the text is black or dark grey usually. This creates a high contrast ratio and is easy for all types of CVD people to read as non-CVD people do. However, on books, handouts, flyers, and slideshows, it is common for educators to use colours for backgrounds and visual effects, but with little to no consideration for how the end product will look to those with CVD. For example, Figure 1 shows how CVD people see images depending on the type of CVD they have.
Figure 1
How Colours Look to People With Normal Vision and Green, Red, and Monochrome CVD People
Note. Image usage courtesy of Enchroma (n.d-b). For readers viewing this in the paper version of JALT’s TLT Wired column the images will only be in black and white, so use this QR code to see the full colour version of the image.
As there is a lack of awareness of how CVD people see things, this is where the Snook tool is useful. Snook is a browser-based tool that allows non-CVD people to create digital artefacts that are suitable for viewing by CVD people. On any digital application (documents, slideshows, and websites for example) users can choose from a colour palette, and each different colour has a different digital code number to represent that colour. The numbers for these text and background colours can then be copied and pasted into Snook, and it will check the contrast ratios to see if the combination is suitable for people with CVD. It does this by comparing the contrast ratios with the guidelines set in the latest version of the Web Content Accessibility Guidelines (WCAG). The WCAG checks websites for a range of accessibility issues, such as ALT text and non-text alternatives. However, for the purposes of this paper, only CVD issues are discussed. Though the WCAG CVD guidelines are for websites, they are also applicable to handouts, slides, and other teacher-created digital materials. When digital code numbers are input into Snook, it generates a report (Figure 2).
Figure 2
Initial Snook Report With Problematic Colour Pairings for CVD People
Note. For readers viewing this in the paper version of JALT’s TLT Wired column the images will only be in black and white, so use this QR code to see the full colour version of the image.
WCAG suggests a contrast ratio of above 4.5, and here the ratio is 9.321 so that part is fine; hence the WCAG result being “YES”. However, contrast is not the only issue as the Brightness Difference and Colour Difference indicators are also important for CVD accessibility. Here, both of the numbers reported by Snook are lower than the recommended numbers. Users can adjust the sliders of either or both of the text and background colours to achieve a “YES” result (see Figure 3 where the sliders on both have been adjusted).
Figure 3
Snook Report After CVD Adjustments Made for Greater Accessibility
Note. For readers viewing this in the paper version of JALT’s TLT Wired column the images will only be in black and white, so use this QR code to see the full colour version of the image.
The digital code numbers for these acceptable colour pairings can then be copied and pasted back into the original digital artefact to create items suitable for people with CVD. This is especially useful for those educators using design apps like Canva or desktop publishing apps, as while the template designs on these types of apps are great from a design perspective, they do not always use CVD-friendly contrast ratios. Snook works well with these types of apps to create great artefacts that are also very accessible to those with CVD.
Besides colour pairing, there are other methods that can be employed (Bigman, 2013; Nuñez et al., 2018). One method is the use of CVD-friendly palettes (i.e., using primary pairings not connected to CVD), such as avoiding green and red, green and brown, blue and purple, green and blue, light green and yellow, blue and grey, green and grey, and green and black pairings. However, if colour pairings from the list above must be used then use of light and dark hues can be used to differentiate them. Other approaches involve either using varying line thicknesses and/or broken lines, instead of just colours for line charts, graphs, shading, or shapes (See Figure 4).
Figure 4
A Chart With Shapes as Well as Colours
Note. The top left is normal vision, the top right is red CVD (red cone missing), the bottom left is green CVD (green cone missing) and the bottom right is blue CVD (blue cone missing [Kilin, 2022]). Image usage courtesy of Ivan Kilin. For readers viewing this in the paper version of JALT’s TLT Wired column the images will only be in black and white, so use this QR code to see the full colour version of the image.
Furthermore, the use of alternating saturation in colours can help, as coloured artefacts can be converted into greyscale to see if the difference is visible to non-CVD people. If so, then the colours used will likely be different enough for CVD people to see in greyscale (see Figure 5).
Therefore, appropriately using saturation, and the other methods mentioned above can help produce CVD-friendly designs, and educators should consider these when making digital artefacts for their teaching.
Figure 5
Differences Between All High and Alternating High and Low Saturation Colours When Converted to Greyscale
Note. Image Image usage courtesy of Jenny Elaine Purcell (2020). For readers viewing this in the paper version of JALT’s TLT Wired column, the images will only be in black and white, so use this QR code to see the full colour version of the image.
Conclusion
In the words of the immortal Stan Lee, “With great power comes great responsibility” (Lee et al., 1962). Therefore, in the modern world with the plethora of educational technology apps and tools available to educators, great power is certainly available! However, educators have an equally great responsibility to make sure that they use that power in an ethical way that does not exclude anyone from fully being able to access the digital artefacts they create for their teaching. Paying attention to CVD-friendly designs when creating is one way to make their creations accessible to all!
References
Berisso, K. (2018). Addressing color blind awareness in the classroom. Journal of Business and Management Sciences, 6(3), 93–99. https://doi.org/10.12691/jbms-6-3-5
Bigman, A. (2013, April 17). Why all designers need to understand color blindness. 99designs. https://99designs.com/blog/tips/designers-need-to-understand-colorblindn...
EnChroma. (n.d.-a). EnChroma and UNC’s Department of Health Sciences team to help color blind students address challenges to learning on campus. https://enchroma.com/pages/enchroma-and-uncs-department-of-health-scienc...
EnChroma. (n.d.-b). What do color blind people see? https://enchroma.com/blogs/beyond-color/how-color-blind-see
Kilin, I. (2022, April 27). The best charts for color blind viewers. Datylon. https://www.datylon.com/blog/data-visualization-for-colorblind-readers
Lee, S., Kirby, J., & Ditko, S. (1962). Amazing Fantasy #15. Marvel.
National Eye Institute. (2023, August 7). Causes of color vision deficiency. https://www.nei.nih.gov/learn-about-eye-health/eye-conditions-and-diseas...
Nuñez, J. R., Anderton, C. R., & Renslow, R. S. (2018). Optimizing colormaps with consideration for color vision deficiency to enable accurate interpretation of scientific data. PLoS ONE, 13(7), 1–14. https://doi.org/10.1371/journal.pone.0199239
Purcell, J. E. (2020, September 20). A colorblind person’s guide to using color. Medium. https://uxdesign.cc/a-colorblind-persons-guide-to-using-color-acb79e0d27...
Walraven, J., & Alferdinck, J. W. (1997). Color displays for the color blind. The Fifth Color and Imaging Conference: Color Science, 5, 17–22. https://library.imaging.org/cic/articles/5/1/