当前位置: 代码迷 >> Web前端 >> 增高网页显示速度的几点尝试
  详细解决方案

增高网页显示速度的几点尝试

热度:85   发布时间:2012-11-01 11:11:32.0
提高网页显示速度的几点尝试



??

随着网速不断的提高,网页的显示速度大多数情况下都在用户的容忍范围内

但是也有很多对速度很挑剔的用户,比如我

对于那些点一下,“半天”没显示完整的网站一般都是零容忍

所以自己在做网站的时候一直在考虑这个问题

如何能最大限度的提高显示速度

同时不能损害网页的美观和信息量

?

提高显示速度的途径有很多

常用的有:

1、尽可能减少客户端想服务器的请求次数,合并css、js文件,减少图片和其他资源数,小图标、小图片可以利用背景图片定位的方法,把这些小图片放在一个文件上(这个做法我最早是见Google做的)

2、尽可能的减小网页中图片、Flash、音频、视频的大小,去除一些花哨的东西

3、布局采用标准的css+div,切忌把整个页面所有的元素都放在一个div里,或者table里,这样做加载完和所有元素后才会显示

4、如果要从服务器加载很多动态内容,可以考虑使用Ajax,提高用户体验

?

暂时想到这么多,陆续补充

?

关于那个合并小图片、背景图片定位的实现方法演示如下:

html:

??? <ul>
??? ??? <li><div id="site" class="icon"></div><a href="default.aspx">学校主站</a></li>
??????? <li><div id="bbs" class="icon"></div><a href="bbs/">溪河论坛</a></li>
??????? <li><div id="oa" class="icon"></div><a href="oa/">网上办公</a></li>
??? </ul>

css:

#site { background-position: 0px 0px;}
#bbs { background-position: 22px 0px;}
#oa { background-position: 44px 0px;}

.icon {?background-image: url(imgs/default_icon.jpg); height: 22px; width: 22px; float: left; margin-right:10px;}
图片:

?

<!--E 文章--><!--S 日志顶部操作-->

1 楼 上善如水 2010-12-17  
但是客户,要求页面背景比较花哨啊。有没有更好的方法,让页面加载快点?
  相关解决方案