PNG para WebP, arquivos menores que mantêm a transparência

Troque um PNG pesado por um WebP enxuto que mantém a transparência e carrega mais rápido.

ou solte a imagem aqui

Como converter PNG para WebP

Como converter PNG para WebP

Puxe um PNG para a área de soltar ou clique para procurar um. O trabalho dispara no instante em que o arquivo chega, sem botão Converter em lugar algum, e para uma imagem do dia a dia ele se encerra em bem menos de um segundo. Um botão Baixar então salva o WebP com o nome de origem e uma terminação nova. Converta um e ele roda no seu navegador, entregue vários e eles sobem juntos para o nosso servidor. O mesmo caminho serve celulares e computadores, sem instalação. Para lidar com outro, é só soltar o próximo PNG. Entregue um PNG animado e só o primeiro quadro sobrevive, já que o WebP que ele faz aqui é uma imagem parada, não uma sequência em movimento.

Os pixels transparentes passam para o WebP

Os pixels transparentes passam para o WebP

Um canal alfa de 8 bits mora dentro do WebP, então cada pixel transparente no seu PNG aterrissa igualzinho de transparente no WebP. Nada vira branco, nenhuma franja cerca um recorte, e nenhuma limpeza num editor é precisa depois. Essa é a razão de cara para preferir WebP a JPG quando seu PNG carrega transparência, já que o JPG não tem alfa e precisa trocar os pixels limpos por uma cor sólida. Logos, ícones, recortes de produto, mockups de interface, capturas de tela com cantos arredondados, qualquer coisa apoiada num fundo translúcido, tudo isso atravessa sem ser tocado. Não há chave a virar para isso, simplesmente acontece, porque carregar alfa é parte do que o WebP foi feito para fazer.

Motivos para trocar PNG por WebP

Motivos para trocar PNG por WebP

Acima de tudo, você ganha um arquivo bem mais leve enquanto a transparência e a qualidade visual seguram. Os números oficiais do WebP no Google mostram o WebP sem perdas a uns 26 por cento abaixo de um PNG igual, e o WebP com perdas e alfa perto de um terço do tamanho de um comparável. Imagens mais leves chegam mais cedo, o que alimenta direto o Largest Contentful Paint, um dos Core Web Vitals do Google e um fator de ranqueamento conhecido. O PageSpeed Insights até aponta o PNG na sua sugestão de formatos de nova geração, e mudar para WebP limpa essa marcação. Suporte também não é obstáculo, já que Chrome, Firefox, Safari e Edge leem WebP de forma nativa.

Ajustes de qualidade e o compromisso da perda

Ajustes de qualidade e o compromisso da perda

A Araluma grava o WebP num ajuste quase sem perdas afinado tanto para fotos quanto para gráficos, então em tamanhos comuns de visualização ele parece o mesmo PNG de onde veio. Mantido nesse nível, o WebP é tecnicamente com perdas, o que significa que um pouco de precisão em nível de bit é entregue contra uma cópia sem perdas impecável. Para quase todo trabalho na web, logos, ícones, ativos de interface, fotografias, essa diferença é invisível. Quando a tarefa é pixel exato, como exames médicos ou masters de arquivo, fique com o PNG e deixe o WebP ser a exportação. Em fotografias você costuma esperar uma queda de 50 a 70 por cento no tamanho, somada à vantagem estrutural que o WebP já tem sobre o PNG.

Onde o PNG é realmente convertido

Onde o PNG é realmente convertido

Isso se divide por quantas você entrega. Converta um PNG sozinho e a tarefa inteira acontece na aba, no motor de imagem do próprio navegador, no seu dispositivo, sem nada subindo e sem nada gravado sobre o arquivo. Prove para você mesmo, abra o DevTools, deixe o painel de Rede aberto enquanto converte essa figura única e conte zero requisições de saída carregando ela. Converta um punhado juntas e elas sobem para o nosso servidor, que passa por todas e devolve um único download. Esse download é limpo do nosso servidor em cerca de 2 horas, e você pode apagá-lo no instante em que salvar. Então uma imagem nunca deixa o navegador, e um lote fica no nosso servidor só o tempo de montar o que você leva embora.

Quando o PNG original ainda é a escolha certa

Quando o PNG original ainda é a escolha certa

Por mais longe que chegue, o WebP não entra em toda porta. Há fluxos de gráfica, painéis internos de conteúdo e uns poucos editores que continuam exigindo o PNG na entrada. Em certos sistemas, soltar um PNG simplesmente funciona, enquanto o WebP fica esperando um complemento ser instalado. Existe ainda a questão das edições repetidas: cada vez que você reabre e regrava num programa de desktop, vale ter o PNG sem perdas como peça original, longe do desgaste de tantas idas e voltas de decodificação. A regra prática é direta, o WebP serve de saída rumo à web e o PNG permanece sendo a matriz que você guarda. Caso a necessidade um dia se inverta e você queira recuperar um PNG a partir de um WebP, é a ferramenta webp-to-png que assume o trajeto de volta.

Como funciona

  1. Entregue um PNG

    Deslize o PNG para a página, ou procure por ele no seletor. As partes transparentes vêm junto. Converta uma e ela fica na sua máquina, solte várias e elas sobem para o nosso servidor para serem tratadas juntas.

  2. Relaxe

    Você não faz mais nada. Uma imagem comum vira WebP mais ou menos na velocidade em que seu dedo se levanta, sem etapa Converter e sem rodinha pelo caminho.

  3. Veja encolher

    O resultado conta o tamanho com que saiu. Os pontos limpos seguem limpos, e o WebP deve pesar visivelmente menos que o PNG com que você começou.

  4. Guarde seu WebP

    Um toque em Baixar grava ele, nome antigo, terminação .webp nova. Tem mais na fila? Jogue cada um na página e eles passam um a um.

Perguntas frequentes

A transparência será preservada ao converter PNG para WebP?

Será. Porque o WebP segura um canal alfa completo, cada trecho limpo do seu PNG continua limpo depois de virar WebP. Esse único fato é o motivo de o WebP bater o JPG como destino sempre que você começa com um PNG transparente, já que o JPG não tem alfa e precisa pintar os trechos limpos de uma cor sólida enquanto o WebP deixa o recorte exatamente como achou. Logos, ícones, fotos de produto, peças de interface apoiadas em fundos translúcidos, todos eles atravessam inteiros, sem pedir nada a mais de você.

Por que converter PNG para WebP?

Por um arquivo mais enxuto que mantém tanto a transparência quanto a aparência. Pelos números do WebP no Google, a versão sem perdas fica a uns 26 por cento abaixo de um PNG igual, e a versão com perdas e alfa aterrissa perto de um terço de um. Uma imagem mais enxuta chega mais cedo, o que ajuda o Largest Contentful Paint, uma medida das Core Web Vitals que o Google pesa no ranqueamento. O PageSpeed Insights até aponta o PNG como uma oportunidade de formato de nova geração dentro da sua auditoria de imagem. Além disso, todo navegador grande, de Chrome e Firefox a Safari e Edge, lê WebP sem ajuda.

Converter PNG para WebP perde qualidade?

No ajuste quase sem perdas que a Araluma usa, fotos e gráficos parecem o mesmo PNG de origem em tamanhos comuns de visualização. O WebP mantido aqui é tecnicamente com perdas, então um fiapo de precisão em nível de bit vai em direção a um arquivo menor. Para o uso comum na web, logos, ícones, fotografias, essa folga é invisível. Para trabalho pixel exato ou de arquivo, fique com o PNG e trate o WebP como a cópia de entrega. A conversão deixa seu PNG intocado, parado no seu dispositivo do jeito que estava.

Quanto menor o WebP é em relação ao PNG?

Os números oficiais do WebP no Google colocam o WebP sem perdas a uns 26 por cento abaixo de um PNG igual, e o WebP com perdas e alfa em mais ou menos um terço do tamanho de um comparável. A proporção exata anda com o conteúdo, com gráficos que têm áreas limpas largas e blocos de cor sólida ganhando mais, enquanto fotos cheias de detalhe veem uma queda menor mas ainda útil. De qualquer forma o WebP sai mais leve e a transparência sobrevive.

É seguro converter PNG para WebP aqui?

Depende de você converter uma figura ou várias. Um PNG sozinho é refeito direto no navegador, então esse arquivo não é mandado, e dá para checar abrindo o DevTools e olhando o painel de Rede no meio da conversão, onde nenhuma requisição de imagem de saída aparece. Converta várias de uma vez e elas sobem para o nosso servidor para serem tratadas juntas, depois esse download é limpo em cerca de 2 horas, e você pode tirá-lo você mesmo assim que salvar. De um jeito ou de outro, nada da sua imagem fica além de montar o seu download.

O WebP funciona em todos os navegadores?

Funciona, para todos os efeitos práticos. A leitura nativa chegou a todo lugar assim que o Safari 14 saiu em 2020, se juntando a Chrome, Edge e Firefox, que juntos respondem por quase todo navegador que as pessoas de fato usam. As exceções são os genuinamente antigos e algumas webviews embutidas, e para um público que possa incluir esses, o PNG segue como a aposta cautelosa. Quem está num navegador dos últimos cinco anos pega WebP sem problema. Se você quiser confirmar um caso específico, a entrada do WebP no caniuse.com mostra o suporte direitinho.

Os detalhes

Notas da equipe sobre ofício, formatos e as pequenas decisões por trás de um bom recorte redondo.

Como o WebP alcança tamanhos menores que o PNG
O WebP roda em dois modos separados. Seu modo sem perdas casa previsão espacial e de cor com uma etapa de entropia que supera o DEFLATE do PNG, aterrissando numa compressão cerca de 26 por cento melhor em imagens típicas pelos números publicados do Google. Seu modo com perdas pega emprestada uma transformação por blocos do mundo do vídeo, feita para soltar o detalhe que o olho mal nota enquanto segura o que ele segura. Quando uma imagem carrega alfa, o WebP comprime esse alfa sem perdas na sua própria trilha enquanto trata os dados RGB com perdas, e é assim que o WebP com perdas e transparência pode chegar perto de um terço do tamanho de um PNG com qualidade visual à altura. O DEFLATE do PNG só conhece o sem perdas e nunca consegue tocar a barganha perceptual que a trilha com perdas faz. Essa divisão estrutural é a razão inteira da diferença de tamanho.
O canal alfa em detalhe
Os dois formatos guardam transparência em 8 bits, ou seja, cada ponto da imagem pode carregar uma graduação de opacidade que vai de 0, completamente vazado, até 255, totalmente cheio. Na reconstrução feita pelo motor de imagem da plataforma, os valores RGBA são lidos ponto a ponto e a parcela de transparência segue por uma faixa própria, comprimida sem perdas, sem depender do tratamento dado à cor. Assim, um ponto vazado em 0, um meio-transparente em algum lugar entre 1 e 254 e um opaco em 255 reaparecem no WebP exatamente na mesma graduação em que estavam. Aquela borda macia de uma sombra projetada ou de um texto com antisserrilhado sobre fundo vazado chega do outro lado sem aspereza. É justamente o que o JPG não entrega, pois seu formato simplesmente não reserva espaço para transparência e precisa assentar a figura sobre uma cor antes de fechar o arquivo.
Core Web Vitals e a escolha do formato de imagem
O Largest Contentful Paint cronometra quanto o maior elemento visível de uma página leva para surgir na janela de visualização, e na maioria das páginas de conteúdo esse elemento é a imagem principal. O Google dobra o LCP dentro do seu sinal de ranqueamento Core Web Vitals, e o PNG é reincidente no LCP por puro peso, onde um PNG fotográfico em 4K pode rodar vários megabytes enquanto a mesma imagem como WebP quase sem perdas é uma fração disso. O PageSpeed Insights nomeia isso direto no seu item de formatos de nova geração e aponta o PNG como o formato a trocar. Virar os PNGs que ficam no caminho crítico de renderização de uma página em WebP está entre os movimentos únicos de maior retorno para velocidade medida. A linha do tempo mantém isso seguro, com WebP no Chrome desde 2011, no Firefox desde 2019, no Safari desde 2020 e no Edge desde sua reconstrução em Chromium.
Saída com perdas e o ajuste quase sem perdas
O WebP expõe um botão de qualidade de 0 a 100, onde números mais altos seguram mais detalhe e custam mais bytes. A Araluma fixa esse botão num ponto quase sem perdas escolhido para equilibrar fidelidade contra tamanho pelas categorias web de sempre, fotografias, gráficos de interface e ícones. Nesse ponto a saída se lê como indistinguível do PNG de origem em distâncias normais de tela. Estritamente, um pouco de precisão em nível de bit escorrega contra uma gravação verdadeiramente sem perdas, então uma checagem byte a byte entre o WebP decodificado e o PNG original revelaria pequenas folgas numéricas, todas abaixo do limiar da visão humana em material fotográfico. Para exames médicos, imagens de satélite ou preservação de arquivo onde sem perdas é regra dura, o movimento certo é manter o PNG e tratar o WebP puramente como uma exportação de entrega, não como cópia de trabalho.
Comportamento dos metadados
Virar um PNG em WebP varre os campos EXIF, IPTC e XMP para fora da saída, que é o que cada um dos três grandes motores de navegador faz. Os perfis de cor são onde os motores se separam. Chrome e Safari mantêm a marca sRGB viajando no WebP, enquanto o Firefox limpa tudo, o perfil ICC e o resto. Então o WebP se lê como seguro em sRGB em todo lugar, mas uma marca de gama ampla, Display-P3, Adobe RGB, ProPhoto RGB, sentada no PNG de origem não vai durar pelo Firefox. Essa folga morde no trabalho profissional com cor crítica, então quando a fidelidade de cor de verdade precisa viajar junto, escolha um conversor que escreva dados ICC de propósito, ou pressione a marca de perfil de volta depois usando um editor de metadados feito para a tarefa.
Quando manter o PNG e quando o WebP basta
Pense pelo destino da imagem. Se ela termina numa página ou aplicação aberta em qualquer navegador de 2020 para frente, exportar em WebP é o caminho natural. Vai parar dentro de um editor como Figma, Sketch ou Affinity Designer? Então confira antes se aquela versão específica abre WebP, porque o suporte oscila de programa para programa. Destino de gráfica pede cautela, ali o PNG ou o TIFF costumam ser o pedido, porque boa parte dos processadores de impressão não digere WebP. Mandar por e-mail também inclina a balança para o PNG, dada a falta de constância dos clientes de e-mail diante de formatos recentes. E para qualquer peça que entre em ciclos de edição e regravação, o lugar do PNG é o de matriz preservada. No balanço, o WebP brilha como formato de entrega quase sem perdas e o PNG continua reinando como arquivo de trabalho e de arquivamento, com o fluxo ideal guardando o PNG de origem e despachando o WebP para a web.