Toda imagem que você coloca em um site é uma troca entre tamanho de arquivo, qualidade e recursos. PNG, JPG e WebP cobrem quase todos os casos, mas não são intercambiáveis. Este guia explica no que cada formato é bom e como escolher sem adivinhar.
A resposta curta
- JPG para fotografias e imagens complexas em que um arquivo pequeno importa mais que pixels perfeitos.
- PNG para capturas de tela, diagramas, logos e tudo que precisa de transparência ou detalhe sem perdas.
- WebP quando você quer o menor arquivo com qualidade parecida e suporte a transparência.
Comparação rápida
| Formato | Compressão | Transparência | Melhor para |
|---|---|---|---|
| PNG | Sem perdas | Sim | Capturas, gráficos, logos |
| JPG | Com perdas | Não | Fotos, compartilhamento, e-mail |
| WebP | Com ou sem perdas | Sim | Sites modernos, arquivos menores |
PNG: pixels nítidos, arquivos maiores
PNG é um formato sem perdas. Cada pixel é preservado exatamente, o que o torna a escolha certa para capturas de tela, mockups de interface, gráficos e logos com bordas duras. O PNG também aceita canal alfa, então fundos transparentes continuam transparentes.
O custo é o tamanho. Uma fotografia salva como PNG pode facilmente ficar de cinco a dez vezes maior que a mesma foto em JPG, porque fotografias têm muita variação sutil de cor que a compressão sem perdas não pode descartar. Por isso PNG é uma má escolha padrão para galerias de fotos.
Use PNG quando:
- a imagem tem texto, linhas finas ou bordas nítidas;
- você precisa de fundo transparente;
- pretende editar o arquivo de novo e quer evitar compressão com perdas repetida.
JPG: fotos menores, sem transparência
JPG usa compressão com perdas. Ele descarta detalhes que o olho humano tende a notar menos, o que funciona muito bem em fotografias. Um JPG de alta qualidade costuma parecer idêntico à origem e ainda assim ser bem menor.
As trocas são reais: JPG não tem canal alfa, e cada salvamento perde um pouco mais de detalhe. Editar e salvar um JPG repetidas vezes é má ideia. Textos e bordas nítidas também podem ganhar artefatos visíveis, principalmente em qualidades baixas.
Use JPG quando:
- a imagem é uma fotografia;
- o tamanho do arquivo importa mais que a precisão pixel a pixel;
- a imagem não precisa de transparência.
Uma qualidade em torno de 80–90 costuma ser o ponto ideal. Abaixo de 70, os artefatos ficam fáceis de ver em rostos, céus e degradês.
WebP: o padrão moderno
O WebP suporta compressão com e sem perdas, além de transparência. Com qualidade visual parecida, costuma ser 25–35% menor que JPG, e pode substituir o PNG em gráficos que precisam de alfa.
O suporte dos navegadores não é mais problema: Chrome, Firefox, Safari e Edge atuais exibem WebP. Se você precisa atender navegadores muito antigos, mantenha um fallback JPG ou PNG, mas a maioria dos sites já não precisa.
Use WebP quando:
- você quer o menor arquivo para a web;
- a imagem precisa de transparência;
- você pode mirar em navegadores modernos.
Como escolher sem complicar
- É uma foto? Comece com JPG ou WebP.
- Precisa de transparência? Use PNG ou WebP.
- É uma captura de tela ou logo? PNG ou WebP sem perdas.
- Banda é importante? Prefira WebP e depois JPG.
- Vai editar várias vezes? Guarde um PNG mestre e exporte uma cópia comprimida.
Você pode converter entre os três formatos no navegador com o Conversor de Imagens. Ele mantém as dimensões originais e permite ajustar a qualidade para JPG e WebP.
Erros comuns
- Salvar capturas de tela como JPG. As bordas do texto ficam borradas e o arquivo nem é muito menor. Use PNG ou WebP.
- Salvar fotos como PNG. O arquivo fica muito maior sem benefício visível. Use JPG ou WebP.
- Usar uma imagem de 4000px com 400px de largura. Redimensione primeiro e comprima depois; o navegador não deve baixar pixels que nunca vai exibir.
- Salvar um JPG várias vezes. Cada salvamento acumula artefatos de compressão. Guarde o original e exporte uma vez.
- Esquecer a transparência. O JPG achata áreas transparentes em branco, o que pode arruinar um logo sobre fundo colorido.
Se você precisa diminuir uma foto grande antes de enviá-la, o Compressor de Imagens redimensiona e comprime localmente. E se está preparando um ícone de site, o Gerador de Favicon gera todos os tamanhos a partir de uma imagem.
Uma regra simples
Use WebP para a web quando puder, JPG para fotos e PNG para capturas, gráficos e transparência. Converta com critério, redimensione antes de comprimir e guarde um mestre sem perdas de tudo que você pode editar de novo.