Animazione dalle interazioni

Silktide ti chiede di verificare che le animazioni di movimento attivate dall'interazione dell'utente — parallasse durante lo scorrimento, trasformazioni al passaggio del mouse, transizioni al clic — possano essere disattivate, a meno che il movimento non sia essenziale. Questo è il criterio di successo 2.3.3 (livello AAA) delle .

Si tratta di una : per decidere se il movimento è essenziale, se esiste un interruttore e se prefers-reduced-motion è configurato correttamente è necessaria una persona che interagisca con la pagina. Silktide mostra il prompt su ogni pagina e una persona lo conferma.

Perché è importante

Il movimento attivato dallo scorrimento, dal passaggio del mouse o dal clic può provocare disturbi vestibolari — vertigini, nausea, emicranie — nelle persone che ne sono sensibili. I sistemi operativi offrono un'impostazione per "ridurre il movimento" proprio per questo motivo. I siti che la ignorano costringono queste persone a sopportare il movimento o ad abbandonare la pagina.

Questo è diverso da Mettere in pausa, interrompere, nascondere (2.2.2), che riguarda le animazioni avviate autonomamente dalla pagina. Il criterio 2.3.3 riguarda le animazioni attivate dall'utente.

Cosa controllare

Interagisci con la pagina: scorri, passa il mouse, porta il focus, fai clic. Nota eventuali movimenti che spostano i contenuti nello spazio (parallasse, elementi che entrano con uno scorrimento, rimbalzi, transizioni con effetto sfoglia-pagina). Le semplici dissolvenze dell'opacità non contano.
Attiva l'impostazione del sistema operativo per ridurre il movimento (oppure simula prefers-reduced-motion: reduce negli Strumenti per sviluppatori del browser) e ripeti il test. I movimenti non essenziali dovrebbero interrompersi.
Se il sito non rispetta la preferenza del sistema operativo, cerca un controllo nella pagina che disattivi le animazioni non essenziali. Verifica che funzioni e che non nasconda contenuti.
I movimenti essenziali per il funzionamento (un indicatore di caricamento, una barra di avanzamento, un'anteprima per la creazione di animazioni) sono esenti: registra questa valutazione quando approvi il risultato.

Come risolvere il problema

È preferibile rispettare prefers-reduced-motion in CSS e JavaScript (tecniche WCAG C39 e SCR40).
In alternativa, fornisci un controllo a livello di sito che disattivi i movimenti non essenziali attivati dall'interazione.
Evita la parallasse e le transizioni spaziali ampie quando sarebbe sufficiente un effetto più semplice.

Se la pagina non presenta movimenti attivati dall'interazione, oppure ogni movimento di questo tipo può essere disattivato (o è essenziale), il risultato.

Come Silktide esegue i controlli

Silktide non può osservare il movimento nel tempo durante una scansione statica, quindi questo controllo mostra un prompt di revisione per ogni pagina, descrivendo cosa verificare. Nessuno strumento diffuso automatizza il criterio 2.3.3: non esiste una regola ACT del W3C per questo criterio e né axe né Siteimprove offrono un controllo a questo scopo.