前端切图要选择png和jpg呢?
今天特意验证了一下:
切完图分别保存png24、png8和jpg60、jpg80(60和80表示保存图片时品质选择)后,

然后再压缩图片,压缩图片地址:https://tinypng.com/
图片直接拉进去就可以压缩,压缩完对比一下,没想到png24图片压缩完内存小又清晰;jpg图片反之;
未压缩之前,图片信息,如下:




1.jpg60压缩之后:

jpg60压缩之后内存大小:47.6KB

2.jpg80压缩之后:

jpg80压缩之后的大小:47.5KB

3.png8压缩之后:

png8压缩之后大小:36.5KB

4.png24压缩之后:

png24压缩之后大小:35KB

但也有例外:图片颜色较多的、比较复杂的,压缩之后png24格式内存比较大,举个栗子:
jpg60压缩后大图:

jpg60压缩后大小:76.3KB

png24图片压缩之后:

png24图片压缩之后大小:116KB


综上对比图片颜色单调的png24图片压缩之后内存最小最清晰
原创,转载需要标注出处哦!
前端切图要选择png和jpg呢?的更多相关文章
- 前端切图神器-cutterman
之前我写过一篇关于前端切图的博客:https://www.cnblogs.com/tu-0718/p/9741058.html 但上面的方法在切图量大时依然很费时间,下面向大家推荐这款免费切图神器 c ...
- 前端切图相关ps技术
标签(空格分隔): 前端切图 复制图层到一个新的ps文件 对于单个图层 1.选中图层 2.CTRL+A全选 3.CTRL+C 4.CTRL+N新建文件,文件大小默认就可以(背景透明也在这个面板设置), ...
- 前端切图实战(PSD设计稿转化为前端)
课程来源:https://www.imooc.com/learn/668 一:读设计稿 划分:头部.尾部.公共部分.大概分多少块.logo的重用.列表有哪些.各部分用什么技术实现等等. 二:建立项目目 ...
- 【前端切图】用css画一个卡通形象-小猪佩奇
最近在腾讯云技术社区遇到了一位奇才,用css画出了一个社会人小猪佩奇,不得不服.研究了一下他的文章https://segmentfault.com/a/1190000014909658,感觉甚是有趣, ...
- ps前端切图常用快捷键
一.新建文件:预设-自定:宽度1920,单位像素,高度自定义:分辨率:72像素/英寸:颜色模式:RGB,8位:背景色:透明:可存储预设,下次新建的时候,直接在预设中,选择那个名称,点确定.视图:显示- ...
- web前端切图处理
技巧: 一. 如何在 Retina 屏幕的设备使用更高分辨率的图片 以 MacBook Pro 为例,它的标准分辨率高达 2560 x 1600,但是如果真的以这个分辨率显示网页,网页的有效区域就小的 ...
- 前端切图|点击按钮div变色
<!DOCTYPE html> <html> <head> <title>点击按钮div变色.html</title> <meta c ...
- 前端切图:CSS实现隐藏滚动条同时又可以滚动
CSS 实现隐藏滚动条同时又可以滚动 原始功能: 图片发自简书App 添加伪类之后的功能: 图片发自简书App 完整demo如下: <!DOCTYPE html> <html> ...
- 前端切图:一个好看的表格css样式
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> ...
随机推荐
- VB.Net与C# 的语法比较
最近看代码或写代码时,经常把VB与C#的基本语法搞混,为方便查看,特对其异同进行对比: 變數初始化 VB.NET 自動將所有的變數初始化成 0 或 nothing.C# 在你未初始化變數之前不准你用該 ...
- div高度自适应的问题
对象height:100%并不能直接产生效果,是因为跟其父对象有关. #center{height:100%;} 上面的css样式是无效的,不会产生任何效果. 需要改写: html,body{ m ...
- my sql存储过程 基本使用
--------------创建不带参数的存储过程----------------- DELIMITER;; drop PROCEDURE if EXISTS selectStudent; creat ...
- 记一次 .net core publish 之后找不到视图文件的问题
周末将VS从15.3 升级到15.5 ,之后又将VS版本由社区版,升级为企业版. 于是问题来了: 项目publish 之后找不到视图文件了??? 问题很是蛋疼,后来仔细想了一下,也没有动什么东西.查看 ...
- 小学生作业V2.0
211606320刘佳&211506332熊哲琛 一.预估与实际 PSP2.1 Personal Software Process Stages 预估耗时(分钟) 实际耗时(分钟) Plann ...
- Work-Stealing in .NET 4.0
[Work-Stealing in .NET 4.0] 1.线程按LIFO取Task,因为最后一个Task很可能还在Cache中,提高命中率. 2.Stealer从FIFO取Task,最先加入的Tas ...
- 【bzoj3437】小P的牧场
3437: 小P的牧场 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 947 Solved: 542[Submit][Status][Discuss ...
- Linux confluence5.8.10 wiki安装
选择首先需要java环境 其次需要mysql mysql安装请参考: http://www.cnblogs.com/syuf/p/7818710.html 安装好mysql之后,创建一个库 # mys ...
- 1014_C语言的文法
程序-> <外部声明><程序><外部声明> 外部声明-> <函数定义>|<声明> 函数定义-> <函数类型>& ...
- Python爬虫利器六之PyQuery的用法
前言 你是否觉得 XPath 的用法多少有点晦涩难记呢? 你是否觉得 BeautifulSoup 的语法多少有些悭吝难懂呢? 你是否甚至还在苦苦研究正则表达式却因为少些了一个点而抓狂呢? 你是否已经有 ...