后退 刷新 前进 收藏 顶部 |   知道 黑匣子 富媒体 技术服务

提高网站打开速度的几种方法(加速网页的显示)

服务器应用 网站 ... (shuke.2013-08-14 06:01)
很多站长使用虚拟主机来做网站,网页内容一旦很多,网站打开速度就会特别慢,如果说服务器、带宽、CDN这类硬指标我们没有经济实力去做,不妨通过网页代码优化的方式来提高速度。
1: 缩小Javascript和CSS文件

如果你的网站大约有50-60%的用户是第一次访客,那么这些人会下载Javascript和CSS,如果这些文件很大浏览器会下载很长时间。

使用压缩工具可以减少Javascript和CSS尽一半的文件大小,如果你有信心使用“命令行”我强烈推荐使用雅虎的YUI压缩,至少能提高40%到60%的压缩率,如果你是在不懂可以用站长之家的CSS\JS压缩工具。

2:减少HTTP请求

浏览器会花费80%的时间获取外部元件,包括脚本、样式表、图像等,只有20%的时间用来加载内容,每个网站都会有许多HTTP请求,由于只有2个HTTP请求可以在同一时间传送,所以请求一旦过多就会造成延迟。

提高网站打开速度的7大秘籍

 

3:缓存图片、CSS和Javascript

每当一个新用户访问你的网站,图片、CSS和Javascript应该在其浏览器缓存,这样他们下一次访问就特别快。

绝大多数windows主机已经默认启用了,只需要在控制面板中设定过期时间和文件类型那个就可以了,我建议图片、CSS和Javascript时间可设置为一个月。而对于Apache Web服务器,使用mod_cache模块开启缓存。:

4:合并CSS引用图片

如图一所示,很多网站的图片都是切成小块的,这样下来就会有大量CSS引用图片,如卢松松博客的CSS就引用了14张图片,cssimages也是影响网站速度的一种重要因素。

如果我们把CSS图片合并成一个,14个HTTP请求变成1个,想想会是什么效果?它的原理就是通过CSS坐标的方式取得图片径路,每个CSS标签引用不同坐标就会得到不同图片。我们看到很多网站的CSS图片只有一张,用的就是这个原理。

不懂也没有关系,CSS图片合并生成器这个网站能帮助你合并CSS图片,并且能得到相应代码。

5:只加载<head>部分的基本脚本

这个最简单,不花时间,点击自己网站右键“查看源文件”找到<head>与</head>之间的区域,看看那些不重要好的JS文件,把它仍到页面底部,也就是让它最后加载。或者直接删除。

 

6:对图像进行压缩


除非你加载视频,那么影响网站速度罪魁祸首应该就是图片了,如果是jpeg、png图片,保证不失品质的前提下,让他们尽量压缩,Fireworks软件“导出向导”功能,它提供了一个很好的方式来预览保存的图像,让图片大小与质量之间平衡,大多数其他图像编辑软件都有类似的功能。

例如我的每篇博文配图都用了“导出向导”功能,我尽量把图片都压缩在30K以内,在一定程度上加快了浏览速度,但也有部分图片失真,看不清楚。

7:开启gzip模块


gzip压缩是非常流行的一种数据压缩格式,一般网站启用gzip后,压缩率都会有70%-80%的提升,效果是立竿见影的。

部分虚拟主机默认有gzip功能,但大部分没有,独立主机、VPS一般可以设置,开启gzip会加重服务器负担,而且要修改服务器配置,强烈建议大家开启gzip,如果不清楚可以问问所在空间商,让他们帮忙开启。
IIS相关GZIP配置http://www.coolneng.com/?thread-index-fid-3-tid-73.htm

2 楼 shuke[2013-09-27 09:37]
相关文章:Yahoo给出的34条网站加速方法酷能第一区:黑匣子SEO与资讯
http://www.coolneng.com/?thread-index-fid-7-tid-16.htm

加快网页打开速度,虽然是老生常谈,但不论什么时候都是站长密切关心的问题。其实有不少途径可以加快网页打开速度,例如你可以换一台性能更高的服务器,换一条带宽更多的网络线路,再加上CDN加速服务等等,这些都是从硬性方面来考虑的,但是,毫无疑问,不是每个站长都有这个能力去购买这些服务的,所以,草根站长只能从软性方面来考虑了。

本文提及的加快网页打开速度的五点建议,就是从网页的优化来考虑的。
一、优化图片

优化图片包括减少图片数、降低图像质量、使用恰当的格式。

1、减少图片数:要尽量避免使用过多的图片,最好不要使用图片,加载10行文字绝对比加载5行高的图片要快得多。

2、降低图像质量:如果不是很必要,尝试降低图像的质量,尤其是jpg格式,降低5%的质量看起来变化不是很大,但文件大小的变化是比较大的。

3、使用恰当的格式:一般在网页上使用的图片格式有三种,jpg、png、gif,有时候使用bmp。我们需要知道在什么时候应该使用什么格式,以减少网页的加载时间。
a、JPG/BMP:一般用于展示风景、人物、艺术照的摄影作品。有时也用在电脑截屏上。
b、GIF:提供的颜色较少,可用在一些对颜色要求不高的地方,比如网站logo、按钮、表情等等。当然,gif的一个重要的应用是动画图片。就像用Lunapic制作的倒映图片。
c、PNG:PNG格式能提供透明背景,是一种专为网页展示而发明的图片格式。一般用于需要背景透明显示或对图像质量要求较高的网页上。

二、标明图片高宽

这点我们非常容易忽略,在写html代码时,很少考虑到要去标明图片的width和height属性。如果浏览器没有找到这两个参数,它需要一边下载图片一边计算大小,如果图片很多,浏览器需要不断地调整页面。这不但影响速度,也影响浏览体验。

三、不要在HTML中缩放图片

图片要用多大的就用多大的,1000X1000的图片被width="100″ height="100″以后,本身的KB数是不会减少的。

四、减少HTTP请求

当浏览者打开某个网页,浏览器会发出很多对象请求(图像、脚本等等),视乎网络延时情况,每个对象加载都会有所延迟。如果网页上对象很多,这可以需要花费大量的时间。因此,要为http请求减负。如何减负?
1、去除一些不必要的对象。
2、将临近的两张图片合成一张。
3、合并CSS
看看下面这段代码,需要加载三个CSS:



我们可以将其合成一个:

从而减少http请求。

五、减少DNS查找

减少网站从外部调用资源,网页加载效率会大大提高,所以,不要使用过多的网页插件。
进度:100% 返回服务器应用

IIS启动GZIP进行对网站压缩时,无法编辑metabase.xml的解决办法.(舒克)

图片新热点

导航


目录


    站内搜索
    首页 | W3C | ME