C1-02能力认证拓展任务和自测详解

一、拓展任务

任务内容:

1.通过搜索引擎了解bmp或png文件数据格式的特征

参考大佬博客：转自PNG,JPEG,BMP,JIF图片格式详解及其对比，小编对常见的常见的图片文件格式及其特点进行简单分析，同时对bmp和png文件数据格式的特征进行下案例分析。

目前市场上主流的图片文件格式大概有BMP、GIF、JPEG、TIFF、PSD、PNG、SVG、SWF等格式组成。

①BMP格式是Windows操作系统中的标准图像文件格式。特点是包含的图像信息较丰富，几乎不进行压缩。缺点是占用磁盘空间过大。所以，目前BMP在单机上比较流行。

②GIF格式特点是压缩比高，磁盘空间占用较少。此外，考虑到网络传输中的实际情况，GIF图像格式还增加了渐显方式。GIF图像文件短小、下载速度快、可用许多具有同样大小的图像文件组成动画等优势是分不开的。但GIF有个小小的缺点，即不能存储超过256色的图像。

③JPEG格式的文件的扩展名为.jpg或.jpeg，其压缩技术十分先进，它用有损压缩方式去除冗余的图像和彩色数据，获取得极高的压缩率的同时能展现十分丰富生动的图像（用最少的磁盘空间得到较好的图像质量）。同时JPEG还是一种很灵活的格式，具有调节图像质量的功能，允许你用不同的压缩比例对这种文件压缩。JPEG格式的文件具有尺寸较小，下载速度快，使得Web页有可能以较短的下载时间提供大量美观的图像。

④TIFF格式的特点是图像格式复杂、存贮信息多。正因为它存储的图像细微层次的信息非常多，图像的质量也得以提高。该格式有压缩和非压缩二种形式，其中压缩可采用LZW无损压缩方案存储。不过，由于TIFF格式结构较为复杂，兼容性较差，因此有时你的软件可能不能正确识别TIFF文件（现在绝大部分软件都已解决了这个问题）。目前在Mac和PC机上移植TIFF文件也十分便捷，因而TIFF现在也是微机上使用最广泛的图像文件格式之一。

⑤PSD格式其实是Photoshop进行平面设计的一张"草稿图"，它里面包含有各种图层、通道、遮罩等多种设计的样稿，以便于下次打开文件时可以修改上一次的设计。在Photoshop所支持的各种图像格式中，PSD的存取速度比其它格式快很多，功能也很强大。

⑥PNG格式特点是存贮形式丰富，兼有GIF和JPG的色彩模式；采用无损压缩方式来减少文件的大小；显示速度很快，只需下载1/64的图像信息就可以显示出低分辨率的预览图像；PNG同样支持透明图像的制作，透明图像在制作网页图像的时候很有用，我们可以把图象背景设为透明，用网页本身的颜色信息来代替设为透明的色彩，这样可让图像和网页背景很和谐地融合在一起。PNG的缺点是不支持动画应用效果利用。

⑦SVG格式意思为可缩放的矢量图形。它是一种开放标准的矢量图形语言，可让你设计激动人心的、高分辨率的Web图形页面。用户可以直接用代码来描绘图像，可以用任何文字处理工具打开SVG图像，通过改变部分代码来使图像具有互交功能，并可以随时插入到HTML中通过浏览器来观看。它提供了目前网络流行格式GIF和JPEG无法具备了优势：可以任意放大图形显示，但绝不会以牺牲图像质量为代价；字在SVG图像中保留可编辑和可搜寻的状态；平均来讲，SVG文件比JPEG和GIF格式的文件要小很多，因而下载也很快。

⑧SWF格式这种格式的动画图像能够用比较小的体积来表现丰富的多媒体形式。在图像的传输方面，不必等到文件全部下载才能观看，而是可以边下载边看，因此特别适合网络传输，特别是在传输速率不佳的情况下，也能取得较好的效果。事实也证明了这一点，SWF如今已被大量应用于WEB网页进行多媒体演示与交互性设计。此外，SWF动画是其于矢量技术制作的，因此不管将画面放大多少倍，画面不会因此而有任何损害。综上，作品以其高清晰度的画质和小巧的体积，受到了越来越多网页设计者的青睐，也越来越成为网页动画和网页图片设计制作的主流，目前已成为网上动画的事实标准。

bmp和png文件数据格式的特征

（一）BMP格式

BMP是英文Bitmap（位图）的简写，它是Windows操作系统中的标准图像文件格式，能够被多种Windows应用程序所支持。随着Windows操作系统的流行与丰富的Windows应用程序的开发，BMP位图格式理所当然地被广泛应用。这种格式的特点是包含的图像信息较丰富，几乎不进行压缩，但由此导致了它与生俱生来的缺点–占用磁盘空间过大。下面案例以8*8像素的白板文件为案例。

Ⅰ.bmp文件的结构
(1)位图文件头(bmp file header)： 提供文件的格式、大小等信息；
(2)位图信息头(bitmap information)：提供图像数据的尺寸、位平面数、压缩方式、颜色索引等信息；
(3)调色板(color palette)：可选，如使用索引来表示图像，调色板就是索引与其对应的颜色的映射表；
(4)位图数据(bitmap data)：图像数据区。

Ⅱ.bmp文件头

bmp文件的结构体定义如下：

typedef struct tagBITMAPFILEHEADER
{ 
UINT16 bfType;        //2Bytes，必须为"BM"，即0x424D 才是Windows位图文件
DWORD bfSize;         //4Bytes，整个BMP文件的大小
UINT16 bfReserved1;  //2Bytes，保留，为0
UINT16 bfReserved2;  //2Bytes，保留，为0
DWORD bfOffBits;     //4Bytes，文件起始位置到图像像素数据的字节偏移量
} BITMAPFILEHEADER;

Ⅲ.bmp信息头

BMP信息头结构体定义如下：

typedef struct _tagBMP_INFOHEADER
{
DWORD  biSize;    //4Bytes，INFOHEADER结构体大小，存在其他版本I NFOHEADER，用作区分
LONG   biWidth;    //4Bytes，图像宽度（以像素为单位）
LONG   biHeight;    //4Bytes，图像高度，+：图像存储顺序为Bottom2Top，-：Top2Bottom
WORD   biPlanes;    //2Bytes，图像数据平面，BMP存储RGB数据，因此总为1
WORD   biBitCount;         //2Bytes，图像像素位数
DWORD  biCompression;     //4Bytes，0：不压缩，1：RLE8，2：RLE4
DWORD  biSizeImage;       //4Bytes，4字节对齐的图像数据大小
LONG   biXPelsPerMeter;   //4 Bytes，用象素/米表示的水平分辨率
LONG   biYPelsPerMeter;   //4 Bytes，用象素/米表示的垂直分辨率
DWORD  biClrUsed;          //4 Bytes，实际使用的调色板索引数，0：使用所有的调色板索引
DWORD biClrImportant;     //4 Bytes，重要的调色板索引数，0：所有的调色板索引都重要
}BMP_INFOHEADER;

Ⅳ.调色板

bmp调色板结构体定义如下：

typedef struct _tagRGBQUAD
{
BYTE  rgbBlue;       //指定蓝色强度
BYTE  rgbGreen;      //指定绿色强度
BYTE  rgbRed;        //指定红色强度
 BYTE  rgbReserved;  //保留，设置为0
} RGBQUAD;

彩色表/调色板（color table）是1色、16色和256色图像文件所特有的，相对应的调色板大小是2、16和256，调色板以4字节为单位，每4个字节存放一个颜色值，图像 的数据是指向调色板的索引。

可以将调色板想象成一个数组，每个数组元素的大小为4字节，假设有一256色的BMP图像的调色板数据为：
调色板[0]=黑、调色板[1]=白、调色板[2]=红、调色板[3]=蓝…调色板[255]=黄.

Ⅴ.位图数据

如果图像是单色、16色和256色，则紧跟着调色板的是位图数据，位图数据是指向调色板的索引序号。

如果位图是16位、24位和32位色，则图像文件中不保留调色板，即不存在调色板，图像的颜色直接在位图数据中给出。

16位图像使用2字节保存颜色值，常见有两种格式：5位红5位绿5位蓝和5位红6位绿5位蓝，即555格式和565格式。555格式只使用了15 位，最后一位保留，设为0。

24位图像使用3字节保存颜色值，每一个字节代表一种颜色，按红、绿、蓝排列。

32位图像使用4字节保存颜色值，每一个字节代表一种颜色，除了原来的红、绿、蓝，还有Alpha通道，即透明色。

（二）PNG格式

PNG（Portable Network Graphics）是一种新兴的网络图像格式。PNG一开始便结合GIF及JPG两家之长，打算一举取代这两种格式。1996年得到国际网络联盟推荐认可标准，并且大部分绘图软件和浏览器开始支持PNG图像浏览，从此PNG图像格式生机焕发。

PNG是目前保证最不失真的格式，它汲取了GIF和JPG二者的优点，存贮形式丰富，兼有GIF和JPG的色彩模式；它的另一个特点能把图像文件压缩到极限以利于网络传输，但又能保留所有与图像品质有关的信息，因为PNG是采用无损压缩方式来减少文件的大小，这一点与牺牲图像品质以换取高压缩率的JPG有所不同；它的第三个特点是显示速度很快，只需下载1/64的图像信息就可以显示出低分辨率的预览图像；第四，PNG同样支持透明图像的制作，透明图像在制作网页图像的时候很有用，我们可以把图象背景设为透明，用网页本身的颜色信息来代替设为透明的色彩，这样可让图像和网页背景很和谐地融合在一起。PNG的缺点是不支持动画应用效果。

Ⅰ.PNG文件结构

PNG文件由文件署名域（8字节）和最少3个数据块（Chunk）按照特定的顺序排列而成。 数据块分为两类：

• 关键数据块（Critical Chunk）：必须包含的数据块。
• 辅助数据块（Ancillary Chunk）：可选的数据块。

Ⅱ.PNG文件署名域

Ⅲ.数据块结构

2.用截图⼯具截⼀幅8×8大小纯白色的bmp/png图片

这一步小编推荐用美图秀秀直接新建一幅88像素的纯白色的bmp和png图片，操作步骤如下：打开美图秀秀软件，然后在美化图片里找到新建画布，接着修改画布的宽度和高度的像素，接着修改背景色为白色，最后点击应用，一个88像素的纯白色的画布就创建完成。

下面的操作就是保存你要的纯白色图片，直接点击保存，会跳出以下界面，然后选择你需要的文件格式，一个8*8像素的图片就创建完成。

3.然后用二进制编辑器观察bmp或png图片文件数据的规律

这一步骤需要使用工具二进制编辑器，小编在这推荐使用Hex Editor Neo，找不到这款编辑软件的小伙伴可以从小编分享的链接中下载，看不懂英文操作界面的，可以在网上搜下改中文的教程，嘿嘿。
链接：https://pan.baidu.com/s/1iGVBCLUHsEo0qSpjiNQ7OA
提取码：ly3l
用HEX打开保存的像素文件（以8*8像素的bmp文件为例），首先提醒大家，Windows的数据是倒着念的。如果一段数据为42 4d ，倒着念就是4d 42，即0x4d42。

根据上文我对bmp格式图片的详解，我们对上图的十六进制进行详解。

从036h开始到结束都是我们需要修改的调色板内容。

4.重复上述步骤，摸清规律后，在白底上用黑色线条「画」出字母「C」

从上述内容我们可以知道