Marca, contexto e promessa aparecem sem exigir navegação prévia.
03 · Prioridade
No celular, cada escolha disputa menos espaço e mais atenção.
A experiência vertical revela o que realmente importa. Conteúdo, navegação e ação são ordenados para leitura com uma mão, conexões variáveis e sessões curtas — sem remover a profundidade que o visitante pode precisar.
320–700 pxfaixa de leitura vertical comum1 coluna principalordem sem ambiguidadeToque + contextoação próxima e identificada
Sequência editorial
A ordem do documento se torna a própria interface.
Sem espaço lateral abundante, a página precisa decidir o que vem primeiro. Essa decisão considera intenção, dúvidas, prova, risco e momento de contato.
Texto curto explica para quem é, o que resolve e como funciona.
Projeto, processo, critérios e limitações oferecem prova verificável.
A chamada para ação surge próxima da informação que sustenta a decisão.
Conteúdo aprofundado permanece acessível sem sobrecarregar o primeiro quadro.
Ergonomia e legibilidade
Uma mão, várias condições de uso.
A pessoa pode estar em movimento, sob luz forte, com conexão lenta ou usando tecnologia assistiva. O design mobile precisa continuar identificável nessas condições.
Ação dentro do alcance
Botões principais recebem largura, altura e espaçamento suficientes. Ações flutuantes não encobrem conteúdo, respeitam áreas seguras e não substituem os caminhos normais da página.
O WhatsApp é apresentado como destino claro: abrir o aplicativo não equivale a enviar mensagem nem a criar um contato confirmado.
LeituraContextoAção acessível
Texto que não depende de zoom
Corpo, títulos, rótulos e mensagens de erro mantêm escala coerente. Linhas não ficam excessivamente longas, blocos respiram e contraste não depende de uma única tonalidade.
Informação essencial permanece em HTML, não desenhada dentro de imagens. Assim ela pode adaptar, ser selecionada, lida por tecnologia assistiva e indexada.
Operação eficiente
Desempenho faz parte da mensagem.
Uma página que demora, desloca blocos ou reproduz mídia sem controle perde credibilidade antes de o conteúdo ser compreendido.
Mídia responsiva
Vídeos e imagens usam versões adequadas à proporção vertical; pôsteres evitam quadros vazios e recursos fora da área visível podem ser pausados.
Estabilidade visual
Dimensões conhecidas reservam espaço para mídia e reduzem saltos durante o carregamento, principalmente perto de botões e formulários.
Conexão consciente
Economia de dados e movimento reduzido alteram o comportamento de vídeos e animações sem remover a informação principal.
Menu objetivo
Categorias agrupam profundidade sem transformar o topo em uma lista interminável. A pessoa pode abrir, fechar e voltar ao contexto anterior.
Formulários adequados
Campos usam tipos corretos, rótulos persistentes, validação compreensível e mensagens próximas da origem do problema.
Teste em extremos
A experiência é revisada em larguras estreitas, textos maiores, orientação alterada, teclado virtual aberto e conteúdo mais extenso.
Critérios de validação
Mobile aprovado é mobile compreendido.
A página precisa comunicar, responder e permitir ação sem exigir precisão excessiva, conexão perfeita ou memorização da navegação.
- PrioridadeA ordem conduz sem esconder profundidade.
- ToqueAlvos e distâncias reduzem acionamentos acidentais.
- LeituraTexto mantém escala, contraste e comprimento.
- DesempenhoMídia não bloqueia o conteúdo principal.
- AcessibilidadeSemântica, foco e movimento possuem alternativas.
Continue a comparação