网页速度.docx

网页速度.docx

《网页速度.docx》由会员分享，可在线阅读，更多相关《网页速度.docx（16页珍藏版）》请在冰豆网上搜索。

网页速度

网页速度.txt∞-一人行,必会发情二人行,必会激情三人行,必有奸情就不会被珍惜。

真实的女孩不完美，完美的女孩不真实。

得之坦然，失之淡然，顺其自然，争其必然。

　很多朋友都用虚拟主机来做网站，将网页文件存放在虚拟空间上，但是页面内容一多，网站打开的速度就显得特别慢，如果您碰到这种情况，与其寻求更好的空间，不如通过优化网页代码来取得满意的速度。

笔者总结了一些切实可行的方法，制作主页时，以下的方法可以令你的网页速度大大提高。

　　一、记得帮页面减肥

　　我们浏览网页实际上是将虚拟主机中的网页内容下载到本地硬盘，再用浏览器解释查看的。

下载网页的快慢在显示速度上占了很大比重，所以，网页本身所占的空间越小，那么浏览速度就会越快。

这就要求在做网页的时候遵循一切从简的原则，如：

不要使用太大的Flash动画、视频、图片等。

　　二、如没必要，尽量使用静态HTML页面

　　众所周知，ASP、PHP、JSP等程序实现了网页信息的动态交互，运行起来的确非常方便，因为它们的数据交互性好，能很方便地存取、更改数据库的内容，使网站“动”起来，如：

论坛、留言板等。

但是这类程序必须先由服务器执行处理后，生成HTML页面，然后再“送”往客户端浏览，这就不得不耗费一定的服务器资源。

如果在虚拟主机上过多地使用这类程序，网页显示速度肯定会慢，所以没有必要，请尽量使用静态的HTML页面。

　　三、不要将整个页面内容塞到一个Table中

　　这是网页设计的问题了，很多站长为了追求页面统一对齐，将整个页面的内容都塞进了一个Table（表格）里，然后再由单元格td来划分各个“块”的布局，这种网站的显示速度是绝对慢的。

因为Table要等里面所有的内容都加载完毕后才显示出来的，如果某些内容无法访问，就会拖延整个页面的访问速度。

正确的做法是：

将内容分割到几个具有相同格局的Table中去，不要全都塞到一个Table里。

其实现在都WEB标准都提倡抛弃表格！

　　四、将ASP、ASPX、PHP等文件的访问改为．js引用

　　这在ASP、ASPX、PHP等程序设计时应该注意的，如果你要在静态的HTML页面里嵌入动态的数据，而这些动态的数据是由ASP、PHP等程序来提供的话，会使用以下的语句引用：

这样的话，每次有一个人访问你的网站，服务器就要执行并处理一次network_index.asp文件，从数据库抽取相应的数据，再输出给网页显示，如果有几万个人同时访问，就要执行几万次，后果就可想而知。

建议在这些程序中将数据动态生成到一个network_index.js文件中去，然后在首页通过

这样的代码来引用该network_index.js文件。

这样，数据显示的任务就交给客户端的浏览器去做，不会耗费服务器的资源，显示速度自然就很快；前者所花的时间几乎是后者的几倍！

　五、使用iframe嵌套另一页面

　　如果你要在网站上插入一些广告代码，又不想让这些广告网站影响速度的话，那么，使用iframe最合适不过了。

方法是：

将这些广告代码放到一个独立的页面去，然后在首页用如下的代码将该页面嵌入即可，这样就不会因为广告页面的延迟而拖了整个首页的显示，代码如下：

leftmargin=0

marginheight=0

marginwidth=0

scrolling=nosrc="

topmargin=0width=700height=440>

　　其中

--------------------------------------------------

网页速度优化细节

--------------------------------------------------------------------------------

2010-05-24

一。

网站中图像格式

需要知道在什么时候应该使用什么格式，以减少网页的加载时间。

1、JPG：

一般用于展示风景、人物、艺术照的摄影作品。

有时也用在电脑截屏上。

2、GIF：

提供的颜色较少，可用在一些对颜色要求不高的地方，比如网站logo、按钮、表情等等。

当然，gif的一个重要的应用是动画图片。

就像用Lunapic制作的倒映图片。

3、PNG：

PNG格式能提供透明背景，是一种专为网页展示而发明的图片格式。

一般用于需要背景透明显示或对图像质量要求较高的网页上。

二。

关于网站CSS的优化

Css代码

margin-top：

10px;

margin-right：

20px;

margin-bottom：

10px;

margin-left：

20px;

你可以将它简化为：

margin：

10px20px10px20px;

又或者这句：

Html代码

1.＜pclass="decorated"＞Aparagraphofdecoratedtext＜/p＞

2.＜pclass="decorated"＞Secondparagraph＜/p＞

3.＜pclass="decorated"＞Thirdparagraph＜/p＞

4.＜pclass="decorated"＞Forthparagraph＜/p＞

可以用div来包含：

Html代码

＜divclass="decorated"＞

＜p＞Aparagraphofdecoratedtext＜/p＞

＜p＞Secondparagraph＜/p＞

＜p＞Thirdparagraph＜/p＞

＜p＞Forthparagraph＜/p＞

＜/div＞

简化CSS能去除冗余的属性，提高运行效率。

如果你写好CSS后懒得去做简化，你可以使用一些在线的简化CSS工具，比如CleanCSS.

三。

网页信噪比

网页信噪比表现：

有些网页以纯文本方式体现的网页和关键字词密度以及大小一样的网页在搜索引擎返回的结果高的原因。

并且也能合理结实在一些搜索结果中，关联一个网站的第一页是网站的某个以文字出现的页面，而第二页才是该站的首页。

网页信噪比原理：

信噪比（Signal/Noise），原是电声学领域中的一个概念，指声音源产生最大不失真声音信号强度与同时发出噪音强度之间的比率。

在网页优化中同样存在这样的原理，搜索引擎抓取页面，主要抓取除去html修饰后的文本内容，这部分内容可以认为是不失真声音信号，而同时产生的那部分html标签内容，可以被认为是噪音。

因此，网页信噪音比，可以这样理解：

指网页中的文本内容部分与生成这些文本而产生的html标签内容的比率。

声学中，信噪比越高，说明声音信号越清晰，同理，网页信噪比越高，说明页面中纯文本内容相对越多，搜索引擎抓取页面也越容易。

网页信噪比技巧：

1.减少网页中的图片，必须使用的请加上注释。

2.减少网页中flash，还没有听说哪个搜索引擎能识别的

3.网页中css、js封装，统一调用

部分优化人士认为，一般网页信噪音比在30%左右比较合理。

================================================

优化代码2007-03-0116:

07转自:

最近看过许多网友制作的SKIN的CSS文件，发现其中有着许多冗余的代码。

下面我来跟大家介绍一下，如何清除这些冗余的代码，让你的CSS文件更加简洁。

　　一、margin、padding属性

　　参照相关资料我们可以知道，margin和padding代表的意思分别是外部边距和内部填充距离，在许多网友的CSS中，关于这两个属性的冗余代码是出现得最多的。

比如：

margin:

0px，大家可以查看一下自己的CSS文件中，是否许多的margin:

0px，其中有的是不需要的，你可以尝试删除它，当然也并不是所有的margin:

0px都没有用，相同，padding:

0px也一样。

　　另外，margin和padding中各项属性的顺序是：

上右下左，你只要记住是顺时针方向就好了。

我们再看看这两段代码：

margin:

0px0px0px10px；

margin-left:

10px；

其实他们的作用是一样的，下面的则是一种缩写，使用缩写我们可以减少CSS代码，并使阅读起来更为方便。

（padding也相同。

）

　　二、!

important;属性

　　!

important是CSS1就定义的语法，作用是提高指定样式规则的应用优先权。

IE是不支持这个语法的，而其他的浏览器都支持，通过这一点，我们可以得知，设置了优先权的代码是不会被IE执行的。

所以我们可以important的后面添加CSS样式，使其可以区别于IE和FireFox等浏览器。

　　上次在看Miles的CSS代码时，我看到了这样一句：

height:

50px!

important;height:

50px;

　　这里就是多余的了，我们可以这样写：

height:

50px就够了，这个错误在我刚开始制作CSS时也曾出现过。

　　三、text-align、font样式

　　这两个样式的作用我就不说了，但是这两个样式在许多网友的CSS中也存在许多冗余。

下面我来举例说明一下，层的定义如下：