前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >图片格式基础信息

图片格式基础信息

作者头像
全栈工程师修炼指南
发布2022-09-28 20:17:03
8790
发布2022-09-28 20:17:03
举报

[TOC]

0x00 快速入门

现在我们接触到的大多图片格式为:gif、png、jpg、tiff、BWP等等

无论是 HTML 还是 XHTML 都没有规定图像的官方格式。然而流行的浏览器却专门规定了一定的图像格式,通常情况下是 GIF 和 JPEG,在网页中也能显示图片根据页面的消息头来定义。

在 Web 出现以前,这两种图像格式已经得到了广泛使用,所以有大量支持软件可以帮助我们以这两种格式创建图像。然而这两种格式各自有其优缺点,有些浏览器会利用其特性来实现特殊的显示效果。


GIF

GIF 格式指的是图像交换格式(Graphics Interchange Format,GIF),该格式最初是 CompuServe 为其在线服务用户传输图像而开发的,由于它有很多特性因此在 HTML/XHTML 中十分普及。

(1)首先,它的编码技术在许多平台上都可以使用。所以通过适当地 GIF 解码软件(大多数浏览器都含有这种软件),在 Macintosh 上创建并组成 GIF 文件的图像,在基于 Windows 的 PC 上也可以毫不费力地加载、解码并查看。

(2)GIF 格式的第二个特性是,它采用了一种特殊的压缩技术,可以显著减小图像文件的大小,从而得以在网络上更快地进行传输。而 GIF 压缩是“无损”压缩,也就是说,图像中原来的数据都不会发生改变或丢失,所以解压缩并解码后的图像与原来的图像完全一样,GIF 图像还非常容易实现动画效果。

GIF 格式的版本和颜色:

  • GIF 图像文件都用 .gif (或者 .GIF)作为文件名后缀,实际上却有两个 GIF 版本原始的 GIF87 和 GIF89a后者支持很多新特性,包括透明背景、交叉存储和动画等,这些特性在 Web 创作者中的使用十分普及。
  • 两种 GIF 格式,它们都是通过同一种方案来把 8 位的像素值映射到一个颜色表当中,这样每个图像最多可以有 256 种颜色。
  • 大多数 GIF 图像实际颜色的数目更少,通过简化颜色,可以创建更小的颜色映像并且强化像素冗余,来使文件压缩得更多,从而使下载速度更快。
  • 透明性 GIF 图像(实际上是 GIF89a 格式的图像)另外一种常见的效果,是它可以让图像的一部分变成透明效果。
    • GIF89a 格式的图像特点:可以实现简单的逐帧动画

GIF 图像有三种特殊的技巧:

  • 隔行扫描(interlacing): GIF 图像可以在屏幕上一下子显现出来,而不是从上到下逐步地显示;
    • 用 GIF 编码的图像是像素数据从图像的顶部到底部顺次、逐行排列的一个序列,用户只需要用下载并显示一整幅图像的四分之一时间,就可以看到一个从上到下非常完整的图像(就是比较模糊)
  • 透明性(transparency)
  • 动画(animation)
JPEG

JPEG联合图像专家组(Joint PhotograPhic ExPerts Group,JPEG)是开发我们现在所使用的 JPEG 图像编码格式的标准化组织,JPEG 是在 Web 上使用的主要图像格式之一,JPEG 格式通常由 .jpg (或者 .JPG)文件名来结尾,现在,几乎所有图形浏览器都可以识别这种格式,只有在极少的情况下才可能遇到那些无法直接显示 JPEG 图像的老式浏览器。

JPEG 图像的概念和特性:

  • JPEG 图像也是独立于平台的,而且为了通过数字通信技术来高速传播,而专门进行了压缩。
  • GIF 不一样的是,JPEG 支持数以万计的颜色,可以显示更加精细而且像照片一样逼真的数字图像。
  • JPEG 使用的是特殊的压缩算法,从而可以实现非常高的压缩比,但是JPEG 使用的压缩和解压缩算法使得它在处理大范围的颜色块时,会留下很明显的人工痕迹;

例如:把 200 KB 大小的 GIF 图像压缩到只有 30 KB 大小的 JPEG 图像,这种情况非常普通。为了达到这样惊人的压缩率,JPEG 要损失一些图像数据。 然而,通过专门的 JPEG 工具可以调整这个“损失率”,这样,尽管压缩后的图像和原来的图像并不完全一样,但它们可以非常接近,以至于大多数人都无法分辨出之间的差别。

在网页中如何改善由图像带来的负载和延迟问题?

  • 重复利用图像 : 对于图标和 GIF 动画尤其适用
  • 分割大文档 : 包含图像的一般原则
  • 必要时隔离大图形
  • 指定图像的尺寸

建议使用JPEG 还是 GIF? 答:如果图像的来源或者你的工具软件更倾向于某一种格式,您可能只能使用 JPEG 或者 GIF 图像中的一种。现在这两种格式都得到了浏览器的广泛支持,所以不会存在用户能否浏览的问题。

  • 然而我们还是建议您使用一定的工具去创建或者转换这两种格式,以充分利用它们各自的功能。
  • 例如可以把 GIF 的透明特性应用在图标和小的装饰符号上,而利用 JPEG 来压缩那些较大的颜色丰富的图像以加快下载速度。
0x00 进阶分析

各种图片的头尾格式HEX一览:

图片格式

头部HEX

尾部HEX

png

89 50

60 82

jpg

FF DB

FF D9

本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
原始发表:2019-06-24,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 0x00 快速入门
    • GIF
      • JPEG
      • 0x00 进阶分析
      相关产品与服务
      文件存储
      文件存储(Cloud File Storage,CFS)为您提供安全可靠、可扩展的共享文件存储服务。文件存储可与腾讯云服务器、容器服务、批量计算等服务搭配使用,为多个计算节点提供容量和性能可弹性扩展的高性能共享存储。腾讯云文件存储的管理界面简单、易使用,可实现对现有应用的无缝集成;按实际用量付费,为您节约成本,简化 IT 运维工作。
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档