对于web前端开发的同学来说,图片保存格式非常的重要。那么该如何选择图片保存的格式呢?下面我总结一下gif,jpg,png等图片格式的区别。

  gif是很早应用的一种图片格式。它采用的是lzw的压缩算法,lzw算法是将长字符串替换成短字符串的的方法来实现压缩。gif支持动画,支持透明,支持渐变色彩,同时gif是无损压缩,另外gif是水平压缩,也就是说10*500的图片压缩效果不如500*10的图片。但是gif得缺点也是相当明显,就是它只支持256中色彩,所以对于色彩丰富的图片压缩效果不好。根据gif的这些特点可以总结出:小图标,色彩不丰富的图片适合压缩为gif格式。

  JPEG 代表Joint Photograhic Experts Group(联合图像专家组),这种格式经常写成JPG,JPG图片的扩展名为jpg。

  jpg的优点是它支持百万种色彩。jpg是一种有损压缩的方式,它会放弃图片的某些细节。所以要是对图片质量的要求不是很高,可以采用jpg的保存方式。那么根据jpg的特点总结出:色彩丰富的照片适合jpg的保存方式,不适合小图标,线条的图片。

  png是20世纪90年代推出的一种图片格式,它采用的是无损压缩。其目的是为了取代gif。png分为png8,png24,png32.这几种主要区别是储存方式不同。

  png8只有256色,支持透明(要么全透明,要么不透明)。

  png24颜色很多,但是不支持透明。而在Photoshop中导出的png24实际是png32.

  png32有8位alpha通道,所以它支持透明度的设置。

  webp是谷歌开发的旨在增加图片加载速度的图片格式,它压缩后的大小约为jpg的2/3。但是webp目前只有google39+,safari+等浏览器支持。

  

gif,jpg(jpeg),png,webp,base64图片格式比较的更多相关文章

  1. 小程序base64图片格式保存至手机相册

    // 保存图片至相册 saveImg() { //获取文件管理器对象 const fs = wx.getFileSystemManager() //文件保存路径 const Imgpath = wx. ...

  2. Google最新的图片格式WEBP全面解析

    前言 不管是 PC 还是移动端,图片一直是流量大头,以苹果公司 Retina 产品为代表的高 PPI 屏对图片的质量提出了更高的要求,如何保证在图片的精细度不降低的前提下缩小图片体积,成为了一个有价值 ...

  3. 关于webp图片格式初探

    前言 不管是 PC 还是移动端,图片一直是流量大头,以苹果公司 Retina 产品为代表的高 PPI 屏对图片的质量提出了更高的要求,如何保证在图片的精细度不降低的前提下缩小图片体积,成为了一个有价值 ...

  4. WebP图片格式

    腾讯科技讯 科技博客Gig‍‍‍aOM近日撰文称,谷歌(微博)试图让WebP图片格式取代JPEG等现有图片格式.虽然谷歌无法很快达成所愿,但WebP仍然会对互联网产生重大影响. 文章全文如下: 受够了 ...

  5. JS验证图片格式和大小并预览

    用于上传图片的js验证: <%@ page language="java" contentType="text/html; charset=UTF-8"p ...

  6. DirectX - dds图片格式(DDSURFACEDESC2)

    DDS是DirectDraw Surface的缩写,它是DirectX纹理压缩(DirectX Texture Compression,简称DXTC)的产物. DXTC减少了纹理内存消耗的50%甚至更 ...

  7. GIF/PNG/JPG和WEBP/base64/apng图片优点和缺点整理

    GIF/PNG/JPG/WEBP/APNG都是属于位图(位图 ,务必区别于矢量图): GIF/PNG和JPG这三种格式的图片被广泛应用在现今的互联网中,gif曾在过去互联网初期慢速的情况下几乎是做到了 ...

  8. 如何让Ubuntu系统支持WebP图片格式

    本文主要向大家介绍如何让 Ubuntu 系统支持查看 WebP 图片格式,以及如何将 WebP 转为 JPEG 或 PNG 图片格式的方法. 什么是WebP图片 Google开发并推出 WebP 图片 ...

  9. [html] Webp、Apng图片格式

    WebP格式,谷歌(google)开发的一种旨在加快图片加载速度的图片格式.图片压缩体积大约只有JPEG的2/3,并能节省大量的服务器带宽资源和数据空间. 与JPEG相同,WebP是一种有损压缩.但谷 ...

随机推荐

  1. STL笔试面试题总结(干货)(转)

    STL笔试面试题总结 一.STL有哪些组件? STL提供六大组件彼此此可以组合套用: 1.容器容器就是各种数据结构,我就不多说,看看下面这张图回忆一下就好了,从实现角度看,STL容器是一种class ...

  2. Motan框架初体验

    1.什么是Motan? Motan是一套基于java开发的RPC框架,除了常规的点对点调用外,motan还提供服务治理功能,包括服务节点的自动发现.摘除.高可用和负载均衡等.Motan具有良好的扩展性 ...

  3. The user specified as a definer ('root'@'%') does not exist解决

    转自:https://www.cnblogs.com/hanxue53/p/5850263.html 解决方法: 2.进入mysql的安装路径之前,要确保你的mysql服务是开启的: 在DOS命令窗口 ...

  4. [BOOKS]BIG DATA and DATA ANALYTICS: The Beginner's Guide to Understanding the Analytical World

  5. ICU lirary DownLoad

    { //https://github.com/unicode-org/icu }

  6. 科学把妹法 ( ̄▽ ̄)"

    曾经有一位生物学人士,公布了工科把妹第一弹,暨“巴甫洛夫把妹法”: 每天给你那位心仪的女同事/女同学的抽屉里都放上精心准备的早餐,并且保持缄默不语,无论她如何询问,都不要说话.  如此坚持一至两个月, ...

  7. BN和正则化一起使用的后果

    就是因为 batch norm 过后, weight 影响没那么重了,所以 l2 weight decay 的效果就不明显了. 证明了L2正则化与归一化相结合时没有正则化效应.相反,正则化会影响权重的 ...

  8. MySQL(关系型数据库管理系统)

    MySQL 关系型数据库管理系统,由瑞典MySQL AB 公司开发,目前属于 Oracle 旗下产品.MySQL 是最流行的关系型数据库管理系统之一,在WEB应用方面,MySQL是最好的 RDBMS ...

  9. 巴厘岛的雕塑(sculptures)

    巴厘岛的雕塑(sculptures) 印尼巴厘岛的公路上有许多的雕塑,我们来关注它的一条主干道. 在这条主干道上一共有 N 座雕塑,为方便起见,我们把这些雕塑从 1 到 N 连续地进行标号,其中第 i ...

  10. 探索Redis设计与实现5:Redis内部数据结构详解——quicklist

    本文转自互联网 本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到我的仓库里查看 https://github.com/h2pl/Java-Tutorial ...