Melhorar a página de desempenho do site por página

Escolha viagens para medir

Selecione uma página inicial, uma página de serviço, uma listagem de imagens, um artigo e um formulário de contato. Teste pelo menos um dispositivo móvel e uma largura de desktop com dispositivos e conexões representativas. Registre a data, as alterações recentes e os elementos visíveis na primeira viewport.

Medições de laboratório separadas, que ajudam a reproduzir um problema, a partir dos dados de campo disponíveis, que descrevem a experiência real do visitante. Se o tráfego for muito baixo para uma medida estável, não apresente uma pontuação como uma tendência. Web.dev explica ferramentas de medição e seus usos.

• Páginas e dispositivos selecionados.
• Linha de base reproduzível.
• Tarefa que o visitante precisa concluir.

Encontre o motivo do carregamento lento

Identifique o elemento principal visível durante o carregamento e o recurso que o fornece. Uma fotografia de grande herói, uma solicitação tardia ou uma dependência de script podem atrasar o LCP. Use uma imagem adequada ao tamanho exibido, com dimensões HTML, variantes responsivas e prioridade sensata; Não adie a imagem principal sem motivo.

Em seguida, examine as respostas de fontes, CSS, JavaScript e servidor. Remova os recursos genuinamente não utilizados e evite baixar todos os cartões fora da tela imediatamente. Os Guia da imagem Abrange a preparação visual e alternativas.

Evite turnos e mantenha as interações responsivas

Reserve espaço para imagens, incorporações e mensagens que aparecem após o carregamento. Verifique os CLs durante a leitura, não apenas na primeira captura de tela. Fontes tardias e banners podem mover um botão assim como um visitante tenta usá-lo.

Para o INP, tente ações importantes: abra um menu, filtre uma lista, escolha uma opção e corrija um formulário. Se a resposta for lenta, inspecione tarefas longas de JavaScript e a renderização acionada por cada ação. Uma interface mais simples pode ajudar mais do que outra biblioteca.

Defina um orçamento e verifique após o lançamento

Defina limites proporcionais para imagens principais, cartões e novos scripts. Compare os bytes realmente baixados no celular em vez do tamanho total da biblioteca de imagens. Registre o que foi removido, comprimido ou adiado e confirme se a qualidade visual e a acessibilidade permanecem sólidas.

Repita as jornadas após cada alteração e após a implantação. Siga LCP, INP e CLS quando os dados do usuário real estiverem disponíveis, sem prometer que uma pontuação garanta a classificação da pesquisa. Orientação do Google na experiência da página Coloca essas métricas dentro da utilidade mais ampla do site.

• Bytes e atrasos antes e depois.
• Nenhuma regressão visual ou funcional.
• Verificações em páginas e dispositivos prioritários.