Orientação de exibição
O que a norma pede
O conteúdo funciona tanto na orientação retrato quanto na paisagem, salvo quando uma orientação específica é essencial.
Formas de atender
Basta uma delas. A primeira é a preferida; as demais são alternativas para exceções.
- Uma forma de atender: o conteúdo não se restringe a uma única orientação.
- Exceção: a orientação específica é essencial, como num cheque bancário virtual ou num piano.
- 1.3.4 (AA)
Parecido na NBR 17060
A NBR 17060 trata de aplicativos. Se o seu serviço também tem app, veja o que a Bússola da NBR 17060 diz sobre o mesmo assunto:
Visões por perfil
Escolha um perfil para ver o que o requisito pede de quem ocupa esse papel:
Desenhe as telas para retrato e para paisagem e não peça para girar o aparelho, a menos que seja essencial. Há quem use o celular fixado na cadeira de rodas, sem poder girá-lo.
Visualizar o documento digital
A carteira digital aparece no site pelo celular.
Errado: Exige girar
No protótipo
“Gire o celular para ver o documento.” (retrato bloqueado)
Quem não gira o aparelho não vê o documento.
Certo: Funciona nas duas
No protótipo
Documento adaptado a retrato e paisagem.
Qualquer pessoa vê o documento.
Não bloqueie a orientação com CSS nem com screen.orientation.lock e faça o leiaute se adaptar às duas orientações. Um bloqueio só se justifica quando a orientação é essencial.
Forçando paisagem
Implementação do visualizador.
Errado: Bloqueio
@media (orientation: portrait) { .conteudo { display: none; } .aviso-gire { display: block; } }Em retrato, o conteúdo some.
Certo: Adaptação
@media (orientation: portrait) { .documento { width: 100%; } }O conteúdo se ajusta.
Inclua nos critérios de aceite que o produto funcione em retrato e em paisagem e exija justificativa para qualquer bloqueio de orientação.
Pedido de bloqueio
Design pede para travar paisagem no vídeo tutorial.
Errado: Aprovado
Decisão
Vídeo só em paisagem.
Parte do público não assiste.
Certo: Recusado com alternativa
Decisão
Vídeo em retrato com opção de tela cheia.
Todos assistem.
Abra cada página no celular em retrato e em paisagem, com a rotação automática ligada e desligada. Registre conteúdo que some ou fica cortado e pedidos para girar o aparelho.
Documento digital em retrato
Teste com rotação desativada.
Errado: Conteúdo bloqueado
Observação
Aparece só “Gire seu celular”.
Restrição a uma orientação.
Certo: Conteúdo adaptado
Observação
Documento visível e legível.
Atende ao requisito.
Não escreva “gire o celular” como condição para ver o conteúdo. Se uma orientação for realmente essencial, explique o motivo.
Aviso sobre orientação
Aviso num visualizador.
Errado: Ordem sem motivo
Aviso
“Gire o celular.”
Exclui quem não pode girar.
Certo: Sugestão opcional
Aviso
“Se preferir, gire o celular para ver o documento maior.”
A pessoa escolhe.