PNG versus SVG.

Se você trabalha com logotipos digitais e gráficos de alta qualidade, talvez considere salvar seus arquivos como PNG ou SVG. Os dois são formatos versáteis com resoluções altas, mesmo em grande escala. Aprenda as principais diferenças entre PNGs e SVGs e como usar cada tipo de arquivo.

Imagem do banner PNG versus SVG

O que você aprenderá.

 

  • O que é um arquivo PNG?
     
  • O que é um arquivo SVG?
     
  • Qual é a diferença entre arquivos PNG e SVG?
     
  • Arquivos PNG versus SVG: perguntas frequentes

 

 

O que é um arquivo PNG?

Os PNGs (Portable Network Graphics) são arquivos rasterizados. Eles têm resoluções altas, compactação sem perdas, transparência e a capacidade de processar 16 milhões de cores. Isso faz deles uma excelente escolha para gráficos, logotipos, tabelas, ilustrações e fotografias muito detalhadas. Como os arquivos PNG costumam ser grandes, eles não são recomendados para fotos digitais.

 

Saiba mais sobre os arquivos PNG

 

 

O que é um arquivo SVG?

Os SVGs (Scalable Vector Graphics) funcionam bem com logotipos e gráficos porque você pode redimensioná-los para diferentes finalidades. Eles também são bastante usados para design da Web porque mecanismos de pesquisa como o Google leem a linguagem de programação XML desse formato. Isso ajuda na SEO e nas classificações do site.

 

Ao contrário dos PNGs, os arquivos SVG são vetoriais, ou seja, usam algoritmos matemáticos para exibir imagens, que você pode redimensionar para qualquer tamanho sem afetar negativamente a qualidade delas.

 

Saiba mais sobre os arquivos SVG

 

 

Qual é a diferença entre arquivos PNG e SVG?

Há muitas semelhanças entre os formatos PNG e SVG. Agora é hora de descobrir as diferenças.

 

Rasterizado versus vetorial.

Talvez a principal diferença entre os arquivos PNG e SVG seja o fato de um formato ser rasterizado e o outro ser vetorial.

 

O PNG é um formato de imagem rasterizado (baseado em pixels). Se você aumentar demais uma imagem rasterizada, ela ficará com um efeito granulado ou pixelizado. Da mesma forma, se a imagem for muito pequena, ela poderá ficar irreconhecível. Os PNGs podem processar resoluções altíssimas, mas não são infinitamente expansíveis.

 

Por outro lado, os arquivos SVG são vetoriais, criados com base uma rede matemática complexa de linhas, pontos, formas e algoritmos. Eles podem ser expandidos para qualquer tamanho sem perder a resolução.

 

Saiba mais sobre os arquivos rasterizados e vetoriais

 

Tamanhos de arquivo.

Os arquivos PNG geralmente são tão grandes que conseguem processar resoluções altas. Devido ao tamanho, eles levam mais tempo para serem processados, compartilhados, salvos e abertos. Isso também pode aumentar o tempo de carregamento das páginas. É por isso que os arquivos JPEG são mais comuns para fotografia online. No entanto, existe uma variante PNG menor de 8 bits, mas ela só aceita 256 cores.

 

Os arquivos SVG são muito menores que os PNGs e não costumam deixar seu computador ou site lento. (No entanto, designs muito detalhados podem deixar o arquivo SVG lento.) Como os SVGs são vetoriais, é possível redimensioná-los sem perder a qualidade.

 

Compactação.

Os arquivos SVG oferecem compactação sem perdas, ou seja, eles podem ser diminuídos sem perder definição, detalhes ou qualidade.

 

Os arquivos PNG também oferecem uma compactação sem perdas de 5% a 20%, o que compensa o tamanho grande deles. No entanto, eles provavelmente ainda serão maiores que os SVGs.

 

Fotografia.

Os arquivos PNG não são uma escolha comum para fotos online, conforme mencionado acima. No entanto, eles podem processar fotos digitais de alta qualidade e muito detalhadas para impressão, edição, entre outras finalidades. Eles são um formato de arquivo comum no Adobe Photoshop.

 

Os SVGs, por outro lado, não usam pixels, então têm dificuldades para exibir fotos em um padrão alto.

 

Uso na Web.

Arquivos PNG e SVG podem exibir detalhes complexos de gráficos, ilustrações, logotipos, infográficos e tabelas na Web.

 

Porém, os SVGs têm uma vantagem importante: a linguagem de programação XML. Isso significa que cada arquivo SVG exibido está em texto, não código. Como resultado, os leitores de tela e mecanismos de pesquisa podem analisá-los, o que os torna ideais para acessibilidade e SEO.

 

Os arquivos SVG também costumam ser menores, o que acelera o carregamento deles nas páginas. O tempo de carregamento é outro elemento fundamental das classificações nos mecanismos de pesquisa.

 

Os arquivos PNG também aceitam alguns gráficos de texto, mas não no mesmo nível. 

 

Compatibilidade e complexidade.

O formato SVG é considerado um tipo de arquivo mais avançado que o PNG, mas não é compatível com todos os navegadores e sistemas operacionais. Além disso, a linguagem de programação e a composição vetorial do SVG podem ser desconhecidas e difíceis para novos usuários.

 

Os PNGs, por outro lado, são um formato online padrão com suporte amplo dos navegadores e sistemas operacionais.

 

Animação.

Os arquivos PNG não são compatíveis com animações, ao contrário de um arquivo de imagem rasterizado similar, o GIF.

 

Os arquivos SVG aceitam animações, mas não são facilmente acessíveis como outros formatos, como o formato nativo do Adobe Illustrator, o AI.

 

Saiba mais sobre os arquivos AI

 

Transparência.

Os PNGs e SVGs oferecem transparência, então são ótimas escolhas para gráficos e logotipos online.

 

É importante mencionar que os PNGs são uma das melhores opções para arquivos rasterizados transparentes. Se você trabalha com pixels e transparência, os PNGs são uma opção melhor que os SVGs.

 

 

Arquivos PNG versus SVG: perguntas frequentes.

Como converter uma imagem rasterizada em SVG?

Para converter um arquivo de imagem rasterizado padrão (como JPEG ou PNG) em um SVG vetorial, siga estas etapas simples:

 

  1. Abra o Adobe Illustrator.
     
  2. Clique em Arquivo > Abrir para selecionar sua imagem no computador.
     
  3. Clique em Abrir.
     
  4. Selecione a opção Traçado no menu superior e escolha Traçado da imagem.
     
  5. Ajuste a conversão de acordo com suas especificações, o que pode incluir a alteração da cor.
     
  6. Depois que o processo for concluído, selecione o traçado da imagem e clique em Desagrupar. Isso separa as formas da cor.
     
  7. Clique em Arquivo > Exportar.
     
  8. Salve seu arquivo como SVG.

 

Como converter um arquivo SVG em PNG?

Siga estas etapas simples para converter seu arquivo SVG em PNG usando o Adobe Photoshop:

 

  1. Abra o Adobe Photoshop.

  2. Clique em Arquivo > Abrir.
     
  3. Selecione o arquivo SVG no seu computador.
     
  4. Clique em Exportar > Exportar como > PNG.
     
  5. Salve seu arquivo como PNG.

 

Qual é o melhor arquivo vetorial para impressão?

Existem vários arquivos vetoriais excelentes para impressão, então sua escolha depende do documento. Os PDFs são o formato vetorial mais versátil para impressão no dia a dia. No caso de tarefas de impressão grandes, escolha SVG ou AI.

 

Devo usar PNG ou JPEG?

A compactação com perdas e o esquema de cores de 24 bits do formato JPEG fazem dele a melhor opção para fotos online. No entanto, os arquivos JPEG não têm o mesmo nível de detalhes dos PNGs quando se trata de impressão. Além disso, os JPEGs não têm a mesma definição ou capacidade de redimensionamento, então não são recomendados para logotipos e gráficos.

 

Qual é a diferença entre arquivos PNG e GIF?

Os dois são formatos de arquivo rasterizados padrão na Web, mas o PNG é praticamente a próxima geração do GIF. Ainda assim, existem várias diferenças entre eles (por exemplo, os PNGs não aceitam animações).

 

Os limites de tamanho se aplicam a arquivos PNG e SVG?

Os arquivos PNG têm um limite de 2.500 megapixels. Não há limites para o tamanho dos arquivos vetoriais, incluindo SVGs.

Compare PNGs e SVGs com outros tipos de arquivos.

Imagem EPS versus SVG

EPS versus SVG

Veja uma comparação entre o SVG e EPS, que é mais antigo.

Imagem JPEG versus PNG

JPEG versus PNG

Descubra a opção certa entre esses arquivos de imagem rasterizados padrão.

Imagem PNG versus TIFF

PNG versus TIFF

Saiba como esses arquivos gerenciam imagens grandes e de alta definição. 

Imagem GIF versus PNG

GIF versus PNG

Entenda por que o PNG é a próxima geração do GIF e se ele é a opção certa para seu projeto.

Adquira o Adobe Illustrator

Crie ilustrações e artes vetoriais incríveis.

Após 7 dias grátis, 24,59 €/mês.