Você deve estar ciente de alguns fatores-chave ...
Primeiro, existem dois tipos de compactação: sem perdas e com perdas .
- Sem perdas significa que a imagem é reduzida, mas sem prejudicar a qualidade.
- Com perdas significa que a imagem é feita (ainda) menor, mas prejudica a qualidade. Se você salvasse uma imagem em um formato com perda repetidamente, a qualidade da imagem pioraria progressivamente.
Também existem diferentes profundidades de cores (paletas): cores indexadas e cores diretas .
- Indexado significa que a imagem pode armazenar apenas um número limitado de cores (geralmente 256), controlado pelo autor, em algo chamado Mapa de Cores
- Direto significa que você pode armazenar milhares de cores que não foram escolhidas diretamente pelo autor
BMP - Sem perdas / indexado e direto
Este é um formato antigo. É sem perdas (nenhum dado de imagem é perdido ao salvar), mas também há pouca ou nenhuma compactação, o que significa que o BMP resulta em tamanhos de arquivo MUITO grandes. Pode ter paletas indexadas e diretas, mas isso é um pequeno consolo. Os tamanhos dos arquivos são tão desnecessariamente grandes que ninguém realmente usa esse formato.
Bom para: nada realmente. Não há nada que o BMP se destaque ou que não seja feito melhor por outros formatos.
GIF - somente sem perdas / indexado
O GIF usa compactação sem perdas, o que significa que você pode salvar a imagem repetidamente e nunca perder dados. Os tamanhos dos arquivos são muito menores que o BMP, porque uma boa compactação é realmente usada, mas só pode armazenar uma paleta Indexada. Isso significa que, na maioria dos casos de uso , só pode haver no máximo 256 cores diferentes no arquivo. Parece uma quantidade bastante pequena, e é.
As imagens GIF também podem ser animadas e ter transparência.
Bom para: logotipos, desenhos de linha e outras imagens simples que precisam ser pequenas. Realmente usado apenas para sites.
JPEG - Perdido / Direto
As imagens JPEG foram projetadas para tornar as imagens fotográficas detalhadas tão pequenas quanto possível, removendo as informações que o olho humano não notará. Como resultado, é um formato com perda e salvar o mesmo arquivo repetidamente resultará na perda de mais dados ao longo do tempo. Ele possui uma paleta de milhares de cores e, portanto, é ótimo para fotografias, mas a compactação com perdas significa que é ruim para logotipos e desenhos de linha: eles não apenas parecerão confusos, mas também terão um tamanho de arquivo maior em comparação aos GIFs!
Bom para: fotografias. Além disso, gradientes.
PNG-8 - Sem perdas / indexado
PNG é um formato mais recente e PNG-8 (a versão indexada de PNG) é realmente um bom substituto para GIFs. Infelizmente, no entanto, há algumas desvantagens: primeiro, ele não suporta animação como o GIF (pode, mas pode ser, mas apenas o Firefox parece suportá-la, ao contrário da animação GIF suportada por todos os navegadores). Em segundo lugar, há alguns problemas de suporte com navegadores mais antigos como o IE6. Em terceiro lugar, softwares importantes como o Photoshop têm uma implementação muito ruim do formato. (Porra, Adobe!) O PNG-8 pode armazenar apenas 256 cores, como GIFs.
Bom para: O principal fator que o PNG-8 faz melhor que os GIFs é ter suporte para a transparência alfa.
PNG-24 - Sem perdas / direto
PNG-24 é um ótimo formato que combina a codificação sem perdas com cores diretas (milhares de cores, assim como JPEG). É muito parecido com o BMP nesse sentido, exceto que o PNG realmente comprime imagens, resultando em arquivos muito menores. Infelizmente, os arquivos PNG-24 ainda serão maiores que os JPEGs (para fotos) e GIFs / PNG-8s (para logotipos e gráficos); portanto, você ainda precisa considerar se realmente deseja usá-lo.
Embora os PNG-24s permitam milhares de cores durante a compactação, eles não se destinam a substituir imagens JPEG. Uma fotografia salva como PNG-24 provavelmente será pelo menos 5 vezes maior que uma imagem JPEG equivalente, com muito pouca melhoria na qualidade visível. (Obviamente, esse pode ser um resultado desejável se você não estiver preocupado com o tamanho do arquivo e desejar obter a melhor qualidade de imagem possível.)
Assim como o PNG-8, o PNG-24 também suporta transparência alfa.
SVG - sem perdas / vetor
Um tipo de arquivo que está crescendo em popularidade atualmente é o SVG, que é diferente do que acima, pois é um formato de arquivo vetorial (os acima são todos rasterizados ). Isso significa que na verdade é composto de linhas e curvas em vez de pixels. Ao ampliar uma imagem vetorial, você ainda vê uma curva ou uma linha. Ao ampliar uma imagem raster, você verá pixels.
Por exemplo:
Isso significa que o SVG é perfeito para logotipos e ícones que você deseja manter a nitidez nas telas Retina ou em tamanhos diferentes. Isso também significa que um pequeno logotipo SVG pode ser usado em um tamanho muito maior (maior) sem degradar a qualidade da imagem - algo que exigiria um arquivo maior separado (em termos de tamanho de arquivo) com formatos raster.
Os tamanhos de arquivo SVG geralmente são pequenos, mesmo visualmente muito grandes, o que é ótimo. Vale lembrar, no entanto, que depende da complexidade das formas usadas. Os SVGs requerem mais poder computacional do que as imagens rasterizadas, porque cálculos matemáticos estão envolvidos no desenho das curvas e linhas. Se o seu logotipo for especialmente complicado, ele pode tornar o computador do usuário mais lento e até ter um tamanho de arquivo muito grande. É importante que você simplifique o máximo possível as formas vetoriais.
Além disso, os arquivos SVG são gravados em XML e, portanto, podem ser abertos e editados em um editor de texto (!). Isso significa que seus valores podem ser manipulados em tempo real. Por exemplo, você pode usar o JavaScript para alterar a cor de um ícone SVG em um site, da mesma forma que faria com algum texto (ou seja, sem necessidade de uma segunda imagem), ou até mesmo animá-los.
No total, eles são melhores para formas planas simples, como logotipos ou gráficos.
Espero que ajude!