网站打开速度优化与减少加载项

更新时间:2019-10-05 16:40:02 来源:青锋建站 作者:青锋建站

  虽然目前服务器运营商的网络带宽费用越来越低,可能有时用户会认为这么点流量我不在乎,但是现实情况并非如此。这种情况只相对于使用独立服务器的用户,但对于企业网站建设用户是多个网站共用服务器的,带宽一定,如果网站过于庞大,网站打开速度仍然会很慢。即使我们使用独立服务器,假如使用的是5M的服务器,价格在万元左右,如果我们的网站打开速度优化并不好的话,如果同时多个访客打开网站,仍然会很慢。
  网站打开速度优化不仅可以增加用户体验节省网站带宽,而且对于网站seo关键词排名也非常有利,因此网站打开速度优化是网站非常重要的一项指标。以下是青锋建站给大家总结的网站打开速度优化的原则和方法。

网站打开速度优化的原则

  1.评估所有依赖是否必要,权衡利弊。
  2.依赖的下载路径是否可靠,不可用时候是否会阻碍整个页面。
  3.产品设计时候就需要抛弃浪费带宽的设计。
  4.压缩所有可以压缩的资源
  5.代码自不用说,都是文本,全部压缩。

石家庄网站开发,网站制作,做网站

网站打开速度优化之图片优化

  1.去掉不必要的图片
  2.多使用css3来代替图片
  3.使用压缩率更高的图片。特别是gif动图,一些视频格式(H.264或WebM)的体积比gif小很多。
  4.用艺术字字体,不要用图片
  5.仔细权衡图片和文字的关系。要表达一个意思,可能一图胜千言。多了一张图片,反而节省了大量文字。
  6.使用progressive jpeg。相比随着数据下载从上到下显示的baseline jpeg,progressive jpeg是由模糊到清晰,用户体验好,也不会导致reflow。
  7.图片分辨率要尽可能小,避免图片分辨率大于显示分辨率。
  8.为使用更新浏览器的用户提供更现代的图片格式。
  9.多种分辨率的位图供不同页面大小使用。
  10.要给标签指明宽高,否则会导致reflow。
  11.使用HTTP/2。比如,精灵图是由很多小图片组成的一张大图片,可以减少http请求。但是却难以缓存,修改一个小图片,导致所有小图片缓存失效。HTTP/2,一个链接内可以发起多个请求,便无需使用精灵图。

网站打开速度优化之优化字体

  1.@font-face 中unicode-range可以制定字符范围,用来避免下载不需要的语言的字符。
  2.确保字体都被压缩过。
  3.用@font-face的display属性和FontFace对象管理好字体加载时的逻辑。
网站打开速度优化之JS与CSS加载优化
css优化
  CSS文件会阻塞渲染。浏览器构建好DOM树后,必须等待CSSOM树构建完成。
  在文档顶部防止外联CSS的标签,让浏览器尽快请求CSS文件。
  避免在css文件中使用@import,因为只有包含import的文件被下载编译后,浏览器才会发现并下载import的css。
  可以考虑使用内联CSS,无需额外请求,不会阻塞渲染。
js优化
  在CSSOM构建完成前,js不会开始执行。
  js也会阻止DOM树构建。除非在 <script>标签上标记async。
  用Chrome开发者工具的audits检查网页。
  以上就是青锋建站的网站建设工程师为大家带来的关于网站建设中如何有效的节省资源,为加载做好优化的全部介绍,希望大家能够喜欢。青锋建站,提供专业的高品质网站制作服务,包括网站建设,SEO,网络营销,PHP开发,网站建设知名品牌,全国接单,为企业构建强有力的营销平台。
 

转载请注明来源网址:青锋建站-http://www.sjzphp.com/webdis/open_speed404.html

电话 15632335515 | 邮箱 943703539@qq.com | QQ 943703539 | 微信 qingfengjianzhan

Copyright © 2016-2026 青锋建站 版权所有