Mobile

Por que uma página com muitas imagens carrega mais devagar no telemóvel

A mesma página que carrega instantaneamente no Wi-Fi do escritório pode arrastar-se numa ligação móvel, só por causa do peso das imagens.

O que é

Esta verificação analisa quantas imagens uma página carrega e assinala páginas com um número invulgarmente elevado, já que cada imagem adicional é mais um ficheiro separado que o navegador tem de descarregar antes de a página terminar de carregar. Isto não significa que as imagens sejam más por natureza — muitas vezes são essenciais ao design e ao conteúdo de uma página — trata-se especificamente do efeito cumulativo de carregar um número muito grande delas de uma só vez.

O impacto prático de uma contagem elevada de imagens sente-se muito mais no telemóvel do que no computador, porque as ligações móveis (mesmo as boas) costumam ser mais lentas e menos consistentes do que uma ligação Wi-Fi ou por cabo em casa ou no escritório.

Por que importa

Cada imagem acrescenta à quantidade total de dados que o dispositivo do visitante tem de descarregar antes de a página ficar totalmente utilizável, e numa ligação de dados móveis em particular, esse tempo de download pode alongar-se de forma percetível em comparação com a mesma página a carregar quase instantaneamente numa ligação rápida de computador. Um visitante que espera por uma página lenta e pesada em imagens no telemóvel tem uma probabilidade consideravelmente maior de desistir e sair antes de terminar de carregar, em comparação com uma página mais leve que fica utilizável muito mais cedo.

Este é um caso em que a correção não implica necessariamente remover conteúdo que interessa ao visitante — trata-se muito mais, na maioria das vezes, de como essas imagens são fornecidas (o seu tamanho de ficheiro, e se carregam todas de imediato) do que de as eliminar por completo.

Como corrigir

  1. Conta quantas imagens carregam de imediato na página e identifica quaisquer que sejam invulgarmente grandes em tamanho de ficheiro (as ferramentas de programador do teu navegador mostram isto para cada imagem).
  2. Comprime imagens grandes com uma ferramenta gratuita de compressão de imagens antes de as carregares — isto costuma reduzir drasticamente o tamanho do ficheiro sem perda visível de qualidade.
  3. Adiciona carregamento lento (lazy loading) às imagens que aparecem mais abaixo na página (fora da área visível sem deslocamento), para que só carreguem quando o visitante realmente se aproximar delas ao deslocar a página, em vez de todas de uma vez quando a página abre.
  4. A maioria dos criadores de sites e plataformas CMS modernas suportam carregamento lento com um simples interruptor, ou até automaticamente por predefinição — verifica as tuas definições de imagem ou desempenho antes de o configurares manualmente.
  5. Volta a testar o tempo de carregamento móvel da página depois das alterações, idealmente numa ligação móvel real e não no Wi-Fi rápido do escritório.

Veja se o seu próprio site tem este problema

O Launch Readiness analisa o seu site em busca deste e de mais ~50 problemas antes do lançamento, em segundos — grátis, sem registo.

Fazer uma análise grátis