「SEO大军」博主SEO大军从事9年SEO工作,有丰富的网站SEO优化实战经验,诚接网站SEO诊断、SEO顾问!

首页 > 干货分享 / 正文

使用CSS Sprites【css精灵】优化网页速度

SEO大军 2018-07-19 15:01:50 微信号:15382847313 干货分享

  CSS Sprites直译过来就是CSS精灵,但是这种翻译显然是不够的,其实就是通过将多个图片融合到一副图里面,然后通过CSS的一些技术布局到网页上。特别是图片特别多的网站,如果能用css sprites降低图片数量,带来的将是速度的提升。

  使用CSS Sprites还有可能降低下载量,可能大家会认为合并后的图片会比分离图片的总和要大,因为还有可能会附加空白区域。实际上,合并后的图片会比分离的图片总和要小,因为它降低了图片自身的开销,譬如颜色表、格式信息等。

  字体图标

  在可以大量使用字体图标的地方我们可以尽可能使用字体图标,字体图标可以减少很多图片的使用,从而减少http请求,字体图标还可以通过CSS来设置颜色、大小等样式,何乐而不为。

  合并脚本 和样式表

  将多个样式表或者脚本文件合并到一个文件中,可以减少HTTP请求的数量从而缩短效应时间。

  然而合并所有文件对许多人尤其是编写模块化代码的人来说是不能忍的,而且合并所有的样式文件或者脚本文件可能会导致在一个页面加载时加载了多于自己所需要的样式或者脚本,对于只访问该网站一个(或几个)页面的人来说反而增加了下载量,所以大家应该自己权衡利弊。

大军SEO,9年来一直专注SEO技术研究,营销型网站建设,热爱SEO,希望能和大家多多交流共同学习,目前主要为企业和个人提供网站优化,关键词排名等服务,属于全职个人站长,凡是跟大军合作的每家企业/个人都是认真负责,做好网站每个细节,如有SEO/网络营销技术问题的朋友可以。

本页核心:CSS,Sprites,css精灵

Tags:

声明:
1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源,如注作有误请联系我更改;
2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;
3.欢迎您对本文《使用CSS Sprites【css精灵】优化网页速度》做点评,可以加我QQ或微信吐槽;
4.本页面网址:https://www.seodajun.com/SEOfenxiang/664.html

干货分享
了解更多CSS,Sprites,css精灵,请在查看本站栏目对应内容进行参阅,如对使用CSS Sprites【css精灵】优化网页速度有不明之处可以与我交流,如使用CSS Sprites【css精灵】优化网页速度信息有误您也可以进行指导,本博客仅为SEO界的伙伴互相交流的一个SEO博客。

【大军SEO,9年如一日因为专业所以专注!做网站优化9年,熟悉各种CMS,精通各种搜索引擎排名,深知产品推广套路。专注于营销型网站建设,整站优化外包、关键词排名、黑帽/白帽SEO技术!承接网站SEO优化服务、SEO顾问服务(QQ:88288050)】
热门标签