Porque a velocidade importa
Metade das pessoas fecha um site que demora mais de 3 segundos a carregar. Os teus visitantes não vão ter todos um telemóvel novo com Wi-Fi rápido – alguns terão um telemóvel antigo num comboio. Um chefe de projeto pensa neles também.
Boas notícias: o maior ganho de velocidade vem de uma só coisa – imagens. Uma foto direta do telemóvel pode ter facilmente 5 MB; um site só precisa de um décimo disso.
Vou mostrar-te: medir com Lighthouse
Lighthouse é uma ferramenta de medição integrada no Chrome:
- Abre o teu site (a versão online, não localhost).
- F12 → separador Lighthouse → Analyze page load.
- Recebes uma pontuação de 0–100 para desempenho, acessibilidade, SEO – e o mais importante, uma lista de dicas concretas sobre o que melhorar.
As dicas mais comuns e o que fazer:
| Dica Lighthouse | O que fazer |
|---|---|
| Properly size images | reduz as imagens (vê abaixo) |
| Serve images in next-gen formats | guarda em WebP |
| Image elements do not have width/height | adiciona atributos width e height |
| Links do not have descriptive text | em vez de «clica aqui», diz para onde vai a ligação |
Reduz as imagens
- Dimensões: um site só precisa de cerca de 1200px de largura (foto hero) ou cerca de 600px (foto normal). Podes redimensionar em qualquer editor, até online (ex. squoosh.app).
- Formato: WebP é cerca de um terço mais pequeno que JPG com a mesma qualidade.
- Lazy loading: imagens abaixo da dobra só carregam quando o visitante faz scroll até elas:
<img src="photo.webp" alt="Match against the Eagles" width="600" height="400" loading="lazy" />Agora és tu 💪
- Mede o teu site com Lighthouse e anota a pontuação de desempenho – essa é a tua linha de partida.
- Encontra as 3 imagens maiores no teu site (F12 → separador Network → ordenar por Size).
- Reduz-as (dimensões + WebP) e adiciona
loading="lazy"a tudo exceto à primeira imagem no topo. - Mede outra vez e compara pontuações. Escreve no
LAUNCH.md: antes → depois. - Bónus: testa o teu site no telemóvel com Wi-Fi desligado. Como é?
Não esperes 100 pontos. Até sites grandes têm 70–90. O que importa é progresso: ir de 60 para 85 é uma vitória que os visitantes vão notar.
Verifica: Conheces a pontuação Lighthouse antes e depois. As imagens estão redimensionadas, em WebP e com lazy loading. O site carrega visivelmente mais rápido no telemóvel.
O que ficas a saber desta lição
- Velocidade = visitantes ficam. 3 segundos é o limite.
- O Lighthouse diz-te exatamente o que melhorar.
- A maior alavanca: imagens mais pequenas (dimensões, WebP, lazy loading).
© 2026 Ing. Martin Polak / AlgoRhino · Condições de uso do conteúdo