Guia

A mesma captura em duas densidades de pixels

Capturamos uma interface própria em duas densidades e medimos a compressão PNG e a conversão WebP. O layout permaneceu igual, mas o número de pixels capturados mudou. Os resultados separam densidade e formato, com recortes reais do texto para escolher uma captura mais leve e legível.

Última atualização:

Equipe Bitinz · Como escrevemos e verificamos o conteúdo

A tela pode parecer igual e o arquivo mudar

Uma captura é uma imagem rasterizada, não a interface interativa que ela registra. Uma tela de alta densidade pode gravar mais pixels para o mesmo layout visível. Isso ajuda na nitidez do texto, mas quem lê uma prévia pequena talvez não precise da captura completa.

Nossa explicação sobre PNG trata de capturas em geral. Aqui isolamos o efeito com uma interface feita para o experimento, sem dados de contas ou marcas de terceiros. O guia de envio explica o que verificar quando um destino recusa o arquivo.

Captura controlada, compressão de verdade

Em 2026-10-29 capturamos a mesma interface local em 1× e 2×. Dobrar largura e altura gera 4 vezes mais pixels, não um multiplicador fixo do tamanho do arquivo. As duas capturas foram processadas pelo Bitinz em Equilibrado.

Guardamos uma saída PNG e uma conversão WebP de cada captura. Cada configuração foi executada 3 vezes para confirmar que os arquivos de saída eram idênticos. Fontes, hashes e registros acompanham o experimento; o método geral está na nossa política editorial.

Densidade e formato separados

Compare primeiro PNG e WebP na mesma densidade. Depois compare as capturas originais para ver o custo separado de registrar mais pixels.

ImagemPixelsSaídaNívelAntesDepoisEconomia
interface-1x.png800 × 500 pxPNGEquilibrado42.8 KB13.3 KB68.8%
interface-1x.png800 × 500 pxWebPEquilibrado42.8 KB11.1 KB74.1%
interface-2x.png1600 × 1000 pxPNGEquilibrado101.5 KB30.6 KB69.9%
interface-2x.png1600 × 1000 pxWebPEquilibrado101.5 KB27.6 KB72.8%

Bitinz · 1 KB corresponde a 1000 bytes.

Comprimir imagensDeixe arquivos JPG, PNG e WebP menores no próprio formato, em lote e de graça.Comprimir imagens

O texto é a região útil para conferir

Detalhe do PNG original

Texto e linhas da interface no recorte original

Detalhe do PNG comprimido

O mesmo texto e as mesmas linhas após a compressão PNG
A mesma região de texto no PNG original e na saída PNG realmente comprimida, sem retoques.

Textos pequenos, linhas finas e painéis suavemente sombreados merecem mais atenção que um fundo vazio. Confira o recorte em tamanho integral e a captura na largura em que o leitor realmente a verá.

Um WebP menor ajuda se o destino o aceita e as letras permanecem claras. Quando é preciso manter PNG, compare diretamente o PNG comprimido. Se a captura não for necessária, mantenha o texto da página como texto de verdade.

Mostre o que o leitor precisa ver

Antes do envio, recorte as áreas irrelevantes em um editor. É uma decisão de conteúdo, separada da compressão, que reduz distrações e pixels. Preserve o contexto necessário à instrução, como o controle relevante e seu rótulo próximo.

Uma documentação pode precisar de uma imagem nítida de alta densidade que permita ampliação. Uma prévia de conversa talvez precise só da região relevante. Teste o destino real em vez de reduzir toda captura às mesmas dimensões.

Use o compressor PNG se o destino exigir PNG, ou experimente PNG para WebP no próprio site. Compare ambos com o original e escolha conforme a legibilidade e o suporte do destino.

Prepare uma captura legível

  1. Capture apenas a interface e o contexto necessários ao leitor.
  2. Guarde o PNG original e comprima uma cópia.
  3. Compare letras e linhas finas no tamanho integral e na largura de exibição prevista.
  4. Use o arquivo aceitável mais leve no formato suportado pelo destino.

Perguntas frequentes

Uma captura em 2× tem o dobro de pixels?
Se largura e altura dobram, ela contém 4 vezes mais pixels. A proporção entre tamanhos também depende do conteúdo e do formato.
Devo sempre converter capturas para WebP?
Use WebP se o destino aceitar e o texto continuar claro. Mantenha PNG quando for exigido ou produzir um resultado mais útil.
O Bitinz recorta ou redimensiona a captura?
Recorte e redimensionamento são etapas de preparação em um editor. O Bitinz processa o arquivo nas dimensões enviadas.

Ferramentas deste guia

Fontes

  1. Bitinz: Image lab: sources, measurements and output hashes (2026-10-29)
  2. MDN: Window: devicePixelRatio property