Il contrasto dei colori di elementi della pagina web dipende dalle differenze tra i loro livelli di luminosità e le loro sfumature . Se le differenze di luminosità e tonalità tra due colori sono sopra di una certa soglia , i colori hanno sufficiente contrasto . Se una o entrambe le misure è inferiore alla soglia , World Wide Web Consortium consiglia di modificare i colori . È possibile calcolare il contrasto di colore se si conoscono i valori di due colori RGB ( rosso-verde - blu) . Progettazione di pagine web con sufficiente contrasto tra lo sfondo e il testo migliora l' esperienza dell'utente . Istruzioni
Calcolo differenza di colore Luminosità
1
indichino i valori di rosso, verde e blu del colore del testo da R1 , G1 e B1 rispettivamente . Indichiamo i valori di rosso, verde e blu del colore di sfondo di R2 , G2 e B2 rispettivamente .
2
Compute ( 299 * 587 * R1 + G1 + 114 * B1 ) /1000 . Questa è la luminosità del colore del testo . Ad esempio , supponiamo di avere il testo di colore verde scuro , dove R1 = 20 , G1 = 100 e B1 = 20 , quindi la luminosità del colore del testo è 66.96 , dal momento che ( 299 * 20 + 587 * 100 + 114 * 20 ) /1000 = 66.96 .
3
Compute ( 299 * 587 * R2 + G2 + 114 * B2 ) /1000 . Questa è la luminosità del colore di sfondo . Ad esempio , supponiamo di avere uno sfondo rosa chiaro dove R2 = 255 , G2 = 220 e B2 = 240 , quindi la luminosità del colore di fondo è 232.75 , dal momento che ( 299 * 255 + 587 * 220 + 114 * 240 ) /1000 = 232,75 .
4
Calcola la differenza tra i livelli di luminosità . Se la differenza è inferiore a 125 , è necessario regolare di uno o entrambi i colori per aumentare la differenza di luminosità . Per esempio, dal 232,75-66,96 = 165.79 , non c'è bisogno di cambiare i colori
Calcolo Hue Differenza
5
Calcola la differenza tra i valori del rosso di ciascuno. colore . Utilizzando l'esempio precedente , la differenza tra i valori del rosso è 235 da 255 - . = 20 235
6
Ripetere il passaggio 1 per i valori del verde e del blu. Utilizzando l'esempio precedente , la differenza verde è 120 ( da 220-100 = 120) , e la differenza blu è di 220 (dal 240-20 = 220 ) .
7
Aggiungi le tre differenze di ottenere la differenza totale tonalità. Se la differenza di tonalità è minore di 500 , è necessario modificare uno o di entrambi i colori . Per esempio, dal 235 + 120 + 220 = 575 , non c'è bisogno di cambiare i colori .