O que é Peso da Página?
Peso da página, também chamado de page weight ou tamanho da página, é o total de bytes que o navegador precisa baixar para montar uma página completa. A conta inclui o HTML, as folhas de estilo, os scripts, as imagens, os vídeos, as fontes e os arquivos carregados por serviços de terceiros.
O peso importa porque cada byte viaja por uma conexão real. No Wi-Fi de fibra, 4 MB descem rápido. No 4G instável de uma rodovia do interior, os mesmos 4 MB significam segundos de tela branca e visitantes que desistem antes de ver a oferta.
A métrica também conversa com custo. Sites pesados consomem mais banda da hospedagem e mais dados do plano de celular do visitante. Em campanhas de tráfego pago, o peso alto derruba a conversão da mesma verba investida.
Como calcular o Peso da Página?
Peso da Página = soma dos bytes de todos os recursos carregados
(HTML + CSS + JavaScript + imagens + fontes + vídeos + scripts de terceiros)Passo a passo com um exemplo hipotético de uma home institucional:
- HTML: 45 KB
- CSS: 180 KB
- JavaScript: 620 KB
- Imagens: 2.400 KB
- Fontes: 210 KB
- Scripts de terceiros: 340 KB
Soma: 45 + 180 + 620 + 2.400 + 210 + 340 = 3.795 KB, ou aproximadamente 3,7 MB.
Interpretação do resultado: as imagens sozinhas representam 63% do peso. Converter para WebP e servir tamanhos adequados a cada tela corta a maior fatia sem tocar em uma linha de código. O JavaScript vem em segundo, com 620 KB, o que sugere revisar plugins e bibliotecas carregadas em todas as páginas.
Peso da Página vs métricas irmãs: qual a diferença?
| Métrica | O que mede | Quando usar |
|---|---|---|
| Peso da Página | Total de bytes baixados | Diagnosticar qual tipo de arquivo domina o carregamento |
| Tempo de Carregamento | Segundos até a página ficar pronta | Medir a experiência real do visitante |
| Número de Requisições | Quantidade de arquivos pedidos ao servidor | Detectar excesso de arquivos pequenos e scripts soltos |
Veredito: o peso explica a causa, e o tempo de carregamento mostra o efeito sentido por quem acessa, dentro do diagnóstico de performance de site.
Exemplos de uso
- Uma imobiliária de Curitiba publica um empreendimento com 18 fotos em resolução original, e a página passa de 9 MB. Após redimensionar e converter para WebP, o peso cai para 1,4 MB e o mesmo anúncio passa a entregar visitantes que veem o formulário.
- Uma loja de moda descobre que três scripts de terceiros somam 500 KB. A equipe remove um chat descontinuado e adia o carregamento dos pixels, cortando 320 KB de toda página do site.
- Um blog corporativo audita o peso a cada deploy e adota um teto de 1,5 MB por artigo.
Erros comuns
- Publicar imagens no tamanho original da câmera e deixar o navegador redimensionar na tela.
- Carregar uma família inteira de fontes quando a página usa dois pesos.
- Acumular plugins que injetam CSS e JavaScript em todas as páginas, mesmo onde nada é usado.
- Medir o peso só no computador do escritório, com cache quente, e concluir que o site está leve.
- Ignorar scripts de terceiros na conta, embora eles entrem no mesmo orçamento de bytes.
Perguntas frequentes sobre Peso da Página
Como medir o peso da minha página?
Abra as ferramentas de desenvolvedor do navegador, vá até a aba Network, marque a opção de desabilitar cache e recarregue a página. O rodapé mostra o total transferido e o número de requisições. Filtre por tipo de arquivo para ver qual categoria pesa mais.
Qual o peso ideal de uma página?
Não existe número universal, porque depende do tipo de página e do público. O caminho prático é definir um teto para o seu projeto, medir cada página contra ele e tratar o excesso como dívida técnica. Páginas de captação com tráfego mobile pedem mais rigor.
O que mais pesa em um site?
Imagens costumam liderar na maioria dos sites, seguidas por JavaScript. Vídeos hospedados diretamente na página multiplicam o peso de forma rápida. Fontes personalizadas e scripts de terceiros como pixels e chats aparecem depois, com contribuições menores porém frequentes.