PNG vs. WebP vs. AVIF: Escolhendo o Formato de Imagem Certo em 2026
Você faz upload de uma imagem para o seu site e imediatamente enfrenta uma pergunta sem resposta universalmente correta: em qual formato deve ser? PNG está em todo lugar e sempre funciona. WebP reduz um terço do tamanho do arquivo. AVIF comprime ainda mais, mas codifica lentamente. JPEG XL espreita no horizonte. E enquanto isso, seu Lighthouse Score está caindo porque você fez uma escolha por hábito em vez de intenção.
Este guia corta o ruído. Ao final, você saberá exatamente qual formato usar — e por quê — com base no seu tipo de conteúdo, público e restrições de performance.
Os Formatos em Resumo
Antes de mergulhar nos compromissos individuais, aqui está uma referência lado a lado dos formatos cobertos neste artigo.
Os números de suporte são aproximações do início de 2026 com base em dados do Can I Use.
JPEG: A Linha de Base Universal
JPEG tem sido o formato padrão para fotografias na web desde meados dos anos 1990. Essa longevidade é tanto sua força quanto seu limite.
O que o JPEG faz bem
JPEG usa compressão por transformada discreta de cosseno (DCT) para descartar informações visuais às quais o olho humano é menos sensível. Para imagens de tons contínuos — fotografias, gradientes, cenas 3D renderizadas — isso funciona muito bem. Com configurações de qualidade em torno de 75–85, as imagens JPEG são quase indistinguíveis do original para a maioria dos espectadores.
O suporte nos navegadores é efetivamente 100%. Todo cliente de e-mail, toda plataforma social, todo dispositivo do planeta lê JPEG sem problemas.
Onde o JPEG falha
JPEG não pode armazenar um canal transparente (alfa). Qualquer imagem que precise de fundo transparente — um logo sobre um cartão colorido, uma foto de produto em fundo desconhecido — não pode ser JPEG.
JPEG também lida mal com bordas nítidas e blocos de cor sólida. Comprima uma captura de tela de código ou um diagrama com texto nítido e você verá artefatos em bloco em cada borda. Para qualquer coisa com transições de alto contraste, JPEG é a ferramenta errada.
Para fotografias salvas como PNG em vez de JPEG, a penalidade de tamanho é severa: arquivos PNG para fotos são rotineiramente 5–10× maiores que seus equivalentes JPEG, sem nenhum benefício perceptível de qualidade.
PNG: Precisão Sem Perdas Quando Importa
PNG (Portable Network Graphics) armazena cada pixel exatamente como foi salvo. Nada é descartado. O compromisso é o tamanho do arquivo — PNG usa compressão sem perdas, o que significa que imagens com variação de cor complexa (fotos) permanecem grandes.
O que o PNG faz bem
PNG é o formato correto quando a fidelidade pixel perfeita importa:
- Logos e marcas — bordas nítidas, cores planas, transparência para posicionamento em qualquer fundo
- Capturas de tela — elementos de UI, trechos de código e texto renderizados nitidamente em qualquer nível de zoom
- Diagramas e ilustrações — gráficos, fluxogramas, conjuntos de ícones com bordas definidas
- Imagens que serão editadas novamente — cada salvamento de JPEG recomprime e degrada; PNG vai e vem sem perdas
PNG também suporta transparência alfa completa, o que significa que você pode ter pixels semitransparentes, não apenas mascaramento ligado/desligado. Isso importa para sombras, brilhos e bordas suavizadas em formas não retangulares.
Onde o PNG falha
Não salve uma fotografia como PNG se pretende exibi-la na web. Uma foto DSLR de alta resolução pode ser 3 MB como JPEG de qualidade 85 e 25 MB como PNG. Nem o usuário nem sua conta de largura de banda apreciarão essa decisão. Para conteúdo fotográfico, PNG é quase sempre o formato errado.
WebP: O Versátil Prático
O Google introduziu o WebP em 2010 e passou a década seguinte integrando-o em todos os navegadores. Em 2026, o suporte global nos navegadores está em torno de 97%, o que para fins práticos significa que você pode usá-lo sem fallback para a maioria dos públicos.
Os números de compressão
A pesquisa original do Google comparando WebP com JPEG em qualidade SSIM equivalente descobriu que WebP é 25–34% menor que JPEG. Estudos independentes desde então confirmaram que essa faixa se mantém em diversas bibliotecas de imagens. Para um site que serve milhares de imagens por mês, essa redução se traduz diretamente em menores custos de CDN e tempos de carregamento mais rápidos.
WebP suporta modos com e sem perdas, tornando-o um substituto genuíno tanto para JPEG (modo com perdas) quanto para PNG (modo sem perdas) na maioria das situações. Crucialmente, ele também suporta transparência alfa completa em ambos os modos — algo que JPEG não consegue fazer de forma alguma.
Quando usar WebP
- Imagens web gerais onde a ampla compatibilidade é a prioridade
- Substituir JPEG para fotos de produtos, imagens editoriais e imagens hero
- Substituir PNG para logos e gráficos onde você quer transparência com pegada menor que PNG
- Qualquer situação em que você queira uma única decisão de formato que funcione em toda a sua biblioteca de imagens
Para comprimir imagens para WebP ou converter formatos de imagem entre PNG, JPEG e WebP, você pode fazer isso diretamente no navegador sem instalar nada.
Os casos extremos em que o WebP tem desempenho inferior
O modo com perdas do WebP pode introduzir banding sutil em gradientes suaves em configurações de compressão agressivas — mais do que JPEG em tamanhos de arquivo equivalentes. Para algum conteúdo fotográfico, particularmente tons de pele e gradientes de céu, o AVIF produz resultados mais limpos no mesmo tamanho de arquivo.
AVIF: Compressão Máxima, Suporte Crescente
AVIF (AV1 Image File Format) é derivado do codec de vídeo AV1 desenvolvido pela Alliance for Open Media. Representa um salto geracional em eficiência de compressão.
Os números de compressão
Estudos comparando AVIF com JPEG em qualidade visual equivalente mostram consistentemente uma redução de tamanho de arquivo de 50% ou mais. Um JPEG de 200 KB muitas vezes pode ser reproduzido como um AVIF de 90–100 KB que é indistinguível a distâncias normais de visualização. A Netflix, que codifica enormes volumes de imagens de miniaturas e visualizações, publicou resultados mostrando que AVIF reduz a largura de banda de imagens em 50% em comparação com JPEG.
Para entrega de imagens em alto volume — catálogos de produtos de e-commerce, plataformas de mídia social, sites de notícias com artigos ricos em imagens — essas economias não são marginais. Elas afetam significativamente os gastos com CDN e os tempos de carregamento de página.
Suporte a HDR e gamut de cores amplo
AVIF suporta nativamente HDR (High Dynamic Range) e gamuts de cores amplos como Display P3. Em displays compatíveis, imagens AVIF podem mostrar destaques mais brilhantes e sombras mais profundas do que formatos SDR. Para showcases de fotografia, portfólios de design e qualquer site onde a fidelidade da imagem em displays premium importa, este é um diferencial significativo.
O problema da velocidade de codificação
A fraqueza do AVIF é o tempo de codificação. Comparado ao JPEG ou WebP, a codificação AVIF é significativamente mais lenta — geralmente 5–10× mais lenta em configurações de qualidade equivalentes. Para pipelines de build que processam milhares de imagens, isso se acumula. A maioria das equipes mitiga isso codificando AVIF no momento do build ou como um trabalho em lote único, não sob demanda.
A velocidade de decodificação (o que o navegador faz ao renderizar a imagem) é rápida e não é uma preocupação do usuário em hardware moderno.
Suporte nos navegadores em 2026
O suporte ao AVIF está em aproximadamente 93% nos navegadores no início de 2026, o que significa que você ainda deve servir um fallback WebP ou JPEG para cobertura completa. O padrão é:
<picture>
<source srcset="image.avif" type="image/avif" />
<source srcset="image.webp" type="image/webp" />
<img src="image.jpg" alt="Descrição" />
</picture>Essa abordagem de aprimoramento progressivo significa que navegadores com suporte a AVIF recebem o menor arquivo, navegadores com suporte a WebP recebem um meio-termo sólido e todo o resto recai em JPEG.
JPEG XL: Vale Observar, Ainda Não Pronto
JPEG XL (.jxl) é o formato tecnicamente mais capaz desta lista. Ele iguala ou supera o AVIF em compressão, suporta recodificação sem perdas de arquivos JPEG existentes sem perda de qualidade (tornando-o exclusivamente útil para arquivamento) e lida com HDR, gamut de cores amplo e animação. O comitê JPEG o projetou como um substituto de longo prazo para todo o ecossistema JPEG.
O problema é o suporte nos navegadores. No início de 2026, JPEG XL permanece por trás de flags experimentais na maioria dos navegadores e não está habilitado por padrão em lugar algum exceto Safari (que adicionou suporte em 2022). O Chromium removeu seu suporte experimental em 2022, embora o debate permaneça ativo no rastreador de issues do Chromium.
Nossa recomendação: Não use JPEG XL para entrega web hoje. Observe-o. Se você está construindo um pipeline de arquivamento para fotografia ou trabalhando com aplicativos do ecossistema Apple, merece atenção. Para trabalho web em produção, AVIF + fallback WebP é a combinação certa agora.
A Árvore de Decisão
Use isto para tomar uma decisão de formato rapidamente.
Você precisa de transparência?
Sim — Use WebP (modo sem perdas) como seu formato principal. Ele fornece transparência com arquivos menores que PNG. Se você precisar de fidelidade sem perdas pixel-perfeita (logos sendo reutilizados para impressão, ativos fonte), use PNG. JPEG não é uma opção.
Não — Continue abaixo.
É uma fotografia ou um gráfico?
Fotografia (tons contínuos, cor complexa):
- Se você precisa do suporte mais amplo possível nos navegadores: JPEG
- Se você quer arquivos significativamente menores com suporte quase universal: WebP (modo com perdas)
- Se você está otimizando para largura de banda em escala e pode servir um fallback: AVIF com fallback WebP
Gráfico (logo, diagrama, captura de tela, texto):
- Use WebP (modo sem perdas) ou PNG dependendo se o tamanho do arquivo ou a compatibilidade com ferramentas importa mais para você
- Nunca use JPEG para gráficos com bordas nítidas ou áreas de cor plana
Você está servindo em escala?
Se o seu site entrega mais de alguns milhares de requisições de imagens por dia, a lacuna de compressão entre JPEG e AVIF se torna significativa em custos reais. Implemente o elemento <picture> com fallbacks AVIF + WebP + JPEG. O custo de engenharia é baixo; as economias de infraestrutura se acumulam ao longo do tempo.
Resumo de referência rápida
Como Converter Entre Formatos
A maioria dos editores de imagem exporta todos os quatro formatos abordados aqui. Para desenvolvedores web que precisam converter lotes de arquivos programaticamente:
ImageMagick (linha de comando):
# Converter JPEG para WebP
magick input.jpg -quality 82 output.webp
# Converter JPEG para AVIF
magick input.jpg -quality 60 output.avif
# Converter PNG para WebP sem perdas
magick input.png -define webp:lossless=true output.webpSquoosh (baseado em navegador): O app Squoosh do Google permite comparar formatos lado a lado com um controle deslizante de qualidade e preview do tamanho do arquivo em tempo real — útil para calibrar configurações de compressão visualmente antes de se comprometer com uma conversão em lote.
FileCrank: Você pode converter formatos de imagem diretamente no seu navegador sem instalar nada — útil para conversões avulsas ou quando você está trabalhando em uma máquina sem ferramentas locais.
Para processamento em massa e redução de tamanho, a ferramenta de compressão de imagens lida com conversão de formato e otimização de qualidade em uma única etapa.
A Relação Entre Escolha de Formato e Compressão
Escolher o formato certo é apenas metade do trabalho. Dois arquivos WebP em configurações de qualidade diferentes podem variar 3× no tamanho do arquivo com pouca diferença visível. Se você quiser se aprofundar na calibração qualidade versus tamanho, o artigo sobre como comprimir imagens sem perder qualidade cobre a mecânica prática de configurações de qualidade, carregamento progressivo e métricas de qualidade perceptual como SSIM e DSSIM.
Para uma explicação fundamental de por que a compressão com e sem perdas produz resultados tão diferentes, e quando cada abordagem é apropriada, veja compressão com e sem perdas explicada.
Conclusão
A decisão de formato se resume a três perguntas: Precisa de transparência? É uma fotografia ou um gráfico? Estou otimizando para compressão máxima?
Para a maioria dos projetos web modernos em 2026, a resposta prática é:
- WebP como seu formato padrão — ele lida com transparência, funciona nos modos com e sem perdas, tem suporte quase universal nos navegadores e é 25–34% menor que JPEG
- AVIF onde as economias de largura de banda mais importam — com um fallback
<picture>WebP ou JPEG para os 7% restantes dos navegadores - PNG apenas quando a precisão sem perdas ou a compatibilidade com ferramentas especificamente exige
- JPEG como fallback de último recurso, e ainda a escolha certa para e-mail
Escolha com base no tipo de conteúdo e contexto de entrega, não por hábito. A diferença entre um AVIF de 200 KB e um PNG de 600 KB da mesma imagem é invisível para os visitantes, mas muito visível nos seus tempos de carregamento de página e custos de infraestrutura.
Pronto para colocar isso em prática? Converta suas imagens para WebP ou AVIF, ou comprima imagens existentes para ver quanto tamanho você pode recuperar das suas escolhas de formato atuais.