现在,几乎所有人都认识到一个有效的网页必须是快速的。读者的注意力有限,通常不会有耐心加载一个浮肿的网页。利用下面这些技巧、工具和资源,您就更能够获取读者的关注。

技巧

利用这些技巧来消瘦和加速您的网页:

  1. 移除任何不重要的东西。不要卖弄您的设计技巧,只需要保留和网页功能相关的部分。

  2. 减少HTTP请求。通过切掉或者组合HTTP请求,减少读者加载时间。
  3. 减少网页负荷。保持HTML和图像在50KB以下。
  4. 使用缩略图(thumbnail)。通过thumbnails的格式展示图像,如果读者想看全图,他们就会点击缩略图。
  5. 把内容分散于不同的空间。使用内容传输网络减少反应时间。
  6. 取消HTML评论HTML评论是有用的,但是却会妨碍网页速度。
  7. 减少图像数量。图像越少表明HTTP请求越少。所以,如有可能,尽量使用文本代替图像。
  8. 让浏览器知道缓冲时间使用Expires header,可以将特殊的内容缓存在浏览器的Cache中一段时间,第二次浏览时,页面加载速度会更快。
  9. 压缩图像保存图像之前先压缩,甚至是Flash上的图像。
  10. 压缩内容使用gzip压缩网页内容。
  11. 小心旗帜广告旗帜广告会增加页面加载时间,减少页面效率。
  12. 在Head文件添加样式表。在顶部添加样式表,为读者提供视觉反馈。
  13. 使用CSS (Cascading Sytle Sheets,层叠样式表)。如果您的网页格式在后缀名为.CSS的文件上,网页就会被缓存。
  14. 把脚本放到页面底部 脚本下面的内容会受到阻碍,把脚本放在底部,有利于其他内容的加载。
  15. 避免嵌套表格或者整个页面都是表格嵌套表格或占据整个页面的表格会延长页面的加载时间。
  16. 小心CSS表达式如果您使用CSS表达式来设计您的页面属性,表达式可能被多次反复执行。解决的方法是消除表达式或者使用旧的表达式。
  17. 选择合适的图像格式。照片和真彩色图像用JPEG格式,单色图像用GIF格式,颜色比较多,可以使用PNG格式。
  18. 分页如果长篇大论可以被分解,就把它分为几个页面,页面内容越短,加载速度就越快。
  19. 把JavaScript和CSS移到站外。如果JavaScript和CSS与网页的HTML一致,每次浏览的时候都会重新加载,但是如果这些JavaScript和CSS来自站外,他们就会被缓存,从而加快加载速度。
  20. 在链接末加斜线。方便服务器计算正在加载的目录网页,加快加载速度。
  21. 整理代码WYSIWYG (What You See Is What You Get,所见即所得)编辑器通常会增加一些像空标签这样的不必要代码。把这些代码删除,有利于网页加速。
  22. 减少DNS(Domain Name System,域名系统)寻找。 页面上每一个主机名都要求一次DNS寻找,所以要减少图像、脚本、目标和其他成分中的不同的主机名。
  23. 使用高度和宽度标签。这样会使浏览器识别图像的范围,加速加载时间。
  24. 整理JavaScript通过切掉 “space”、”newline” 和 “tab” 等不需要的字符,完善JavaScript代码,提升网页加载速度。
  25. 使用Photoshop的Save for Web功能这样有利于减小图像容量,节约网页加载时间。
  26. 避免重导向。重导向会阻碍页面加载,因为浏览器需要时间寻找新的网页。
  27. 尽量避免JavaScript。JavaScript增加HTTP请求和网页的大小,所以最好不要使用JavaScript。
  28. 切掉重复的脚本。检查您的代码,确保没有不需要的脚本。
  29. 减少图像颜色。颜色越少,文件就越小。
  30. 学会使用ETags像Apache这样的服务器提供ETags,使用得当有利于缓冲;如果使用不当,就会适得其反。
  31. 不要用图像代替文本。这样有利于减少HTTP请求,加快网页加载时间。

工具

这些工具可以帮助您测试和提升网页速度。

  1. Web Page Analyzer: 分析和测试网页速度。
  2. Online Image Optimizer: 迅速简单的压缩您的图像。
  3. Akamai Technologies: 提供大量的加速方案,特别是内容传输网络。
  4. HTML-Optimizer: 清理HTML和脚本问题,例如不正确的标签、遗漏的属性和坏链接。
  5. JSMin:承诺移除JavaScript文件的注解和不必要的白色地带,以便使网页加速。通常,这个工具可以使原文件大小减少一半。
  6. PageTest: 测试您的网页的加载速度。
  7. CSS Tweak: 优化样式表。
  8. The JPEG Wizard Online Optimizer: 免费无损坏地压缩图像。
  9. ShrinkSafe: 压缩文件大小,使代码更紧凑更少。
  10. TRaceRT: 监控网页的速度、DNS和追踪轨迹。
  11. mod_gzip: 在Apache网络服务器上压缩内容。
  12. Clean CSS: 这个工具可以合并类似的选择,去除不必要的属性和白色地带。

资源

提升网页速度的观点和指导。

  1. 加速网页的最优方法: 学习一些来自Yahoo!的方法
  2. 加速网页加载时间: 提供格式化的技巧。
  3. 想让网页加速吗?: Edward Tsai提供很多网页加速的服务、产品和战略建议。
  4. 加速网页的5个技巧Paul Stamatiou把网页压缩到34KB的常用方法。
  5. 优化主页: 当您评估您的主页的时候,可以考虑这些方法。
  6. 加速您的网页: About.com提出了很多有用的技巧。
  7. 旗帜广告的成本: 广告服务如何使网页加载变慢及如何影响读者的浏览。
  8. 加速网页的6种方式: 是网页加载变快的技巧
  9. 如何加速您的网页: 此文提供几乎50种不同的减少网页加载时间的策略。
  10. 加速网页: Jennifer Alvin 介绍了很多“节省带宽”的技巧。

版权声明:本文为MaxIE原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://www.cnblogs.com/maxie/archive/2008/05/08/1188373.html