我应该使用什么图像类型?GIF,JPG还是PNG?

Asc*_*ian 8 html image

我正在尝试为自己创建一个个人主页,以了解有关网页设计(JavaScript,使用Photo Shop等)的更多信息.我打算在左边有一个图形菜单,在顶部有一个横幅,还有一个"照片"部分,在那里我可以显示我拍摄的各种照片的照片.

但是,当我查看其他类似的网站时,我看到一些使用GIF,有些使用JPG,有些甚至使用PNG.这些之间有什么区别吗?我应该使用GIF用于网站上使用的图形图像和JPG用于我的照片吗?我应该制作一切PNG吗?


完全重复:

GvS*_*GvS 23

解释它的XKCD风格漫画:

替代文字

http://lbrandy.com/blog/2008/10/my-first-and-last-webcomic/

  • 绝对是!XKCD.稍微解释一下:你在右侧看到的是JPEG压缩伪像 - JPEG对于照片很有用(有损压缩在那里更可忍受),但是在锐利的边缘上它不会很好.这就是PNG的用途(左侧). (3认同)

tho*_*ter 22

在以下情况下应使用PNG:

  • 您需要透明度(1位或Alpha透明度)
  • 无损压缩效果很好(例如图表或徽标,或计算机生成的图像)

在以下情况下应使用JPEG:

  • 无损压缩效果不佳(例如照片)

GIF应该在以下时间:

  • PNG不可用,例如在非常旧的软件或浏览器上
  • 动画是必要的

尽管有相反的神话,但PNG在大多数方面都优于GIF.除了动画之外,PNG能够实现GIF的每种图像模式,并且当使用相同的图像模式时,由于其优于DEZATE算法,与LZW相比,PNG将具有更好的压缩.PNG还能够提供GIF无法做到的其他模式,例如24位颜色和Alpha透明度,但这是您需要注意的地方:如果您忘记转换为调色板模式,您的PNG图像可能会以24位颜色保存这将占用更多空间.

PNG模式包括(这只是一小部分)

  • 调色板颜色为2至256色(如GIF)
  • 调色板颜色为2至256色,透明色(如GIF)
  • 真彩色(24位色)
  • 带alpha通道的真彩色(24位色+ 8位Alpha透明度)

要在Web上使用PNG进行最佳压缩,请使用调色板模式.如果您发现PNG文件大于等效的GIF文件,那么您将以24位颜色保存PNG并在调色板模式下保存GIF(因为GIF始终处于调色板模式).首先尝试转换为调色板模式.

PNG还有其他模式,如调色板颜色和alpha透明度.此类模式无法在Photoshop中创建,但其他应用程序可以创建它们.

编辑2013:删除了一堆关于IE6兼容性的东西.


Ste*_*erg 7

使用JPG照片和PNG照片以外的所有照片.GIF实际上并不是一个非常好的格式,PNG可以在大多数应用程序中完全替换它的压缩和质量,但有时会出现兼容性问题,不确定这些是否已经在所有当前的webbrowsers中解决了.基本上所有东西都可以读取GIF,所以当它非常有用时.


Kor*_*nel 5

对于按钮,图标,徽标使用PNG.仅在需要小动画图像时才使用GIF.

PNG可以完成GIF所能做的所有事情(除了动画,甚至是APNG中的那个),并且应该几乎总是更小.如果PNG不小于GIF,那么您的软件可能会将其保存得很差 - 寻找PNG优化程序,如PNGOUT和pngnq.


归档时间:

查看次数:

14468 次

最近记录:

12 年,2 月 前