Como sei que tipo de imagem usar?

8

Estou trabalhando em um site que utilizará imagens em vários aplicativos diferentes, desde botões de ação a avatares e imagens maiores. Quais fatores devo levar em consideração para decidir se essas imagens devem ser jpgs, gifs ou pngs?

— BenV
fonte

6

JPG para fotos ou grandes diferenças de cores
PNG para imagens com transparência gradual (desbotamento de 1 cor para claro)
GIF para imagens com pequenas paletas de cores

Obviamente, experimente cada imagem e veja o que resulta no menor tamanho de arquivo. Quanto menor o tamanho, melhor. Além disso, não se preocupe com a transparência no IE6 para seus PNGs, a avó não está tão preocupada com a aparência do site, apenas com o fato de poder ver fotos suas nele.

— XOPJ
fonte

3

Tamanho do arquivo. Quanto menor o tamanho do arquivo, mais rápido ele fará o download para seus usuários. Portanto, escolha o menor tamanho de arquivo que não afete a qualidade da imagem.

(Geralmente, os JPGs são usados para fotografias e os PNGs / GIFs são usados para imagens semelhantes a ícones)

— John Conde
fonte

11

Eu acrescentaria isso para capturas de tela da interface do usuário / não fotos - use PNG. O JPEG tende a pixelizar terrivelmente imagens que não são fotográficas.

— scunliffe

1

Suporte do navegador . Eu acho que é IE6 ou IE7 e mais antigo não suportam imagens baseadas em png com um fundo transparente adequadamente. Geralmente, adiciona alguma cor de fundo divertida.

— Jeremy
fonte

11

Somente o IE6 tem problemas com PNGs transparentes. IE7-9 está bem com eles.

— bdadam

IE4 e suporte mais recente paletizado PNG com transparência : calendar.perfplanet.com/2010/png-that-works/#paletted

— Kornel