Estrutura
Não trave a página em uma orientação
- Regra:
css-orientation-lock - Gravidade: Grave
- Nível WCAG AA
Por que isso importa
Um aparelho montado numa cadeira de rodas fica fixo em uma orientação. Uma página que gira o próprio conteúdo de volta, ou o esconde em retrato, se torna inutilizável a partir dessa cadeira.
Como corrigir
- Remova transformações e regras de exibição que desfazem a orientação do aparelho.
- Deixe o layout refluir nas duas orientações.
- Trave a orientação apenas quando ela for essencial ao conteúdo, como um teclado de piano.
Na marcação
@media (orientation: portrait) {
.page { transform: rotate(90deg); }
}/* Let the page reflow; do not rotate it back. */
.page { max-width: 100%; }A exigência por trás disso
Esta regra é uma das formas de falhar nos seguintes critérios de sucesso das WCAG 2.2. O W3C, que publica a norma, explica cada um deles:
- 1.3.4 Orientação (abre em nova aba) — Nível WCAG AA
Para aprofundar
Deque University sobre css-orientation-lock (abre em nova aba)
A Deque mantém o axe-core, o motor de código aberto que o nosso scanner executa. A página deles documenta a regra como o motor a implementa.
Verificações automáticas encontram falhas que o navegador consegue comprovar. Elas não julgam se uma legenda está correta, se um texto alternativo é útil, nem se a página pode ser operada de ponta a ponta pelo teclado — isso exige uma pessoa.