JPG vs PNG vs WebP: Qual formato você deve escolher?

Três formatos. Três pontos fortes diferentes. E você não sabe qual usar no seu projeto.

JPG tem sido o padrão para fotos desde os anos 1990. PNG lida com transparência e qualidade sem perda. WebP combina o melhor dos dois e ainda é mais leve. Mas cada um tem situações onde é a escolha certa.

Este guia mostra exatamente quando usar cada formato. A decisão depende do que você está fazendo com a imagem.

Quais são as principais diferenças entre JPG, PNG e WebP?

Aqui vai a comparação rápida:

Característica	JPG	PNG	WebP
Tipo de compressão	Apenas com perda	Apenas sem perda	Com e sem perda
Transparência	Não	Sim	Sim
Animação	Não	Não (APNG existe mas é raro)	Sim
Profundidade de cor	16,7 milhões	16,7 milhões + alfa	16,7 milhões + alfa
Ideal para	Fotos	Gráficos, capturas de tela	Entrega web
Tamanho do arquivo (foto)	Pequeno	Muito grande	O menor
Tamanho do arquivo (gráfico)	Médio	Pequeno-médio	O menor
Suporte em navegadores	100%	100%	97%+
Suporte em email	Excelente	Excelente	Ruim
Suporte para impressão	Excelente	Bom	Ruim

A versão curta: JPG comprime fotos bem, mas não faz transparência. PNG faz transparência e qualidade sem perda, mas cria arquivos enormes para fotos. WebP faz tudo e produz os menores arquivos. Mas não funciona em todo lugar.

Quando você deve usar JPG?

JPG é a escolha certa quando você precisa de fotos que funcionem em qualquer lugar.

Fotos para email. Está enviando imagens por email? JPG. Todo cliente de email exibe JPG corretamente. O suporte ao WebP é incerto. PNG funciona, mas os arquivos são enormes.

Fotos para impressão. Gráficas esperam JPG (ou TIFF). Não mande WebP para elas. Talvez não consigam abrir.

Fotos da câmera para armazenamento. Seu celular tira fotos em JPG. Sua câmera tira fotos em JPG. Para armazenamento geral e compartilhamento de fotos, JPG é o formato universal.

Publicações em redes sociais. Plataformas como Instagram e Facebook aceitam vários formatos. Mas JPG tem sido o padrão por anos. Os resultados são previsíveis e consistentes.

Quando o tamanho importa e a transparência não. JPG a 85% de qualidade te dá fotos com ótima aparência. E isso por uma fração do tamanho do arquivo PNG.

Evite JPG para: logos, ícones, imagens com muito texto, capturas de tela, qualquer coisa que precise de transparência e qualquer imagem que você vá editar várias vezes (a qualidade piora a cada salvamento).

Quando você deve usar PNG?

PNG é a escolha certa quando qualidade e transparência importam mais que tamanho do arquivo.

Imagens com fundo transparente. Recortes de produtos, logos, ícones, adesivos, marcas d'água. Se a imagem precisa flutuar sobre qualquer superfície colorida, PNG lida com transparência perfeitamente.

Capturas de tela. Texto em capturas de tela fica nítido em PNG. JPG borra o texto e cria halos feios ao redor das letras. Para tutoriais, documentação e relatórios de bugs, sempre use PNG.

Logos e ícones. Bordas definidas, cores chapadas, linhas limpas. PNG brilha nisso. Um logo em PNG fica perfeito ao pixel. O mesmo logo em JPG tem bordas borradas e sangramento de cor.

Gráficos com texto. Infográficos, diagramas, gráficos e qualquer imagem com texto legível. PNG mantém o texto nítido. JPG deixa ele borrado.

Arquivos fonte para edição. PNG não tem perda. Salve 100 vezes e nada muda. Use PNG como formato de trabalho ao editar imagens. Exporte para JPG ou WebP quando terminar.

Favicons e ícones de apps. O padrão para favicons web e ícones de apps móveis é PNG. Navegadores e sistemas operacionais esperam isso.

Evite PNG para: fotos em sites (pesadas demais), grandes lotes de imagens web e qualquer situação onde a velocidade de download importa.

Quando você deve usar WebP?

WebP é a escolha certa para quase qualquer imagem em um site.

Todas as imagens do site. Fotos, gráficos, ícones, fundos. WebP lida com cada tipo de imagem e produz arquivos menores que JPG e PNG.

Imagens transparentes para web. WebP te dá a transparência do PNG com arquivos 30-70% menores. Fotos de produtos com fundo transparente são um caso de uso perfeito.

Miniaturas e galerias de imagens. Imagens pequenas veem a maior economia relativa. Uma miniatura JPG de 50 KB cai para 30 KB como WebP. Em uma galeria de 100 miniaturas, são 2 MB economizados.

Progressive Web Apps. Apps que funcionam offline precisam de arquivos pequenos. WebP mantém o tamanho do cache controlável.

Quando você precisa de opções com e sem perda. WebP suporta os dois modos. Use com perda para fotos, sem perda para gráficos. Um formato, dois modos.

Evite WebP para: anexos de email, materiais impressos, arquivos compartilhados com pessoas usando software antigo e armazenamento de arquivo onde compatibilidade universal é essencial.

Como os tamanhos de arquivo realmente se comparam?

Números reais para a mesma imagem em cada formato:

Conteúdo da imagem	JPG (85%)	PNG	WebP (85%)
Foto 4000x3000	1,5 MB	15 MB	1,0 MB
Foto 1920x1080	500 KB	5 MB	340 KB
Captura de tela 1920x1080	250 KB	400 KB	150 KB
Logo 500x200	35 KB	25 KB	15 KB
Ícone 64x64	5 KB	3 KB	2 KB
Infográfico 800x2000	200 KB	350 KB	130 KB

Para fotos, PNG é absurdamente grande. 10x maior que JPG e 15x maior que WebP. Nunca use PNG para fotos na web.

Para gráficos com cores chapadas (logos, ícones), PNG é razoável. Mas WebP ainda ganha por 30-40%.

WebP ganha em todas as linhas. É o formato menor em todos os tipos de imagem. A única desvantagem é a compatibilidade. Nossas recomendações completas sobre o melhor formato para sites estão no nosso guia dedicado.

Você pode usar os três formatos em um mesmo site?

Sim, e muitos sites fazem isso. Aqui vai uma abordagem prática:

Sirva WebP para navegadores que o suportam. São 97% dos seus visitantes. Eles recebem as imagens menores e mais rápidas.

Use JPG como fallback para fotos e PNG para imagens transparentes para os 3% restantes. Use o elemento <picture> no HTML.

Use PNG para favicons e outros arquivos especiais que os navegadores esperam em formato PNG.

Guarde os originais em JPG ou PNG nos arquivos do seu projeto. Gere versões WebP durante o processo de build ou use um CDN que converte na hora.

Se quiser ir além, adicione AVIF na mistura. Nossa comparação do formato AVIF mostra como ele se compara ao WebP.

Para uma comparação detalhada de todos os formatos de imagem, confira nosso guia completo de formatos.

Como converter entre esses formatos?

ConvertIMG lida com todos os três formatos e mais. Converta JPG para WebP para entrega web. Converta PNG para WebP para imagens transparentes menores. Converta WebP para JPG para compatibilidade com email. Você também pode comprimir suas imagens para economizar ainda mais no tamanho do arquivo. Envie seus arquivos, escolha um formato e baixe. Grátis, privado e funciona totalmente no seu navegador.