当前位置:网站首页 / 建站知识 / 网站建设知识

网站建设常用压缩技术汇总

来源:未知时间:2014-04-25 11:42点击:

如今的网站建设要的是质量,要的是能为企业赚钱,这就要求我们尽可能的提高用户体验,让网站的流量更精准,最终使这些精准流量能带来订单,只要能提高一分的质量,哪怕付出十分的力量也是值得的。但是网民的耐心往往却没有那么好,如果网页打开速度慢,则很有可能导致网民连网页都没有完全下载和打开就已经把它给关闭了。所以,在当今的网络营销中,提高网站打开速度是非常重要的。下面济南网站建设汇总分享常用的网站压缩技术。

针对服务器端的GZIP压缩技术

可以说GZIP压缩是指服务器中安装的一个功能,当有人来访问这个服务器中的网站时,服务器中的这个功能就将网站内容压缩后传输到来访的电脑浏览器,然后由客户端浏览器解压显示出来。一般对纯文本内容可压缩到原大小的60%以上,压缩率是相当可观的,这样传输就快了,效果就是你点击网址后会很快的显示出来。当然这也会增加服务器的负载,但是换来的是更高的带宽利用率、更快的网页加载速度。

针对网站图片的压缩技术

网站图片往往是最占网站体积大小的,是影响网站打开速度的主要因素,我们只要很好的做好网站图片压缩,我们的网站打开速度将大大的提升。那么我们如何针对网站图片压缩呢?这里我们主要从三方面来讲解。

一、图片裁切

切图时尽量贴合图形区,避免空白区域占用文件大小。

二、图片缩放

通常情况下,数码相机拍出的照片分辨率是用于冲洗照片所用的,在网上浏览不需要上传那么大的照片,既影响图片上传速度,又浪费下载观众的带宽,解决方法是上传图片前,用图片编辑软件(photoshop 或者 光影魔术手)压一下,500像素左右就可以了。

三、图片输出

01、使用photoshop的“存储为web所用格式”功能来输出图片。测试表明:输出某张图片为jpg格式,分别使用“存储为web所用格式”和一般的“存储为”,都压缩到50%,前者得到的图片结果为14.4kb,后者为47.1kb。
02、在使用上述功能进行图片输出的过程中,对比jpg、gif格式下的文件大小,选择效果和大小较优的文件格式。一般情况下,色彩少的图片使用png-8、gif格式文件会小些,色彩渐变丰富的图片,则使用jpg会小些。
03、Jpg格式的图片,需综合对比压缩品质高、中、低下的效果,尽量选择效果好且压缩品质较低的选项,以达到获取较小文件的目的。
04、对于无多通道透明需求的图片,避免使用png24位格式输出。
05、有些图片,色彩并不是很丰富,通过对比可知输出gif会更小些;或者,因为要用在多种背景中使用,需要输出为透明格式(非多通道),这时,就需要选用gif 格式。我们都知道Jpg格式可以通过控制压缩比来优化,相对于JPG,gif优化是比较容易被忽视的。看到身边有些朋友在输出gif时基本不作什么优化选择,觉得很可惜。其实,即使确定要输出gif格式,通常也仍有继续瘦身的余地。

所以对于jpg而言,选择一个能看清楚的最大的压缩率;对于gif而言,色彩越少,文件也就越小。在肉眼可接受的范围内,尽量将gif色彩数量降低。当然如果图片的颜色很单一,不妨多花点时间对比一下png和gif。或许就能够多省下一些字节,虽然省下的自己可能微不足道,但是细节对一个前端开发者来说是很重要的东西。

针对网站背景图片的CSS Sprites技术

CSS Sprites其实就是把网页中一些背景图片整合到一张图片文件中,再利用CSS的“background-image”,“background- repeat”,“background-position”的组合进行背景定位,background-position可以用数字能精确的定位出背景图片的位置。当页面加载时,不是加载每个单独图片,而是一次加载整个组合图片。这是一个了不起的改进,它大大减少了HTTP请求的次数,减轻服务器压力,同时缩短了悬停加载图片所需要的时间延迟,使效果更流畅,不会停顿。

针对网页HTML、JS、CSS代码的压缩

这个压缩就需要懂一些基本的代码了。在我看来,SEO从业者懂一些前端代码还是必须的。一般这类压缩,我通过采用向后兼容的省略模式,将文档类型的代码使用“!DOCTYPE html”而不是传统的dtd,就能够给网页节约超过180个字符,还有像DIV+CSS的结构要比表结构更加的节省代码,而从word或者写字板粘贴过来的文件,也可以通过操控源代码,来清除冗余代码。

从搜索引擎优化的角度来说,网站压缩技术对网站排名没有直接的影响,但是在搜索引擎蜘蛛抓取网站的时候,如果网站体积较大,请求响应时间较长,势必会影响到蜘蛛的抓取,要知道蜘蛛在每一个网站上爬取的时间是有限的,最终很可能会影响到一个收录的量,然后间接影响到网站在搜索引擎的排名。