注:在存储图像时采用JPG还是PNG主要依据图像上的色彩层次和颜色数量进行选择

一、.jpg/jpeg格式的图片(jpg全名:jpeg)

JPG(或是JPEG):

优点:

  (1)占用内存小,网页加载速度快

  (2)主要用于摄影作品或者写实作品(或者其他细节、色彩丰富的图片)或大的背景图;对多色彩表现较好,不适于文字较多的图片。根据我们在页面中使用的商品图片、采用人像或者实物素材制作的广告banner等图像更适合采用jpg的图片格式保存

缺点:

  jpg格式图片是有损压缩的图片,有损压缩会使原图片数据质量下降,即jpg会在压缩图片时降低图片品质。

二、PNG格式的图片

.png:

优点:

  (1)png格式图片是无损压缩的图片,能在保证最不失真的情况下尽可能压缩图像文件的大小。 

  (2)图片质量高;色彩表现好;支持透明效果;提供锋利的线条和边缘,所以做出的logo等小图标效果会更好;更好地展示文字、颜色相近的图片。

  (3)PNG用来存储灰度图像时,灰度图像的深度可多到16位,存储彩色图像时,彩色图像的深度可多到48位,并且还可存储多到16位的α通道数据。

    (4)  所含颜色很少、具有大块颜色相近的区域或亮度差异十分明显的较简单的图片则需要采用PNG。但也会有一些特殊情况,例如有些图像尽管色彩层次丰富,但由于图片尺寸较小,上面包含的颜色数量有限时,也可以尝试用PNG进行存储。而有些矢量工具绘制的图像由于采用较多的滤镜特效也会形成丰富的色彩层次,这个时候就需要采用JPG进行存储了。主要用于小图标或颜色简单对比强烈的小的背景图。根据经验用于页面结构的基本视觉元素,如容器的背景、按钮、导航的背景等应该尽量用PNG格式进行存储,这样才能更好的保证设计品质。

缺点:

  (1)占内存大,会导致网页加载速度慢;

  (2)对于需要高保真的较复杂的图像,PNG虽然能无损压缩,但图片文件较大,不适合应用在Web页面上。 

实践中的示例图:

原文链接:https://blog.csdn.net/qq_30541261/article/details/70154282

最新文章

  1. 与你相遇好幸运,Sailsjs查询
  2. WPF重写Image实现动态图片--未测试
  3. [经验交流] Mesos-dns 和 Marathon-lb 简要使用方法
  4. C++11新特性总结 (二)
  5. struct
  6. Asp.net窄屏页面 手机端新闻列表
  7. memcached 系列2:memcached实例(转载)
  8. paper 62:高斯混合模型(GMM)参数优化及实现
  9. slidingMenu默认显示菜单
  10. asp.net创建XML文件方法
  11. Oracle 特殊字符模糊查询的方法
  12. ORACLE集合常用方法
  13. Thinkphp入门 二 —空操作、空模块、模块分组、前置操作、后置操作、跨模块调用(46)
  14. Linux配置SSH端口以及密钥登录
  15. FreeMarker 生成Java、mybatis文件
  16. Python 的字符串
  17. 网络编程-Python高级语法-GIL全局解释器锁
  18. leetcode739
  19. 一、搭建Django,建立第一个demo
  20. Rspec: feature spec 功能测试 测试JavaScript.

热门文章

  1. web自动化测试笔记(二)
  2. LeetCode 445. 两数相加 II(Add Two Numbers II)
  3. sql查询出现1055 this is incompatible with sql_mode=only_full_group_by
  4. controller进行数据保存以及作用域
  5. MySQL中主键id不连贯重置处理办法
  6. Connection to api@localhost failed. [08001] Could not create connection to d
  7. SQL——AS别名
  8. PAT(B) 1065 单身狗(Java:17分,C:25分)
  9. InnoDB的MVCC实现原理
  10. Java8系列 (三) Spliterator可分迭代器