站长论坛

20z站长论坛

 找回密码
 立即注册
查看: 1208|回复: 2

[站长杂谈] 优化网站页面速度的几个要点,今天在20z论坛谈谈加载速度优化的建议

[复制链接]
GMT+8, 2019-11-17 16:39 | 显示全部楼层 |阅读模式
优化网站页面速度的几个要点,今天在20z论坛谈谈加载速度优化的建议。
通常我们做好一个网站,都会出现大大小小的问题,严重的问题就是一个网站打不开或者打开速度慢,所以打开一个网站如果加载慢也就失去网站存在的意义,谁会去等待一个网站访问后过了许久还是看不到网站内容,见不到网站信息版面,所以根据我建站多年的经验总结,一般一个网站如果打开速度超2分钟以上,百分之95以上的访客就会直接关闭不再等待,打开网站1分钟以上,就会失去访客百分之70以上用户。那么一个网站如何提升加载速度呢?这就是今天我要在20站论坛讲的网站页面加载速度的几个要点。
网站页面加载速度解析.png

  提高页面加载速度,提升用户体验,对运营网站来说,尤其是平台类型网站来说,至关重要。那么如何提高加载速度呢?今天我就讲解几个加载速度重点方,希望对你有所帮助。

  1、合并网页中Js文件和CSS

  将JS代码和CSS样式分别合并到一个共享的文件,这样不仅能简化代码,而且在执行JS文件的时候,如果JS文件比较多,就需要进行多次“Get”请求,延长加载速度,将JS文件合并在一起后,自然就减少了Get请求次数,提高了加载速度。

  2、使用Sprites图片技术

  Spriting是一种网页图片应用处理方式,它是将一个页面涉及到的所有零星图片都包含到一张大图中去,然后利用CSS技术展现出来。这样一来,当访问该页面时,载入的图片就不会像以前那样一幅一幅地慢慢显示出来了,可以减少了整个网页的图片大小,并且利用CSSSprites能很好地减少网页的http请求,从而大大的提高页面的性能。

  3、压缩文本和图片

  压缩技术如gzip可以有效减少页面加载的时间。包括HTML,XML,JSON(JavaScript对象符号),JavaScript和CSS等,压缩率都可以在大小70%左右。文本压缩用得比较多,一般直接在空间开启就行,而图片的压缩就很多的处理者比较随意,很多都是直接上传,其实这样不好,一张未经压缩的图片和压缩到80%品质的图片,在视觉上区别不大,但文件大小却相差4-5倍,所以为了提高加载速度和降低存储空间的占用,图片还是要处理的好。

  4、延迟显示可见区域外的内容

  为了确保用户可以更快地看见可见区域的网页可以延迟加载或展现可见区域外的内容,为了避免页面变形,可以使用占位符标签制定正确的高度和宽度。比如WP的jQueryImageLazyLoad插件就可以在用户停留在第一屏的时候,不加载任何第一屏以下的图片信息,只有当用户把鼠标往下滚动的时候,这些图片才开始加载。这样很明显提升可见区域的加载速度,提高用户体验。

  5、确保功能图片优先加载

  网站主要考虑可用性的重要性,一个功能按钮要提前加载出来,用户进入下载页,一个只需要8s时间的下载花了5s在等待、寻找下载按钮图片,谁能忍受?

  6、重新布置Call-to-Action按钮

  其实这个和上面一条是差不多的,都是从用户体验速度着手,跳过了网页的整体加载速度。速度没变,只是让一些行为按钮提前,Call-to-Action按钮一般习惯设计在页面底部,这样的习惯对于用户来说并不总是好的,购买用户需要等到最下面加载出来才能点击下一步操作。可以调整CTA按钮的位置或使用滑动的图片按钮。很多大型购物网站的加入购物车就是这种类型。

  7、图片格式优化

  不恰当的图像格式是一种极为常见的减慢加载速度的罪魁祸首。正确的图片格式可以让图片缩小数倍,如果保存为最佳格式。可以节省大量带宽,减少处理时间时间,大大加快页面加载速度,这是一种很常见的做法。一般色彩比较丰富的图片采用JPG格式(80%)的品质,象图标按钮,如果是单色系,可以采用GIF或PNG。如果有渐变的图标和按钮,则需要保存为PNG,这时可以保存为8位,而不需要保存24位。

  8、使用ProgressiveJPEGs

  ProgressiveJPEGs图片是JPEG格式的一个特殊变种,名为“高级JPEG”。在创建高级JPEG文件时,数据是这样安排的:在装入图像时,开始只显示一个模糊的图像,随着数据的装入,图像逐步变得清晰。它相当于交织的GIF格式的图片。高级JPEG主要是考虑到使用调制解调器的慢速网络而设计的,快速网络的使用者通常不会体会到它和正常JPEG格式图片的区别。对于网速比较慢的用户,这无疑有很好的体验。

  9、精简代码

  这个可以说是最直接的一个方法,也是用得比较多的,对网页代码进行瘦身,删除不必要的沉冗代码,比如不必要的空格、换行符、注释等,包括JS代码中的无用代码也需要清除。其中对于注释代码的清除可能有些人存在误区,甚至有的在里面堆砌关键词。

  10、延迟加载和执行非必要脚本

  网页中有很多脚本是在页面完全加载完前都不需要执行的,可以延迟加载和执行非必要脚本。这些脚本可以在onload事件之后执行,避免对网页上重要内容的呈现造成影响。这些脚本可能是你自己网页的甲苯,往往更多的是一些第三方脚本,这样的有很多,比如评论、广告、智能推荐、百度云图、分享等等,这些完全可以等主体内容加载完后再执行。

  11、使用AJAX

  AJAX即“AsynchronousJavascript+XML“,是指一种创建交互式网页应用的网页开发技术。通过在后台与服务器进行少量数据交换,AJAX可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。传统的网页(不使用AJAX)如果需要更新内容,必须重载整个网页面。

GMT+8, 2019-11-17 16:39 | 显示全部楼层
网站主要考虑可用性的重要性
回复 支持 1 反对 0

使用道具 举报

GMT+8, 2019-11-17 16:39 | 显示全部楼层
的确网页加载慢是会影响访客
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

二十站网

关于20站| 联系我们| 20Z网址导航| 20z站长论坛 ( 闽ICP备13002936号 )

GMT+8, 2019-11-17 16:39 , Processed in 0.119718 second(s), 24 queries .

Powered by Discuz! X3.1

© 2012-2019 bbs.20z.com

快速回复 返回顶部 返回列表