做网站用还是不用Sprites图片拼接技术

创络讲堂 2012-01-31 08:00:00 2833次 https://www.chuangluo.com/news_124.html 作者:创络科技

做网站的都知道有一种将网站背景图片拼接到一张图片上的技术:CSS Sprites图片整合技术。深圳网站建设公司【创络】大约在两年前的一小段时间内非常痴迷于这种技术的使用。因为它确实可以从很大程度上降低网站服务器的请求次数,从而提高网站的访问速度,然而,为什么我们会很快的放弃这种技术呢?原因是:这样做出来的网站很难维护。

我们先来了解一些和Sprites技术相关的信息,对于非动画的GIF更建议使用PNG8因为它同样能做到一样的效果,而且能为你节省10%-30%的文件体积。而Sprites技术就是将网站上的所有图片集成到一张PNG或者GIF图片上去。常见的图片切割技术是图片顺序由上至下、左至右添加。而background-position一般采用数字组合形式定位,这样能减少维护带来的不必要麻烦。SS Sprites图片中的图片都是紧挨在一起的,目的是最大限度的缩小文件体积。把颜色较近或相同的组合在一起可以降低颜色数,因为少色数的图片文件体积会相对的小。

一般我们会采用水平排列图片而非垂直排列,目的当然还是缩小图片文件的体积,因为垂直排列的图片会比水平排列的图片体积要大。适当地把对等相同的图像合并,以节省空间及减少体积。区分开不需要合并的图像。最右或左边为最灵活动位置最适宜摆放文本前的ICO,不会受到其它PNG图片的干预,因此不需要预留空间。

由于整个网站的图片全部都在这一个图片上面,因此,我们需要在每一个DIV中通过精确的position属性来定位。如果有一天客户要求改变某一个DIV的大小,那么整个CSS文档就用全部重新写,这是多么痛苦的一件事情啊?而最令人吃惊的,没有任何一位客户可以保证他在未来不会去修改网站。因此,我们只好选择放弃使用这种技术,转而从其他方面努力提高网站的速度。

  • 为新手详细解释什么是网站外链
    2012-06-11 08:00:00
    深圳网站建设公司【创络】在过去的文章中,不停的强调网站的外链和网站本身内容质量的重要性,这本没有什么错的地方,但是到今天才发现,有太多的客户根本不了解什么是网站外链,也不知道什么...
  • 如何在后台修改网站LOGO标志
    2018-08-07 17:49:06
    网站LOGO标志的更换频率相对来说很低,但是也有机会被客户使用到,沙井做网站的公司创络专门开发了LOGO修改功能,操作简单,具体操作步骤如下: 1. 登录网站后台 2. 找到...
  • 如何在网站上写能吸引客户的文章
    2011-12-23 08:00:00
    在网站上发布的文章或者在其他各种平台上发布的文章都是为了达到宣传网站的、销售产品的目的,因此我们都称为软文,即软性的广告宣传文章。但是作为一般的网站维护员可能对软文的编写有一定的...
标准建站流程
客服电话
  • 0755-23698839