当我最近在HotBot工作并试图加速我的网页时,我花了很多时间查看其它网站,想从他们的成功和失败中学点什么。我学到很多如何使页面装载和绘制很快的方法,但是也发现非常多的没有必要的臃肿的东西。
基于我所发现的和没有发现的,我总结了一些使网页紧缩的方法。既然你已经使你的图像和表格尽可能地苗条,现在让我们看看优化网站的最后一关。
与松弛做斗争的最后防线我理解找到完美方法实现好的设计使广告商高兴和每个页面可用是多么的困难。但是我希望设计者最好避免海啸般的连接。
很多出版商(如ZDNet和CNET)因为连接太多而使网页阻塞-每页上都有大量指向其它页和其它网站的连接。我甚至在我们自己的后院发现了同样的问题(或者是不是可以说我们的前门?)。
这样的交叉连接通常是考虑到市场的原因:让读者知道同一公司的其它内容和站点。但是你也不必象一个人类问题专家那样认为网页上连接越多,单个连接被访问的机会越少。经过10个左右连接后,读者趋向于只读页中间的文章。这些未读、未被接触的“连接农场”可以占到网页HTML的一半。并且,不象logo和icon驻留在cache里,调用每页时,它们重新下载。
这些连接背后的长URL的累加也很可观。AltaVista为附加查询结果页的“1 2 3 ... 20”(在每个查询结果页的底部)连接就要浪费4KB的HTML。通过实现更短、更少的URL,最近AltaVista重新进行了设计,把连接的尺寸平均减少到1KB。结果是,通过拨号modem的页面下载速度明显提高(就金钱和常识来说,意味着客户更愉悦,每分钟的页面点击率越多)。
一些同样的网站也为放入大量的交叉连接感到内疚。有时他们故意这么做来增加页面点击率,但是通常可以加一个附加的页来容纳其它用户感兴趣的内容。
如果你不想让读者下载他们不需要的字节,同时又不希望他们退回去重新下载读过的页面,那么你知道他们无论如何也要一页。所以要研究你的服务器日志,发现用户点击最多和最少的是什么。删掉没人读的内容,把它们替换为日志数据证明有必要的信息。
把JavaScript/" target="_blank">JavaScript当作垃圾
很多网猴认为页面中的JavaScript/" target="_blank">JavaScript不使页面变慢。然而,JavaScript/" target="_blank">JavaScript是一种解释语言,而不是编译语言-这意味着它被装载后还要被分析。我们习惯于在HotBot中使用JavaScript/" target="_blank">JavaScript函数使浏览者的键盘输入聚焦到文本输入框内。这样 桓龊??挂趁娴淖霸孛飨员渎??词顾?某踔允俏?思铀俨檠??
检查你页面中的JavaScript/" target="_blank">JavaScript,看看它是如何影响装载和初始化时间的。如果你用JavaScript/" target="_blank">JavaScript控制plug-in或dHTML,应该查看用户手册看看这些组件是如何使用的。你可能会发现你的20行的JavaScript/" target="_blank">JavaScript程序可以用一个内置的装载和运行更快的函数来替代。我们就犯过这样的错误:我们用JavaScript/" target="_blank">JavaScript写了一个“NextTen”函数来改变装载到MSIE4的一个表中的内容。后来我们知道IE的内置nextPage函数比它快10倍,而且当它运行时不会使页面混乱。如果你的读者遇到过这样的麻烦,试试这个函数-对每个人都有利。
扔掉小技巧、计数器和其它活动的部分
坦白地说,关心你的网站的访问人数的人不会很多(如果是一些令人印象很深的数字,可以在你的页面中编码,当它突变时再更新之)。初始化Java并装入一个applet只是使页面中的一些文本滚动-这样的页面不值得去等。今年早些时候,CNN通过移去它的Java大字标题把页面装载速度从50秒减少到20秒。
你是怎么想的?- CNN的点击率和观众份额会增加还是减少?
测试你的网页
在过去的四天里,我们为你提供了很多加速网页的方法。为了能让用户能有所体会,你需要为网页制定一些行为标准并实行之。
制定你的标准
别只自问:“网页现在有多快?”并试图进行改善。应该问“页面应该有多快?”。或者减少用户的等待时间,或者让用户觉得他们的等待是值得的。
制定合理指导方针的最佳方法是检查你的竞争对手的网站。查找与你的网站提供相同内容、服务、价值等的网站,研究它们的表现。请教你们公司市场部、销售部或其它部门的人,让他们评价你的竞争对手的网站。可以进行一次角色扮演:把你自己当成一个用户,进行一次网上漫游。
当你确定了要查看哪些网站后,确定你要进行到哪里。或许整个页面装载完,但是或许应该确定某个特定条目的装载时间(例如,一个新网站的顶部标题)。我们研究过的一些站点非常好:
在页面完成装载之前,用户可以看到一些很重要的东西。
50张美丽的动物摄影作品欣赏动物摄影2014-01-01
Brandnew:2013年最佳LOGO更换榜单VI设计2013-12-27
优秀包装设计精选集(45)包装设计2013-12-22
用户体验设计遇见色彩情感网页理论2013-12-22
网页设计趋势浅析网页理论2013-12-22
设计师如何通过颜色来影响消费者网页理论2013-12-03