一、jpg 格式
全名应该是 JPEG。JPEG 图片以 24 位颜色存储单个光栅图像。
JPEG 是与平台无关的格式，支持最高级别的压缩，不过，这种压缩是有损耗的。渐近式 JPEG 文件支持交错。可以提高或降低 JPEG 文件压缩的级别。但是，文件大小是以图像质量为代价的。压缩比率可以高达 100:1。（JPEG 格式可在 10:1 到 20:1 的比率下轻松地压缩文件，而图片质量不会下降。）
JPEG 压缩可以很好地处理写实摄影作品。但是，对于颜色较少、对比级别强烈、实心边框或纯色区域大的较简单的作品，JPEG 压缩无法提供理想的结果。有时，压缩比率会低到 5:1，严重损失了图片完整性。这一损失产生的原因是，JPEG 压缩方案可以很好地压缩类似的色调，但是 JPEG 压缩方案不能很好地处理亮度的强烈差异或处理纯色区域。
Jpeg 格式特点：
1、透明性：它不支持透明性
2、动画：它不支持动画
3、损耗性：除了一些比如说（仅仅是 90、180、270 度旋转），裁切，从标准类型到先进类型，编辑图片的原数据之外，所有其它操作对 jpeg 图像的处理都会使得它的质量损失，所以我们在编辑过程一般用 png 作为过渡格式。
4、隔行渐进显示，它支持隔行渐进显示（但是 ie 浏览器并不支持这个属性，但是 ie 会在整个图像信息完全达到的时候显示）。
由上可以看出 Jpeg 是最适 web 上面的摄影图片和数字照相机中。根据惊叹我们在页面中使用的商品图片、采用人像或者好、实物素材制作的广告更适合采用 JPG 格式保存。
二、gif 格式
GIF(GraphicsInterchange Format)的原义是"图像互换格式"，是 CompuServe 公司在 1987 年开发的图像文件格式。GIF 文件的数据，是一种基于 LZW 算法的连续色调的无损压缩格式。其压缩率一般在 50％左右，它不属于任何应用程序。目前几乎所有相关软件都支持它，公共领域有大量的软件在使用 GIF 图像文件。GIF 图像文件的数据是经过压缩的，而且是采用了可变长度等压缩算法。所以 GIF 的图像深度从 lbit 到 8bit，也即 GIF 最多支持 256 种色彩的图像。GIF 格式的另一个特点是其在一个 GIF 文件中可以存多幅彩色图像，如果把存于一个文件中的多幅图像数据逐幅读出并显示到屏幕上，就可构成一种最简单的动画。
gif 格式特点：
1、透明性：gif 是一种布尔透明类型，即它可以使全透明，也可是全不透明，但是它并没有半透明的（alpha 透明）。
2、动画：gif 格式支持动画。
3、无损耗性：gif 是一种无损耗的图像格式，这也意味着你可以对 gif 图片做任何操作也不会使得图像质量产生损耗。
4、水平扫描：gif 是使用一种叫做 LZW 的算法进行压缩的，当压缩 gif 的过程中，像素是由上到下水平压缩的，这也意味着同等条件下，横向的 gif 图片比竖向的 gif 更加小。例如 50010 的图片比 10500 的图片更加小。
5、间隔渐进显示：gif 支持可选择性的间隔渐进显示。
由以上特点看出只有 256 种颜色的 gif 图片不适合照片，但它适合对颜色要求不高的图形（比如说图标、图表等）。
三、png 格式
PNG 是 20 世纪 90 年代中期开始开发的图像文件存储格式，其目的是企图替代 GIF 和 TIFF 文件格式，同时增加一些 GIF 文件格式所不具备的特性。流式网络图形格式(Portable Network Graphic Format，PNG)名称来源于非官方的"PNG’s NotGIF"，是一种位图文件(bitmapfile)存储格式，读成"ping"。PNG 用来存储灰度图像时，灰度图像的深度可多到 16 位，存储彩色图像时，彩色图像的深度可多到 48 位，并且还可存储多到 16 位的 α 通道数据。PNG 使用从 LZ77 派生的无损数据压缩算法。
Png 格式特点：
1、类型：Png 这种图片格式包括了许多类，但是在实践的大致中可以分为 256 色的 png 和全色的 png，你完全可以用 256 色的 png 代替 gif，用全色的 png 代替 jpeg。
2、透明性：png 是完全支持 alpha 透明的（透明、半透明、不透明），尽管有两个怪异的现象在 ie6（下面详细讨论）
3、动画：它不支持动画
Png8 的在 ie 中的怪异表现
半透明的 png8 在 ie6 以下的浏览器显示为全透明。
alpha 透明的全色 PNG（png32）在 ie6 中会出现背景颜色（通常是灰色）
上面可以总结：全透明的 png8 可以在任一浏览器正常显示（就像 gif 一样）。半透明的 png8 在除了 ie6 及其一下的浏览器下错误的显示成全透明，其它的浏览器都能正常显示半透明。图像上颜色较少、并且主要以纯色或者平滑的渐变色填充以及具备较大的亮度差异的图像适合以 png8 格式存储。
四、svg 格式
可缩放矢量图形是基于可扩展标记语言（标准通用标记语言的子集），用于描述二维矢量图形的一种图形格式。它由万维网联盟制定，是一个开放标准。
SVG 格式特点：
1、SVG 指可伸缩矢量图形 (Scalable Vector Graphics)
2、SVG 用来定义用于网络的基于矢量的图形
3、SVG 使用 XML 格式定义图形
4、SVG 图像在放大或改变尺寸的情况下其图形质量不会有所损失
5、SVG 是万维网联盟的标准
6、SVG 与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体
SVG 跟上面这些图片格式最大的不同，是 SVG 是矢量图。这意味着 SVG 图片由直线和曲线以及绘制它们的方法组成。当你放大一个 SVG 图片的时候，你看到的还是线和曲线，而不会出现像素点。这意味着 SVG 图片在放大时，不会失真，所以它非常适合用来绘制企业 Logo、Icon 等。
五、bmp 格式
BMP 是一种与硬件设备无关的图像文件格式，使用非常广。它采用位映射存储格式，除了图像深度可选以外，不采用其他任何压缩，因此，BMP 文件所占用的空间很大。BMP 文件的图像深度可选 lbit、4bit、8bit 及 24bit。BMP 文件存储数据时，图像的扫描方式是按从左到右、从下到上的顺序。
这是一种比较老的图片格式。BMP 是无损的，但同时这种图片格式几乎没有对数据进行压缩，所以 BMP 格式的图片通常具有较大的文件大小。虽然同时支持索引色和直接色是一个优点，但是太大的文件格式格式导致它几乎没有用武之地，现在除了在 Windows 操作系统中还比较常见之外，我们几乎看不到它。
六、WebP 格式
WebP是谷歌开发的一种新图片格式，WebP 是同时支持有损和无损压缩的、使用直接色的、点阵图。
想象 Web 上的图片之多，百分之几十的提升，是非常非常大的优化。只可惜，目前只有 Chrome 浏览器和 Opera 浏览器支持 WebP 格式，所以 WebP 的应用并不广泛。为了使用更先进的技术，比如 WebP 图片格式，来压缩互联网上传输的数据流量，谷歌甚至提供了 Chrome Data Compression Proxy，设置了 Chrome Data Compression Proxy 作为 Web 代理之后，你访问的所有网站中的图片，在经过 Proxy 的时候，都会被转换成 WebP 格式，以降低图片文件的大小。从名字就可以看出来它是为 Web 而生的，什么叫为 Web 而生呢？就是说相同质量的图片，WebP 具有更小的文件体积。现在网站上充满了大量的图片，如果能够降低每一个图片的文件大小，那么将大大减少浏览器和服务器之间的数据传输量，进而降低访问延迟，提升访问体验。