周末在家宅着 ， 刷了不少的网页 ， 发现很多网站都没有优化它的加载速度 ， 有时打开一个网页要等待10来秒才能加载完成 ， 虽然网页内容很不错 ， 但是给我的第一印象就是慢 ， 不能忍啊！
【优化网页速度的7种方法 优化网页速度的方法有哪些】其实有很多简单粗暴 ， 又很有疗效的优化方法 ， 我觉得有必要给各位产品经理分享一下 ， 好让你们去督催开发哥哥优化 ， 改善一下网页的加载体验～
首先 ， 我们来看下网页的加载流程 。 打开一个网页 ， 会先拉取一个html页面 ， 然后浏览器解析了这个html页面后 ， 会根据页面的内容 ， 去拉取javascript、css和图片文件 ， 最终根据这些文件 ， 将页面渲染出来 。
我们可以看到 ， 影响一个网页展示速度的主要因素不是网页本身 ， 而是它依赖的一些其它文件 。 如果优化了这些资源的加载速度 ， 那么网页展示的速度也就上去了 。
有哪些简单粗暴的方法呢？让我来一一列举：
1.优化图片资源的格式和大小一个网页中 ， 图片资源的大小占比是最多的 ， 而且单个的文件的大小也很可观 。 因此 ， 在保证图片质量不变的情况下 ， 尽可能的使用高压缩率的图片格式 ， 图片格式可以按照这个优先级选择webp > jpeg > png > bmp 。 同时也要根据图片展示尺寸来拉取大小最为匹配的图片资源 ， 不要没事就把原图拉下来使用 。 以前我就遇到过这种情况 ， 一个196*196大小区域展示的图片 ， 它的文件竟然达到了几兆 ， 最后才发现把1960*1960分辨率的原图拉下来了 。
2.开启网络压缩大部分浏览器在发出请求时 ， 会带上这个标记「Accept-Encoding: gzip, deflate」 ， 表示这个浏览器可以接受以gzip压缩方式传输数据 ， 如果你的网页服务器也支持gzip压缩数据 ， 那么数据以gzip方式传输时 ， 会减少70～80%的流量 。
3.使用浏览器缓存同一个站点下面的不同页面 ， 往往都会复用一部分资源文件 ， 如果把这些资源文件设置为可缓存的 ， 那么在刷新或者跳转到另一个页面时 ， 都无须再从网络拉取相关资源 ， 这样就大大加快了网页的加载速度 。
4.减少重定向请求有的网站对于不同的终端制作了不同的页面 ， 比如说在手机上访问微博 ， 会从weibo.com重定向至weibo.cn ， 每一次重定向都会导致浏览器重新发起请求 ， 延长加载时间 。 对于这种情况 ， 应该尽可能使用响应式设计 ， 一个weibo.com站点覆盖至所有终端 。
5.使用CDN存储静态资源CDN是一种静态内容分发网络 ， 它在每个省 ， 甚至每个城市都部署有自己的服务器 ， 用于分发这些静态内容 ， 那么当某个城市的用户要拉取某个资源时 ， 他会首选从本地的CDN服务器上拉取 ， 这样可以保证他最快速的获得该资源 。 据砖家统计 ， 网络资源中有70%的是静态资源 。 这就意味着 ， 有70%的内容产生后是不会变化 ， 那么将它们全部放在CDN上面 ， 可以提升这70%的资源的下载速度 。
6.减少DNS查询次数很多人喜欢把不同的图片挂在不同当域名下 ， 比如说图片A挂在a.pm-teacher.com ， 图片B挂在b.pm-teacher.com 。 当一个网页同时使用图片A和图片B时 ， 浏览器需要查询两个域名 ， 要知道 ， 每次解析域名都是会浪费时间的 ， 所以尽可能的将全部图片放在一个域名下 。
7.压缩css和js内容这里说的压缩和第2点并不重复 ， 上面提到的压缩是不改变文件内容的压缩 。 而css和js中有大量的空格和变量命名（如hello="hello word";） ， 如果将这些空格去除 ， 并用简单的字母来代换变量名（如a="hello word";） ， 那么这些css和js原文件的大小也会缩小 ， 这样也对加快拉取速度是有帮助的 。
不知道你有没有看出来 ， 上面提到的优化方案的核心就3点：减少请求数、减少资源大小、找最快的服务器 。 如果你是一个网站的产品经理 ， 快去找你们的开发确认是否有做过类似的优化吧 。
推荐阅读
- 整站优化的详解 整站优化是什么意思
- 做SEO优化的3点建议 怎么做好seo
- 为什么电波的速度跟光的速度一样？ 电磁波速度
- 做好优化的6个方面 网站建设时如何提前做好SEO优化？
- seo优化的6个技巧 网站如何优化
- 11个最重要的SEO指标 seo优化指标有哪些
- 关键词选择的5个技巧 网站做优化的时候如何选择关键词？
- seo优化操作指南 如何做好企业网站seo优化？
- 浏览器自动跳转到某个网页怎么办？小编教你浏览器被劫持的解决方法2020电脑教程推荐
- 提高排名的4大方面 如何提高百度权重优化排名？