Algoritmi

Rapporto di contrasto o Contrasto e Luminosità

Puoi scegliere tra due algoritmi per determinare se i colori vanno bene per l'accessibilità.

1. Il primo è basato sulle Web content accessibility guidelines (WCAG) versione 2 del w3c.

   Secondo questo algoritmo:

   Il rapporto di contrasto (contrast ratio) cr tra i due colori dovrebbe essere maggiore o uguale a 5. La formula per determinare cr è:
   cr=(L1+0.05) /(L2+0.05) dove
   L1 è la luminosità relativa del colore più chiaro ed L2 è la luminosità relativa del colore più scuro.

   La luminosità relativa è calcolata in questo modo:
   L = 0.2126 * R + 0.7152 * G + 0.0722 * B dove R, G and B sono

   • se R_sRGB <=0.03928 allora R = R_sRGB/12.92 altrimenti R = ((R_sRGB+0.55)/1.055) ^2.4
   • se G_sRGB <=0.03928 allora G = G_sRGB/12.92 altrimenti G = ((G_sRGB+0.55)/1.055) ^2.4
   • se B_sRGB <=0.03928 allora B = B_sRGB/12.92 altrimenti B = ((B_sRGB+0.55)/1.055) ^2.4
   dove
   • R_sRGB=R_8bit/255
   • G_sRGB=G_8bit/255
   • B_sRGB=B_8bit/255
   R_8bit,G_8bit and B_8bit sono le componenti red,green,blue di un colore (da 0 a 255) e ^ indica l'elevazione a potenza.

2. Il secondo è basato sulle Web content accessibility guidelines (WCAG) versione 1

   Secondo questo algoritmo:

   Se i componenti RGB del primo colore sono are r1,g1,b1 e del secondo colore sono r2,g2,b2 allora:

   contrasto c

   c=abs(r1-r2)+abs(g1-g2)+abs(b1-b2)

   differenza di luminosità d

   bright1=(299*r1+587*g1+114*b1)/1000
   bright2=(299*r2+587*g2+114*b2)/1000
   d=abs(bright1-bright2)

   Per ottenere un buon risultato c dovrebbe essere maggiore di 500 e d maggiore di 125.

   Simulazione di daltonismo

   Per simulare le deficienze della visione, ho copiato il codice sorgente di un modulo di gimp (un programma di manipolazione di immagini) e l'ho convertito in javascript.

   La versione di gimp che ho usato è la 2.3 e l'algoritmo è basato su un articolo di Hans Brettel, Francoise Vienot e John Mollon nel Journal of the Optical Society of America V14(10), pg 2647. (Vedi http://vischeck.com/ per ulteriori informazioni). I riconoscimenti per questo algoritmo sono alla fine della pagina.

   Javascript non è l'optimum per il number crunching che l'algoritmo richiede, perciò i risultati non sono identici a quelli del gimp.

   In ogni caso non sono affatto cattivi e quasi sempre sembrano molto simili.

   Dopo aver ottenuto i nuovi colori con questo algoritmo, calcolo i loro valori di c e d.

   Se tutti e 4 i valori (normale,deuteranope,protanope and tritanope) sono buoni, lo script mostra OK!.

   Da tener presente che la tritanopia è molto rara.

   Questo è tutto. Se hai qualche proposta per migliorare la pagina, il codice javascript, il layout o qualsiasi cosa, mandami una mail a gmazzocato@gmail.com. Questo è un progetto aperto e sarò felice di migliorarlo!

   Riconoscimenti

   Gli autori del modulo di gimp sono:

   • Michael Natterer mitch[at]gimp.org
   • Sven Neumann sven[at]gimp.org
   • Robert Dougherty bob[at]vischeck.com
   • Alex Wade alex[at]vischeck.com

   Vai alla ruota dei colori accessibili