index.rst (4085B)
1 ======================= 2 Color vision simulation 3 ======================= 4 5 The simulator in the :doc:`Accessibility Inspector <../index>` in Firefox Developer Tools lets you see what a web page would look like to users with various forms of *color vision deficiency* (better known as "color blindness"), as well as *contrast sensitivity loss*. 6 7 "Color blindness" is a bit of a misnomer, since most people with these disorders can see colors, but do not see all of the distinctions that people with normal color vision can see; color vision deficiencies affect perception across the color spectrum, not only of specific colors like red or green. Color vision deficiencies affect about 8% of men, and 0.5% of women. The most common forms of color blindness (commonly lumped together as "red-green color blindness") affect more men than women, because they are due to a mutation in a gene in the X chromosome, which men usually have only one copy of. 8 9 Contrast sensitivity loss can be caused by cataracts, glaucoma, diabetic retinopathy, and other disorders of the retina; it can be age-related, congenital, or due to an injury. 10 11 .. note:: 12 13 This feature depends on webrender, an experimental featurethat is not enabled by default on all platforms. You can force-enablewebrender by settingthe preference ``gfx.webrender.all`` to ``true`` using the `Firefox Configuration Editor <https://support.mozilla.org/en-US/kb/about-config-editor-firefox>`_ (note that if webrender is enabled by default on your platform, the setting has no effect. 14 15 16 The current color simulation option may be selected from the **Simulate** menu as shown. 17 18 .. image:: accessibily_color_simulation_menu.jpg 19 :alt: Simulate menu in Accessibility panel. Used for selecting the simulation mode: None, Protanopia (no red), Deuteranopia (no green), Tritanopia (no blue), Achromatopsia (no color), Contrast loss 20 :class: center 21 22 23 The following table shows a colorful image of a cat's face, and what it looks like in the each of the simulations. 24 25 .. |image1| image:: 28369550088_617db0d6f2_m.jpg 26 :alt: Colorful image of a cat's face, without modification 27 28 .. |image2| image:: colorcat_protanopia.png 29 :alt: Colorful image of a cat's face, with protanopia simulation 30 31 .. |image3| image:: colorcat_deuteranopia.png 32 :alt: Colorful image of a cat's face, with deuteranopia simulation 33 34 .. |image4| image:: colorcat_tritanopia.png 35 :alt: Colorful image of a cat's face, with tritanopia simulation 36 37 .. |image5| image:: colorcat_achromatopsia.png 38 :alt: Colorful image of a cat's face, with achromatopsia simulation 39 40 .. |image6| image:: colorcat_contrastloss.png 41 :alt: Colorful image of a cat's face, with contrast loss simulation 42 43 44 .. list-table:: 45 :widths: 50 50 46 :header-rows: 1 47 48 * - Simulation 49 - Image displayed 50 51 * - None (Choose this to return to normal display) 52 - |image1| 53 54 * - Protanopia (no red) 55 - |image2| 56 57 * - Deuteranopia (no green) 58 - |image3| 59 60 * - Tritanopia (no blue) 61 - |image4| 62 63 * - Achromatopsia (no color) 64 - |image5| 65 66 * - Contrast loss 67 - |image6| 68 69 70 .. note:: 71 72 The simulation transformation matrices are based on the paper: `A Physiologically-based Model for Simulation of Color Vision Deficiency <https://www.inf.ufrgs.br/~oliveira/pubs_files/CVD_Simulation/CVD_Simulation.html>`_, Gustavo M. Machado, Manuel M. OliveiraLeandro A. F. Fernandes, IEEE Transactions on Visualization and Computer Graphics, Volume 15 (2009). 73 74 75 See also 76 ******** 77 78 79 - `Types of color blindness <https://www.color-blindness.com/types-of-color-blindness/>`_ 80 - `Color blindness simulator <https://www.color-blindness.com/coblis-color-blindness-simulator/>`_ 81 - `Contrast sensitivity <http://www.vision-and-eye-health.com/contrast-sensitivity.html>`_ 82 - `Color palettes for color blindness <http://mkweb.bcgsc.ca/colorblind/>`_ 83 - `Color universal design <https://jfly.uni-koeln.de/color/>`_ 84 - `WCAG success criterion 1.4.1: Use of color <https://www.w3.org/TR/WCAG21/#use-of-color>`_ 85 - `WCAG success criterion 1.4.11: Non-text contrast <https://www.w3.org/TR/WCAG21/#non-text-contrast>`_