Blog

PNG ou JPEG para capturas de tela? Medimos 63 reais

Escrito por InSnap · Publicado em · png, jpeg, webp, tamanho do arquivo, captura de tela

PNG ou JPEG para capturas de tela? Medimos 63 reais

Para capturas de interface, o JPEG muitas vezes não é menor que o PNG. Comparamos PNG, JPEG e WebP em 63 capturas reais: tamanho, artefatos no texto e o que reduz o arquivo.

Para uma captura de janela de app, o JPEG muitas vezes não é menor que o PNG. No nosso teste com 63 capturas reais de interface, o JPEG com qualidade 85 ficou, na mediana, em 96% do tamanho do PNG, e em 40% das imagens ficou maior. Para obter um arquivo claramente menor, é preciso cair para a qualidade 70 ou menos, e isso deixa halos em volta do texto.

A economia maior está em outro lugar: reduzir uma captura Retina para 1x. Essa é a configuração que você deve procurar primeiro.

Como medimos

Renderizamos 63 capturas da própria interface do InSnap em tamanho Retina (2x), com 1840 × 1320 pixels cada: 20 páginas de ajustes, 18 telas de histórico, 7 telas do editor de imagens, 13 telas do editor de guias e 5 telas do editor de vídeo. O PNG mediano, como salvo, tinha cerca de 195 KB.

Cada uma foi recodificada como PNG otimizado, como JPEG com qualidade 95, 85, 70 e 50, e como WebP sem perdas e com perdas. Para cada resultado registramos o tamanho do arquivo em relação ao PNG e a parcela de pixels que mudaram de forma visível, ou seja, qualquer canal de cor que variou mais de 8 em 255.

Este é um conteúdo de interface plana, o "print de um app" típico, sem fotografias. Uma tela Retina inteira tem cerca de três vezes mais pixels que essas janelas, então os tamanhos absolutos serão maiores no seu caso.

Os resultados

Tamanho do arquivo de JPEG e WebP comparado ao PNG, por tipo de tela
CodificaçãoTamanho em relação ao PNG (variação entre os cinco tipos de tela)Pixels que mudaram visivelmente
PNG100%0%
JPEG, qualidade 95107% a 181%0.5% a 1.2%
JPEG, qualidade 8570% a 119%1.4% a 1.8%
JPEG, qualidade 7054% a 94%2.5% a 3.0%
JPEG, qualidade 5045% a 78%3.5% a 4.1%
WebP sem perdas31% a 55%0%
WebP, qualidade 9030% a 44%0.5% a 1.3%

Três coisas se destacam.

  • JPEG de alta qualidade pode custar mais que o PNG. Cores chapadas e bordas nítidas são o que o PNG comprime melhor e o que o JPEG trata pior. O JPEG com amostragem de crominância completa (4:4:4), que deixa o texto colorido mais limpo, ficou ainda maior: 93% a 155% do PNG na qualidade 85.
  • O WebP sem perdas foi a opção sem perdas menor, com 31% a 55% do PNG. O InSnap salva PNG ou JPEG, então isso mostra o que outro codificador conseguiria fazer, e não uma opção que você pode escolher. Antes, confira se o lugar para onde você envia aceita WebP.
  • Cada passo com perdas altera o texto. O preço de um JPEG menor é pago justamente nos pixels que mais importam para você.
O mesmo botão em quatro qualidades de JPEG

Na qualidade 85 o texto do botão quase não muda e o arquivo tem o mesmo tamanho do PNG, então não há o que ganhar. Nas qualidades 70 e 50 o arquivo diminui, e aparece um halo tênue em volta das letras brancas.

O que de fato deixa uma captura menor

Reduzir a escala vence recodificar. Uma captura Retina tem quatro vezes os pixels de uma captura 1x, e no InSnap isso é uma única opção.

Mudança (mediana das 63)Tamanho em relação ao PNG 2x
Reduzir para 1x, manter PNG67%
Reduzir para 1x, depois JPEG qualidade 8537%
JPEG qualidade 85 em 2x96%

Imagens de interface plana comprimem tão bem que cortar três quartos dos pixels reduz um PNG em apenas um terço, mas a combinação de 1x com JPEG é a opção menor que ainda mantém o texto legível.

No InSnap, abra Ajustes › Salvar, ative Reduzir as capturas Retina para 1x e escolha ali o formato da imagem. Os detalhes estão em PNG, JPEG e área de transferência: opções de saída, e a lista completa para arquivos grandes demais está em captura de tela grande demais para enviar.

Qual formato usar

SituaçãoUse
Documentação, relatórios de bug, slides, qualquer coisa com textoPNG
Grande demais para um e-mail ou formulárioPrimeiro reduza para 1x; depois JPEG na qualidade 85 ou superior, se o destino exigir
Uma foto ou um quadro de vídeoJPEG; não medimos fotografias, e o JPEG foi feito para elas
Você ainda vai editar ou recortar de novoPNG; o JPEG perde um pouco mais a cada vez que é salvo de novo

Perguntas frequentes

O JPEG é menor que o PNG para capturas de tela?

Não de forma confiável. Para capturas de interface plana, o JPEG na qualidade 85 ficou com tamanho parecido ao do PNG no nosso teste, e maior em 40% das imagens. Ele fica menor em qualidades mais baixas, com artefatos visíveis em volta do texto.

Por que minha captura em JPEG é maior que o PNG?

Capturas são, em sua maioria, cores chapadas e bordas nítidas. O PNG armazena isso de forma muito eficiente, enquanto o JPEG gasta bits nas bordas para evitar borrões. Fotografias se comportam ao contrário.

Reduzir uma captura Retina para 1x prejudica a qualidade?

Ela reduz à metade a largura e a altura, então o texto é renderizado com um quarto dos pixels. Para documentos, chat e e-mail isso basta. Mantenha a resolução total quando a imagem for vista em uma tela Retina ou recortada de novo.

O WebP é melhor que o PNG para capturas de tela?

No nosso teste, o WebP sem perdas ficou entre 31% e 55% do tamanho do PNG, sem nenhuma mudança nos pixels. O InSnap salva PNG ou JPEG, e alguns envios não aceitam WebP, então confira o destino antes de converter.

Sua próxima captura está a um atalho de distância.

macOS 14.4+ (Apple Silicon e Intel) · Windows 10+ (64 bits)