കളർ ബ്ലൈൻഡ്‌നെസ് കോൺട്രാസ്റ്റ് ചെക്കർ

കളർ ബ്ലൈൻഡ്‌നെസ് കോൺട്രാസ്റ്റ് ചെക്കർ

ഈ കാൽക്കുലേറ്റർ എന്താണ് ചെയ്യുന്നത്

നിങ്ങളുടെ ടെക്സ്റ്റ്, ബാക്ക്ഗ്രൗണ്ട് നിറങ്ങളുടെ ജോടി സാധാരണ കാഴ്ചയ്ക്ക് മാത്രമല്ല, ഏറ്റവും സാധാരണമായ നാല് തരം കളർ വിഷൻ ന്യൂനതകൾക്കും വായിക്കാൻ കഴിയുന്നതാണോ എന്ന് ഇത് പരിശോധിക്കുന്നു: പ്രോട്ടനോപ്പിയ (ചുവപ്പ്-അന്ധത), ഡ്യൂട്ടറനോപ്പിയ (പച്ച-അന്ധത), ട്രൈറ്റനോപ്പിയ (നീല-അന്ധത), മോണോക്രോമസി (പൂർണ്ണ കളർ ബ്ലൈൻഡ്‌നെസ്). ഏകദേശം 12 പുരുഷന്മാരിൽ ഒരാൾക്കും 200 സ്ത്രീകളിൽ ഒരാൾക്കും ഏതെങ്കിലും തരത്തിലുള്ള കളർ വിഷൻ ന്യൂനത ഉണ്ട്, അതിനാൽ നിങ്ങൾക്ക് ഉയർന്ന കോൺട്രാസ്റ്റായി തോന്നുന്ന ഒരു നിറ ജോടി നിങ്ങളുടെ സന്ദർശകരിൽ ഗണ്യമായ ഒരു ഭാഗത്തിന് ഏതാണ്ട് ഒരേ ഷേഡുകളായി മാറാം. സാധാരണ കോൺട്രാസ്റ്റ് ചെക്കറുകൾ നിങ്ങൾ നൽകിയ നിറങ്ങൾ മാത്രമേ പരിശോധിക്കൂ — ഈ ടൂൾ ആ നിറങ്ങൾ ഓരോ അവസ്ഥയിലും എങ്ങനെ കാണപ്പെടുന്നു എന്നും അനുകരിച്ച്, ഓരോ സാഹചര്യത്തിനും WCAG കോൺട്രാസ്റ്റ് വീണ്ടും പരിശോധിക്കുന്നു.

സിമുലേഷൻ എങ്ങനെ പ്രവർത്തിക്കുന്നു

ഓരോ കളർ വിഷൻ ന്യൂനതയും, നിങ്ങളുടെ ടെക്സ്റ്റ്, ബാക്ക്ഗ്രൗണ്ട് നിറങ്ങളുടെ sRGB മൂല്യങ്ങളെ, ആ അവസ്ഥ നിറ സിഗ്നലിനെ എങ്ങനെ ചുരുക്കുന്നു എന്ന് ഏകദേശം കാണിക്കുന്ന ഒരു നിശ്ചിത മാട്രിക്സ് വഴി മാറ്റി അനുകരിക്കപ്പെടുന്നു:

$$\begin{bmatrix} R' \\ G' \\ B' \end{bmatrix} = M_{\text{deficiency}} \times \begin{bmatrix} R \\ G \\ B \end{bmatrix}$$

പൂർണ്ണമായും കളർ ബ്ലൈൻഡ് ആയ ഒരാൾ തെളിച്ചത്തിന്റെ കോൺട്രാസ്റ്റിനെ മാത്രം ആശ്രയിക്കുന്നതിനാൽ, മോണോക്രോമസി രണ്ട് നിറങ്ങളെയും അവയുടെ പെർസെപ്ച്വൽ ല്യൂമിനൻസ് (ഗ്രേസ്കെയിൽ) ആക്കി മാറ്റി അനുകരിക്കുന്നു:

$$Y = 0.299R + 0.587G + 0.114B$$

കോൺട്രാസ്റ്റ് അനുപാതവും WCAG പരിധികളും

യഥാർത്ഥ നിറങ്ങൾക്കും ഓരോ അനുകരിച്ച വകഭേദത്തിനും, സാധാരണ WCAG ആപേക്ഷിക ല്യൂമിനൻസ് ഫോർമുല ഉപയോഗിച്ച് കോൺട്രാസ്റ്റ് കണക്കാക്കുന്നു:

$$L = 0.2126 R_{\text{lin}} + 0.7152 G_{\text{lin}} + 0.0722 B_{\text{lin}}$$ $$\text{Contrast Ratio} = \frac{L_{\text{lighter}} + 0.05}{L_{\text{darker}} + 0.05}$$

ഈ അനുപാതം പിന്നീട് നിങ്ങൾ തിരഞ്ഞെടുത്ത ടെക്സ്റ്റ് സൈസിനുള്ള WCAG 2.1 പരിധികൾക്കെതിരെ പരിശോധിക്കുന്നു:

ടെക്സ്റ്റ് സൈസ്	AA (കുറഞ്ഞത്)	AAA (മെച്ചപ്പെടുത്തിയത്)
സാധാരണ ടെക്സ്റ്റ്	4.5 : 1	7 : 1
വലിയ ടെക്സ്റ്റ് (18pt+/24px+, അല്ലെങ്കിൽ ബോൾഡ് 14pt+/18.66px+)	3 : 1	4.5 : 1

ഇത് എങ്ങനെ ഉപയോഗിക്കാം

1. നിങ്ങളുടെ ടെക്സ്റ്റ് നിറവും ബാക്ക്ഗ്രൗണ്ട് നിറവും തിരഞ്ഞെടുക്കുക.
2. ഈ ജോടി ഉപയോഗിക്കുന്ന ടെക്സ്റ്റ് സൈസ് വിഭാഗം തിരഞ്ഞെടുക്കുക.
3. സമർപ്പിച്ച്, സാധാരണ കാഴ്ചയ്ക്കും നാല് ന്യൂനത തരങ്ങൾക്കുമുള്ള മൊത്തത്തിലുള്ള ഫലം, അനുകരിച്ച നിറങ്ങളും കോൺട്രാസ്റ്റ് അനുപാത വിശദാംശങ്ങളും, WCAG AA-യ്ക്കുള്ള വേഗത്തിലുള്ള പാസ്/ഫെയിൽ ചെക്ക്‌ലിസ്റ്റും കാണുക.

ഉദാഹരണം

#FFFFFF ബാക്ക്ഗ്രൗണ്ടിൽ #1A73E8 (സാധാരണ "ലിങ്ക് ബ്ലൂ") ടെക്സ്റ്റ്, സാധാരണ കാഴ്ചയിൽ സാധാരണ ടെക്സ്റ്റിന് WCAG AA പാസാകുന്നു, എന്നാൽ ഡ്യൂട്ടറനോപ്പിയയിൽ ഈ നീല നിറം ചാരനിറത്തിലേക്ക് മാറി, വെള്ളയിൽ നിന്ന് വേണ്ടത്ര ല്യൂമിനൻസ് വ്യത്യാസം നഷ്ടപ്പെടുന്നു, ഇത് ഫലപ്രദമായ കോൺട്രാസ്റ്റ് അനുപാതം കുറയ്ക്കുന്നു — ഫോമിന് താഴെയുള്ള പട്ടിക ഇത് കൃത്യമായി എത്രത്തോളം എന്ന് കാണിക്കുന്നു, അതിനാൽ ഷിപ്പ് ചെയ്യുന്നതിന് മുമ്പ് നീല കടുപ്പിക്കണോ അതോ ഫോണ്ട് സൈസ് കൂട്ടണോ എന്ന് നിങ്ങൾക്ക് തീരുമാനിക്കാം.

കുറിപ്പുകൾ

• ഈ ടൂൾ ജന്മനായുള്ള കളർ വിഷൻ ന്യൂനതകളെ നന്നായി സ്ഥാപിതമായ approximation മാട്രിക്സുകൾ ഉപയോഗിച്ച് അനുകരിക്കുന്നു; വ്യക്തിഗത ധാരണ വ്യത്യാസപ്പെടാം, സാധ്യമായിടത്ത് യഥാർത്ഥ ഉപയോക്താക്കളുമായുള്ള പരിശോധനയ്ക്ക് പകരമല്ല ഈ സിമുലേഷൻ.
• ഒരു ന്യൂനത തരത്തിൽ മാത്രം പരാജയപ്പെടുന്ന നിറ ജോടിയും ശരിയാക്കുന്നത് മൂല്യവത്താണ് — ഡ്യൂട്ടറനോപ്പിയ മാത്രം ലോക ജനസംഖ്യയിലെ ഏകദേശം 1% പേരെ ബാധിക്കുന്നു, മറ്റ് പല ആക്സസിബിലിറ്റി മാർഗ്ഗനിർദ്ദേശങ്ങളും അഭിസംബോധന ചെയ്യുന്ന വൈകല്യങ്ങളേക്കാൾ കൂടുതലാണിത്.
• പട്ടികയിലെ എല്ലാ വരികളും AA പാസായാൽ, ആ ജോടി ആ ടെക്സ്റ്റ് സൈസിൽ കളർ-ബ്ലൈൻഡ് വായനക്കാർക്ക് ഷിപ്പ് ചെയ്യാൻ സുരക്ഷിതമാണ്; എല്ലായിടത്തും AAA പാസാകുന്നത് കാഴ്ചക്കുറവുള്ള ഉപയോക്താക്കൾക്കും അധിക സൗകര്യം നൽകുന്നു.