Viewport Meta Mobile — Checagem

A página abre no celular parecendo um desktop encolhido, com letra de dois milímetros e zoom obrigatório. Em nove de dez casos o culpado é uma linha só: a meta viewport ausente, ou presente com o valor errado herdado de um template antigo. É o tipo de coisa que passa despercebida em code review porque ninguém lê o head com atenção.

Cole a tag inteira, não só o conteúdo dela. A checagem faz três testes independentes: procura a tag meta name viewport, procura width igual a device-width e procura initial-scale igual a 1 ou 1.0. Também avisa se encontrar user-scalable no. Por isso o valor que já vem preenchido no campo, que é só o conteúdo do atributo, aparece reprovado por falta da tag — cole a linha completa do seu head e o veredito muda para OK.

Duas limitações que valem saber. A comparação é textual e sem delimitador, então initial-scale=1.5 passa no teste porque o 1 casa; confira o valor com o olho. E maximum-scale=1, que junto com user-scalable no impede o leitor de ampliar a página, não é apontado aqui — evite os dois. Viewport correta é o primeiro item de mobile-friendly, não o único: tamanho de fonte, alvos de toque e rolagem horizontal também contam. Roda no navegador.