Pausar, parar e ocultar conteúdo em movimento automático

Se o conteúdo se mover sozinho, o usuário precisará de uma saída. A WCAG chama isso de pausar, parar ou ocultar conteúdo que se move automaticamente. ⏸️

Pense em carrosséis, apresentações que avançam automaticamente, letreiros rolantes e vídeos de fundo em loop. Qualquer elemento que seja animado sem uma ação do usuário se enquadra nessa categoria.

O critério se aplica a movimentos que duram mais de cinco segundos e são executados junto com outro conteúdo. Uma breve animação de introdução é uma exceção.

Conteúdo em movimento rouba a atenção e pode ser impossível de ler para usuários com sensibilidades cognitivas ou ao movimento. O controle devolve a página ao usuário.

A solução mais simples é um botão real de pausa. Permita que os usuários congelem um carrossel para terminar de ler um slide tranquilamente.

A pausa pode ser retomada; parar encerra o movimento de vez. Qualquer uma das opções atende à regra, desde que o usuário esteja realmente no controle.

Às vezes, permitir que os usuários ocultem completamente o elemento em movimento é o melhor. Um controle para dispensar um letreiro remove a distração de imediato.

Um carrossel também deve pausar quando o usuário passa o cursor sobre ele ou navega até ele com Tab, para que ler ou interagir nunca entre em conflito com o avanço automático.

O próprio botão de pausa deve ser acessível pelo teclado e ter um rótulo claro. Um controle que ninguém consegue encontrar não conta.

Melhor ainda: não reproduza automaticamente o conteúdo para usuários que reduzem o movimento. Combine a verificação da preferência com um controle de pausa visível.

Na verdade, muitos carrosséis funcionam melhor sem avanço automático. Permita que os usuários avancem no próprio ritmo e o problema desaparece.

Conteúdo que se move automaticamente precisa de uma opção de pausar, parar ou ocultar controlada pelo usuário. Torne-a acessível pelo teclado e ignore a reprodução automática quando o movimento estiver reduzido. ✅