2012-04-10 6 views
7

Qualcuno può spiegare cosa succede ai CSS in modalità ad alto contrasto?Che cosa succede in realtà ai CSS nella modalità ad alto contrasto?

http://hardlikesoftware.com/weblog/2009/11/04/css-sprites-vs-high-contrast-mode/

In modalità ad alto contrasto tutte le immagini di sfondo e colori vengono ignorati - sostituito con colori ad alto contrasto come il bianco su nero o nero su bianco . L'altro problema è che le immagini di sfondo non sono sempre stampate.

C'è qualcosa di più di questo?

login form in high contrast mode

ho form di login che sembra non ottimale e sto cercando di indagare.

Fino a poco tempo fa c'erano https://www.google.com/search?q=axs+aol+accesibility+library ma non sembra esistere più.

In generale vedo lì due approcci:

  1. Detect HCM (modalità ad alto contrasto) e regolare CSS di conseguenza
  2. Realizzato CSS più generico di lasciarlo lavorare in ogni modalità

In entrambi i caso mi piacerebbe davvero sapere cosa succede in modalità ad alto contrasto in termini di modifiche al CSS.

Google.com in various browsers

Come si vede il comportamento varia in modo vostra perizia sarà apprezzato.

risposta

6

Hai definito i colori sia per il testo che per lo sfondo per i tuoi elementi del modulo?

Ecco una criteri pertinenti da elenco di riferimento AccessiWeb 2.1: On each Web page, are CSS declarations for colours for element background and fonts used properly? (livello argento è uguale a WCAG 2.0 AA)
Rilevante WCAG Tecnica 2.0 Il fallimento è F24: specifying foreground colors without specifying background colors or vice versa

Un recente post WebAIM su modalità di contrasto: http://webaim.org/blog/high-contrast/

Chi la home page di Google: Google è noto per lo sniffing del browser e le pagine fortemente modificate a seconda del browser, registrati sui loro servizi o meno, attivati ​​o meno. Userà anche il protocollo SPDY invece di HTTP (sebbene ciò non cambi il contenuto ricevuto dal browser di per sé).
Non prenderei in considerazione le pagine da questa azienda per i confronti tra i browser;)

3
@media screen and (-ms-high-contrast: active) { 
    /* put your styling rules here */ 
} 

Lavori in IE e MS Edge. Testato su Windows 10.

Chrome non sa se Windows 10 è in modalità ad alto contrasto.

3

Se si sta implementando un contrasto elevato nell'applicazione Web, utilizzare il seguente blocco di codice per la selezione del contrasto nero su bianco e bianco su nero. Questo funzionerà bene in IE.

@media screen and (-ms-high-contrast: black-on-white) { 
       /* 
       Put your styling code............. 
       */ 

      } 
@media screen and (-ms-high-contrast: white-on-black) { 
       /* 
       Put your styling code............. 
       */ 

      } 
Problemi correlati