A mesma página, duas formas de ocupar o espaço
O laboratório usa o Ateliê Linha Clara, um negócio fictício. Uma versão mantém a largura fixa em 760 pixels; a outra usa uma organização flexível. O problema foi criado para esta demonstração, sem representar um site de cliente.
Na versão rígida, o título e o texto ultrapassam a área visível. Na flexível, o título quebra em mais linhas e os links do menu aparecem na mesma largura. Diminuir a página inteira não resolve a leitura se as letras ficarem pequenas demais.
Abrir a versão rígida · Abrir a versão flexível
Estas imagens são capturas no navegador, com larguras definidas. Não representam um teste em aparelho físico. No laboratório, você pode abrir os dois exemplos e comparar uma janela estreita com outra mais larga.
Agora confira no seu próprio celular
Use uma página real do seu negócio. Tente entender o serviço e chegar ao contato, seguindo o caminho de alguém que ainda não conhece você.
- Leitura: precisa ampliar para ler? Há texto cortado ou rolagem lateral inesperada?
- Imagens: mantêm a proporção? O recorte esconde algo necessário para entender o que mostram?
- Menu: os links levam ao destino indicado? Se houver menu recolhido, ele abre e fecha sem cobrir o próximo passo?
- Campos: os nomes e as instruções continuam visíveis quando o teclado aparece?
- Links e botões: são fáceis de tocar e levam ao destino anunciado?
Se algo atrapalhar, anote a página, o aparelho, a ação tentada e o que aconteceu. Uma captura com essa explicação ajuda o responsável a localizar o problema.
Caber na tela é uma parte da qualidade
Responsividade, sozinha, não comprova velocidade nem acessibilidade completas. Uma página pode se adaptar à largura e ainda carregar devagar, ter pouco contraste ou dificultar a navegação.
Confira também a tarefa do botão. No caso do WhatsApp no site, abrir a conversa e enviar uma mensagem são passos diferentes.