Site no celular: o que conferir antes de publicar

Segundo a pesquisa TIC Domicílios 2025, do Cetic.br, 99% dos brasileiros que usam a internet acessaram pelo celular, e 65% acessam somente por ele, cinco pontos percentuais a mais do que no ano anterior. Para uma parte grande do seu público, o site que importa é o que aparece numa tela de seis polegadas, e não o que você revisou no computador.

Mesmo assim, o celular costuma ser o último a ser testado, e muitas vezes só com o dedo do próprio dono. O roteiro abaixo troca a "conferência geral" por tarefas, porque é fazendo uma tarefa de verdade que os tropeços aparecem.

Antes de começar: o que você vai usar

• Dois aparelhos diferentes, de preferência um Android e um iPhone, um deles mais antigo. O simulador do navegador no computador ajuda a investigar, mas não substitui o aparelho na mão;
• Dados móveis, não o Wi-Fi do escritório;
• Uma pessoa de fora da empresa, que não conheça o site. Peça a ela as tarefas abaixo e observe sem ajudar. Onde ela hesitar, o visitante também vai hesitar.

Tarefa 1: ligar para a empresa

Peça: "ligue para a empresa a partir do site".

O que observar: a pessoa acha o telefone sem rolar a página inteira? Toca no número e a ligação abre?

Causa mais comum quando falha: o número está escrito como texto simples ou dentro de uma imagem, e não como link de telefone. A correção é transformar o número em um link do tipo tel:, que faz o aparelho abrir a chamada. O mesmo vale para e-mail (mailto:) e endereço, que pode abrir o aplicativo de mapas.

Tarefa 2: chamar no WhatsApp

Peça: "mande uma mensagem para a empresa pelo WhatsApp".

O que observar: o botão existe e está visível? Abre a conversa com o número certo? A mensagem já vem com um texto inicial que faça sentido ("Olá, vi o site e gostaria de um orçamento")?

O link do WhatsApp usa o endereço https://wa.me/ seguido do número em formato internacional completo, só com dígitos: no Brasil, 55, o DDD e o número. O texto inicial entra depois de ?text=, com os espaços codificados (%20). Um erro frequente é incluir parênteses, traços ou o "+" no número, o que quebra o link.

Tarefa 3: pedir um orçamento pelo formulário

Peça: "peça um orçamento pelo site".

O que observar, passo a passo:

• O campo de e-mail abre o teclado com o "@"? O de telefone abre o teclado numérico? Isso se resolve declarando o tipo certo de cada campo (type="email", type="tel") e ativando o preenchimento automático (autocomplete);
• A tela dá zoom sozinha quando a pessoa toca num campo? No iPhone, isso costuma acontecer quando o texto do campo tem menos de 16 pixels. A correção é aumentar o tamanho da fonte dos campos, e não impedir o zoom do aparelho;
• O botão "Enviar" fica escondido atrás do teclado ou de alguma faixa flutuante?
• Depois de enviar, o que a pessoa vê? Uma mensagem clara de que o pedido foi recebido, ou a página pisca e nada acontece?

Se o formulário tem mais de cinco ou seis campos, pergunte a si mesmo se cada um é necessário. Em tela pequena, cada campo extra é um motivo a mais para desistir.

Tarefa 4: ler uma página de serviço

Peça: "descubra o que a empresa faz e quanto tempo leva", numa página de serviço ou de produto.

O que observar:

• O texto é legível sem dar zoom? Se a pessoa belisca a tela para ampliar, o texto está pequeno, ou o site foi desenhado só para o computador;
• Aparece rolagem para os lados? Isso indica algum elemento mais largo que a tela: uma tabela, uma imagem ou um vídeo sem ajuste;
• As linhas têm um comprimento confortável, e o espaçamento entre parágrafos deixa respirar?
• O contraste do texto com o fundo é suficiente? Teste com o brilho da tela no máximo e ao ar livre, ou perto de uma janela;
• Alguma faixa fixa (aviso de cookies, chat, botão de WhatsApp) cobre o conteúdo importante?

Duas causas técnicas aparecem com frequência. A primeira é a ausência da instrução de largura de tela do site, a meta viewport, que informa ao navegador que a página deve se adaptar ao tamanho do aparelho. Sem ela, o celular mostra uma versão "encolhida" da página de computador. A segunda é a prática de bloquear o zoom do aparelho para "evitar problemas de layout": isso prejudica quem precisa ampliar o texto e não é recomendado.

Tarefa 5: navegar até outra página

Peça: "encontre o endereço da empresa" ou "volte para a página inicial".

O que observar: o menu abre e fecha com facilidade? Os links e botões são grandes o bastante para o dedo, e estão afastados o suficiente uns dos outros para não se tocarem por engano?

Sobre tamanho de botões, há números de referência: as diretrizes de acessibilidade da W3C (WCAG 2.2) pedem que alvos de toque tenham no mínimo 24 × 24 pixels, com exceções, e recomendam 44 × 44 como nível mais confortável. O Google, no web.dev, sugere cerca de 48 pixels com algo como 8 pixels de espaço entre os alvos. Tratar o limite de 24 pixels como meta é pouco: quem usa o celular com uma mão, andando, precisa de mais folga.

Tarefa 6: usar com internet ruim

Peça para repetir a tarefa 4 com sinal fraco, ou ative a limitação de rede nas ferramentas do desenvolvedor do navegador.

O que observar: o texto principal aparece rápido ou há uma tela em branco por muito tempo? O conteúdo "pula" enquanto carrega? As imagens pesadas atrasam a leitura? Esse teste conversa com outro assunto, a velocidade, que você encontra em Por que a velocidade do site importa e o que costuma deixá-lo lento.

O Google olha o celular primeiro

Desde que adotou a indexação "mobile-first", o Google usa a versão móvel da página para indexar e classificar. Se o conteúdo que aparece no celular é menor do que o do computador, é o conteúdo menor que conta. Por isso, o Google orienta que o site móvel tenha o mesmo conteúdo do desktop (títulos, textos, imagens com texto alternativo, dados estruturados). Para economizar espaço sem cortar conteúdo, vale usar elementos que se expandem ao toque, como as abas e os acordeões.

Ferramentas que ajudam, e o limite delas

O Lighthouse (no navegador Chrome) e o PageSpeed Insights avaliam o desempenho e a acessibilidade básica da página no celular. O antigo Teste de Compatibilidade com Dispositivos Móveis do Google foi descontinuado no fim de 2023, então não adianta procurar por ele. Nenhuma dessas ferramentas substitui o teste com uma pessoa de verdade segurando o aparelho. Elas mostram o que está errado no código; só a pessoa mostra o que atrapalha de fato.

Depois do teste

Anote cada tropeço com a tarefa em que ele apareceu, e organize por impacto: o que impede o contato (telefone, WhatsApp, formulário) vem antes do que incomoda a leitura. Corrija, e repita o teste com outra pessoa. Se o site vai ser feito ou refeito, essa lista pode virar parte do que você cobra de quem entrega: O que levar em conta antes de contratar um site mostra como transformar isso em critério de comparação entre propostas.