news 2026/4/16 23:14:53

数字图形处理篇---图像存储格式

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
数字图形处理篇---图像存储格式

我们可以把一张数字图像想象成一张由无数个微小“色块”拼成的画。图像的存储格式,就是决定如何“打包”这些色块信息,存成电脑文件的一套规则。

主要从两个层面来理解:像素结构文件封装


一、 像素层面:图像是怎么构成的?

所有数字图像的基本单位都是像素。你可以把它想象成一个极小的、有颜色的方块。

关键要素:

  1. 分辨率:图像横向和纵向各有多少个像素。例如1920x1080,就是横向1920个像素,纵向1080个像素,总共约207万个像素。

  2. 色彩深度:每个像素用什么方式来描述颜色。

    • 黑白图:每个像素只有黑或白,用1位(bit)表示(0或1)。

    • 灰度图:每个像素有256种不同的灰色层次(从纯黑到纯白),通常用8位(1字节)表示。

    • 彩色图:最常见的是RGB模式。每个像素的颜色由红、绿、蓝三个通道混合而成。每个通道通常用8位(0-255)表示亮度。

      • 例如:(255, 0, 0)是纯红,(0, 255, 0)是纯绿,(255, 255, 0)是黄色。

      • 这样一个像素就需要8位 × 3 = 24位(3字节),可以表示约1677万种颜色(这就是常说的“真彩色”)。

总结像素层面:图像就是一大堆按照网格排列的、带有RGB(或其它)颜色值的数字。直接存储这些原始数据,就是“位图”“RAW格式”,文件会非常大。


二、 文件格式层面:如何“打包”这些像素数据?

为了节省空间、便于使用,人们发明了各种图像文件格式。主要分两大类:

1. 无损压缩格式

原理:像打包行李时把衣服叠整齐、抽真空,但打开后衣服完好如初。图像数据被压缩后,解压还原100%相同。
特点:文件相对较大,但画质完美保留。
常见格式

  • PNG:网络图片明星。支持透明背景(镂空效果),非常适合图标、Logo、网页图形。

  • BMP:Windows的标准位图格式,几乎不压缩,文件巨大,现在很少用。

  • TIFF:印刷和专业领域的“老大哥”。支持多种色彩模式和图层,文件极大,用于出版、存档。

  • GIF:一个特例。它用索引色(最多256色),可做动画,也属于无损,但颜色数少不适合存彩色照片。

2. 有损压缩格式

原理:像做一道菜的精华版。会丢弃一些人眼不太敏感的细节信息来大幅减小文件体积。压缩得越狠,画质损失越明显(出现模糊、色块)。
特点:文件小,画质有损失,且每次编辑后重复保存会损失累积。
常见格式

  • JPEG/JPG照片格式的王者。通过智能地合并相似的色彩区域来压缩,非常适合色彩丰富、细节多的照片。不支持透明背景

  • WebP:谷歌推出的现代格式,旨在同时替代JPEG和PNG。在同等画质下,体积比JPEG小很多,也支持透明和动画,正逐渐流行。

3. “可编辑” vs “成品”格式
  • PSD, AI, XCF 等:这是工程文件格式。像做菜的完整厨房,保留了所有图层、文字、效果等原始信息,方便后续修改。只能用特定软件(如Photoshop, Illustrator)打开编辑。

  • 上面提到的JPEG、PNG等:这是导出/发布格式。像已经装盘上桌的菜,所有图层都合并成一张图,体积小,通用性强,适合分享和发布。


总结与类比

格式压缩类型主要特点典型用途好比…
JPEG有损文件小,色彩丰富,不支持透明网络照片、生活照可调节压缩率的MP3,体积小听着还行
PNG无损支持透明背景,色彩还原准图标、Logo、网页图形ZIP压缩包,解压后原封不动
GIF无损(索引色)颜色少(256色),支持动画简单动画、表情包古老的翻页动画书
TIFF通常无损质量极高,文件巨大专业印刷、图像存档音乐母带/WAV文件,保真但巨大
BMP基本无压缩毫无压缩,原汁原味,文件最大极少使用未切割的原材料
PSD特殊保留所有编辑信息图像设计、后期处理厨房里的所有食材和锅碗瓢盆
WebP都支持现代,高效,集合众长网页图像(逐渐普及)高效的HEVC视频编码,又好又小

如何选择?

  • 存照片、分享到网络:用JPEG,注意控制压缩质量(一般85%左右)。

  • 存Logo、图标、需要透明背景:用PNG

  • 做动画表情:用GIFAPNG/WebP

  • 专业设计、印刷:用TIFFPSD(工程文件)+JPEG/PNG(成品文件)

  • 追求最新技术、为网站优化:尝试WebP

简单来说,图像的存储格式就是在画质、文件大小和功能(透明、动画)之间做权衡和选择。希望这个解释能帮你清晰地理解!

🖼️ 图像格式狂徒总结表

📊 核心对比速查

格式压缩类型透明度动画最佳用途文件大小画质
JPEG/JPG🔥 有损❌ 不支持❌ 不支持照片、网页图片良好(有损)
PNG✅ 无损✅ 支持❌ 不支持Logo、图标、透明图中等完美
GIF✅ 无损(索引色)✅ 支持✅ 支持简单动画、表情包小-中差(仅256色)
WebP🔥 有损 / ✅ 无损✅ 支持✅ 支持现代网页、全面替代很小优秀
TIFF✅ 通常无损✅ 支持❌ 不支持专业印刷、存档很大完美
BMP❌ 无压缩❌ 不支持❌ 不支持基本被淘汰极大原始
PSD/AI特殊格式✅ 支持❌ 不支持设计源文件、可编辑完美

🎯 一句话选格式指南

日常使用场景:

  • “我要存手机照片发朋友圈”JPEG(质量选85%)

  • “我要做个透明Logo放网站上”PNG

  • “我要做个动图表情包”GIF(简单)或WebP(效果好)

  • “我要最高质量打印海报”TIFFPNG

  • “我要保存设计稿以后还能改”PSD/AI(源文件)+PNG/JPEG(成品)

网页开发者:

  • “我要最优网页性能”WebP(首选) +JPEG/PNG(兼容备胎)

  • “我要图标和UI元素”PNG(透明需求)或SVG(矢量!)


🔧 技术要点速记

色彩模式简记:

  • RGB:屏幕显示用(红绿蓝)

  • CMYK:印刷用(青品黄黑)

  • 索引色:GIF专用(最多256色)

压缩原理:

  • 有损压缩:扔掉人眼不敏感的数据(如JPEG)

  • 无损压缩:找规律重新编码,不丢数据(如PNG的“找相同色块”)

透明通道:

  • Alpha通道:PNG/TIFF支持,平滑透明

  • 二值透明:GIF支持,要么全透要么不透


💡 实用冷知识

  1. JPEG每保存一次,画质损失一次→ 编辑时应保留原图,最后再导出JPEG

  2. PNG-8 vs PNG-24→ PNG-8类似GIF(256色),PNG-24才是真彩色

  3. WebP是谷歌的亲儿子→ 现代浏览器都支持,比JPEG小25-35%

  4. 矢量图 vs 位图→ 矢量(SVG/AI)无限放大不模糊,位图(JPEG/PNG)放大就模糊


🚀 2024年推荐策略

场景首选格式备选格式
网页照片WebPJPEG
网页图形WebP(有损/无损)PNG
动画WebP(动画)或 APNGGIF
专业工作流PSD/TIFF(源文件)→ 导出按需
通用分享JPEG(兼容性之王)

📱 手机存图小贴士

  • 日常拍照:手机默认JPEG即可

  • 截屏/录屏:通常PNG,质量更好

  • 重要文件拍照:用扫描APP,存PDF或JPEG

  • 保存网页图片:长按看清格式,通常JPEG或PNG


记住:没有“最好”的格式,只有“最合适”的格式!🎨

口诀:照用JPG,透用PNG,动用GIF,新用WebP,印用TIFF,改存PSD

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/16 16:47:08

2025年12月Scratch图形化编程等级考试四级真题试卷

更多内容和历年真题请查看网站:【试卷中心 -----> 电子学会 ----> 图形化Scratch ----> 四级】 网站链接 青少年软件编程历年真题模拟题实时更新 202512 青少年软件编程等级考试Scratch四级真题 试卷…

作者头像 李华
网站建设 2026/4/16 23:14:00

fpga verilog 实现串口收发通信,上板可直接通信 支持xilinx和altera

fpga verilog 实现串口收发通信,上板可直接通信 支持xilinx和altera这玩意儿搞过FPGA的都知道,串口通信算是基本功里的战斗机了。今天咱们直接撸代码,不废话硬件原理,反正就是搞个能收能发的模块,Xilinx的板子和Altera…

作者头像 李华
网站建设 2026/4/16 11:50:59

Java面试必看:start()和run()哪个才是正确的线程启动方式?

文章目录 Java面试必看:start() 和 run() 哪个才是正确的线程启动方式?一、线程的那些事儿二、初探start()和run()1. start()的作用2. run()的作用3. start()和run()的区别 三、深入理解线程机制1. 线程的状态转换2. start()背后的机制3. run()的实现 四…

作者头像 李华
网站建设 2026/4/17 12:12:40

【易经系列】初九,磐桓,利居贞,利建侯。

文章目录1. 词义拆解2. 深层含义3. 应用场景3.1. 职场应用:新官上任或新项目启动3.2. 投资应用:价值投资与左侧交易初九,磐桓,利居贞,利建侯。 《象》曰:虽磐桓,志行正也。以贵下贱,…

作者头像 李华
网站建设 2026/4/16 12:40:36

《AI Coding手册:Claude Code、OpenAI Codex、OpenClaw深度解析与实战指南》

《AI Coding手册:Claude Code、OpenAI Codex、OpenClaw深度解析与实战指南》 手册概述 手册定位:本手册是面向专业软件开发者的AI辅助编程权威指南,系统解析Claude Code、OpenAI Codex和OpenClaw三大主流AI编码智能体的技术架构、应用方法和最佳实践。 核心方法论:采用&…

作者头像 李华