越来越重要的SEO优化项目：『网站速度』优化

假如你有长时刻看我的部落格文章，应该会知道我着重很屡次，Google十分的注重用户体会，只以用户为最优先考量、注重用户体会的网站主，才能够真的了解SEO该怎样做，而『网站速度』天然在网站优化上是一个很重要的项目，关于SEO以及网站的体会都有很大的影响。特别自从Google发布了网页体会信号（Page Experience）之后，网站速度明显只会越来越重要，我想我应该要特别更新一下速度优化的文章，来供给更多的观念以及共享。

这篇文章我会完好共享『网站速度』关于网站的影响，以及你该怎样做。

先谈『网站速度』终究会怎样影响你的网站

一般我在接受参谋专案时，『网站速度』会是咱们评价『网站健康程度』的重要方针之一，因为速度是一个十分综观的方针，他影响的层面十分多，咱们也先来开端了解一下，终究关于『网站速度优化』这件事过于慢待的话，影响层面有哪些：

直接性影响你的网站SEO排名Google在2010年时就发过官方声明，网站的速度、效能将正式影响搜索排名，Google在评价一个网站是否值得得到好的排序时，网站速度已被列入为排名要素。

不过Google的所谓的『排名信号』是有分强度的，每一个优化项意图『排名信号』强度都不同，简略来说，Google在判别你的网站是否值得被排序到搜索成果页的前面时，有着十分杂乱的演算法而且参阅了十分多的信号，这些信号有强弱之分，若咱们针对信号强度较高的项目进行优化的话，你在SEO的成效上会较简单看到成效，反之若是信号强度较弱的排名信号，则是优化了也未必会看到成效。

举例来说，网站全体的内容是否够丰厚、够优质便是归于高强度信号。你网页的网址里边有没有说到关键字，便是归于极度低强度的信号，一般网址里边没有塞关键字，也能得到好的排序。

那么咱们这篇文章正在谈的『网站速度』是归于多高强度的排名信号呢？假如咱们优化了网站速度，关于SEO的成效有多大的影响呢？

答案是：『网站速度』归于中至高强度的信号，而且信号强度只会被设定的越来越强。

多年前，Google刚开端宣告『网站速度』会影响排名的时代，其时在许多专案上，咱们优化网站速度后，都未必会调查到网站的排名、SEO体现、SEO流量会提高，仍是要依托反向连接、内容、On-Page的调整，才会看到明显的成效。但这两年在优化的实务经历以及数据调查之下，我开端发现『网站速度』的信号强度越来越高，优化后的作用大多都很明显，一起，Google在2018年时有揭露声明『网站速度』的信号强度会提高到影响手机排名，2020年时又宣告了Page Experience（网页体会信号）这个与网站速度有关联性的排名信号，我只能说，定论很清楚明了：

这两年Google越来越注重『网站速度』，他对SEO的影响是逐年在提高，下一年、后年、大后年也肯定会越来越重要，是现在做SEO必定会优化的超级重要项目之一。

除了排名，还会影响Google的爬取额度（Crawl Budget）从前我有写一篇文章谈论过，Google有所谓的爬取额度（Crawl Budget），假如你的网站速度太慢，会影响爬虫来爬你网页的健康程度，假如速度慢到爬虫爬不动你的网页、或爬起来的功率很差，那全体SEO的成效也会欠好。

从『排名信号』的视点以及从SEO技能优化的『爬取』视点来看，网站速度都是至关重要的。

影响运用者体会以及转换率依据Google的研究陈述指出，网站速度关于跳出率的影响是十分明显的，你的网站载入速度若是1~3秒以内，客户跳出离站的或许性会添加32%，但只需慢到5秒，客户跳出网页的或许性就会添加到90%（其实这是十分惊人的数据），客户跳出率高，那么当然就会影响你的转换率、订单成交率等各项商业体现数据。

一个重要的观念：关于网站速度，千万不要自我感觉杰出

网站速度的优化影响的层面许多，从跳出率、运用者体会、影响爬虫的爬取效能、乃至影响SEO的排名。因而网站速度优化，是一个对全体网站都十分有帮忙的优化作业。

在优化时咱们不能用公司、家里的电脑来＂体感＂网站的速度有多快，咱们的用户或许坐落网路环境较差的当地、或是他的手机正连上某个速度较差的wifi 网路。一起，＂你感觉网站速度很快＂并不代表Google认同你的网站速度很快，若今日咱们是要为了SEO而优化网站速度，终究意图仍是＂Google是否评断你的网站速度杰出＂，因而不管是为了用户仍是为了SEO而去优化速度，我主张仍是避免用自己体感的方法来判别网站速度是否杰出，而是应该要运用一些网站速度剖析东西来做剖析以及检测：

引荐东西1：Google Page Speed InsightGoogle Page Speed Insight是Google官方所开发的东西，假如你期望了解＂Google怎样看待你网站的速度＂，用Google的东西就能够到达意图，Google开发的这套Page Speed Insight算是操作起来比较简单上手，介面也不会太杂乱的东西之一，故一开端做速度优化时，我都引荐先以Google的东西为主。

运用上只需点开Google Page Speed Insight的东西，在东西上方输入网址，东西就会给予你的网站一个1~100的分数，除了分数之外，你能够在下图底部的当地看到First Input Delay（ FID）、Largest Contentful Paint（LCP）、Cumulative Layout Shift（CLS）等三个方针，这三个方针是Page Experience（网页体会信号）的三大重要方针（若还不知道FID、LCP、CLS这些方针是什么的话，主张你先阅览网页体会信号这篇文章，再回头来阅览网站速度优化的文章），这三个方针也是你1~ 100分能得到多少分数的重要依据（也请特别留意，举动版的网站速度体现以及电脑版的网站速度体现是分隔的，有或许你的电脑版网页速度很快，但手机版却有许多优化空间）。

值得一提的是，Google Page Speed Insigt这套东西有一个其他东西无法替代的当地，那便是＂Chrome用户体会陈述＂，FID、LCP、CLS等方针都有一个绿橙红所构成的长条图，这个长条图所显现的是实在的、真实有拜访过你网页的运用者们所发生的材料，以下图来说，有62%的运用者在LCP上体会杰出、24%有待改进、15 %为不良。

再把检测陈述往下卷动，咱们会看到许多的速度优化项目，这边是Google的东西提出的速度优化主张，直接主张你该怎样进行优化（这些项目咱们会在文章的后段来进行阐明），实务上咱们会依据陈述检测出来的问题，与网站的PM、网页技能人员来评论该怎样改进这些项目。

引荐东西2：WebPage TestWebPageTest尽管不是Google所开发的东西，但仍是Google官方引荐的可用东西之一，翻开东西后，相同只需输入网址就能够开端做测验，WebPageTest比较不同的是，你能够挑选速度测验的国家以及阅读器，假如你是国际品牌，网站的方针族群来自于各种不同的国家区域，则能够用此东西来检测不同的区域拜访你网站时的速度体现。

当WebPageTest 帮你跑出陈述之后，你能够点开＂Detail报表＂ 就会看到下图的瀑布流材料报表，咱们能够从这个报表中找出最消耗你网页资源的档案是哪些，行销人（非技能人员）能够从陈述中的副档名辨识出连累网站效能的是图片仍是程式档案，jpg/png是图片的档案格局，js/css则是程式档案，若是特定程式档案花费太多效能的话能够找技能人员评论该怎样优化，若是图片档案连累效能的话，则能够将图片透过Photoshop进行紧缩或图片紧缩东西，调整图片后再从头上传图片。

大多的时分咱们其实都能够用Google的Page Speed Insight来处理问题。若感受到网站速度很慢，但透过Page Speed Insight来检测却检测不出问题时，就能够改用WebPageTest来穿插剖析，找出是网页上的那些档案在连累网站的速度。

引荐东西3：Google Analytics的网页操作时刻报表实务上咱们要优化的网页许多，因而会把每一个网页的版型都用速度检测东西来检测一遍并进行优化（比方说：以电商网站来说至少会有三个重要版型，包含『主页』、『产品列表页』、『产品具体页』），但实务上假如你的网页数量太多，不知道该从哪些网页开端优化，你能够翻开Google Analytics的『网页操作时刻』报表，这张报表会呈现出哪些网页速度最慢，你能够先找出最多运用者阅读、但网站速度较慢的网页，优先对这些网页进行优化。

网站速度优化有哪些项目？要怎样做？

上面咱们看完了东西，现在来谈，那么东西跑出数据之后，要怎样着手优化网站速度呢？网站速度优化的项目与要顾的作业十分多，在你开端优化之前，我期望你先留意几件作业：

#1有技能人员帮忙：网站速度有许多优化项目都是需求技能人员帮忙的，请先保证你身周围有乐意陪你评论、规划、履行的技能人员供给帮忙。

以我来说，我的实质以及特长仍然是在『行销人』，一般在速度优化上仍是要倚赖网页技能人员的帮忙以及援助，这都是很正常的。

#2假如你是运用架站渠道：假如你是运用电商渠道，那你很或许没办法优化网站速度，若你感到网站速度太慢且现已影响了SEO、转换率、跳出率等多项商业体现，最直接的处理方案仍是跟渠道的厂商联络并请他们帮忙，但若厂商没办法帮忙，那很惋惜，若期望速度更好，或许要考虑替换一个渠道。

#3假如你是运用架站体系：假如你是运用开源架站体系（像是Wordpress），那么你怎样运用架站体系很或许会影响你的网站速度（像是你运用的主题、插件、功用…等），在优化时最好有很熟悉体系的人从旁帮忙。假如是像WordPress这种很盛行的体系，网路上的文章跟资源也许多，也能够一边爬文一边自己优化。

那么，咱们再来就要开端介绍速度优化上常见的优化项目，以下条列出来的项目我以本文说到的Google Page Speed Insight 这个检测东西会条列出来的优化项目为主，这些也是Google官方主张咱们优化的项目，至于你是否需求优化这些项目，跑一次Google Page Speed的速度检测东西，东西就会条列出来：

运用适宜的图片巨细

图片的巨细太大、解析度太高、质量太高是咱们在速度优化上最为遍及的项目，许多人在上传图片（不管是产品图片仍是文章图片）时都没有特别紧缩的习气，事实上就算你上传的图片解析度为4,000 x 4,000 仍是800 x 800，你的运用者实践看到的图很或许根本是没有太多不同的，但4,000 x 4,000 与800 x 800的图片容量巨细或许能够差到数倍以上。

一般我会主张你找到一个＂解析度不会失真的最低极限＂为多少，并以此为规范即可，以我的文章来说，我也是从400 x 400、 500 x 500、 600 x 600来逐个测验，最终我挑选图片尽或许最大不要超越600，宽度600在我的网页上是明晰且容量不会太大的巨细。你能够透过Photoshop调整图片的质量、解析度、巨细，也能够运用Google官方的免费图片紧缩东西『Squoosh』来紧缩自己的图片。

上述的状况是＂假如你的网页是你能够自己上传图片＂的条件，你能够用Photoshop或是用紧缩东西先将图片紧缩到必定尺度巨细再上传。但假如你是电商网站或许就会遇到下图的状况，许多电商网站的产品列表页（下图左边）以及产品具体页（下图右侧）是运用相同一张产品具体页的图片，运用者看起来巨细不同，是因为网页上的CSS将图片在网页上进行巨细的缩放调整（下图仅是示意图，ebay其实是有做好图片的紧缩，假如想看一下紧缩后的姿态也可参阅ebay的产品列表页）。

举例来说，以网页介面来说，你的产品列表页的图片区块为400 x 400 解析度的小图，而产品具体页的图片为了让顾客能够看得清楚，是运用较大张的800 x 800。

你的产品列表页在网页介面上其实只需400 x 400尺度的图片即可，这时假如你将产品列表页的图片紧缩到400 x 400，档案容量能够操控到必定的巨细以内，但许多网页在运作上是＂产品列表页的图是直接抓取产品具体页的图＂，就会导致产品列表页的载入了解析度较高、容量较大的图片，特别产品列表页一般会有许多的图片，假如每一张图的巨细都是载入太大解析度的图，这会让全体速度体现很差。

怎样承认你的网页是否有这样的状况呢？你能够透过我的文章中介绍到的剖析东西来检测，或是透过下图的方法，在你的产品列表页的图片上按右键来敞开图片，看图片是否太大张。

这个问题的最佳处理方案，其实是透过图片紧缩套件来处理，当咱们把图片上传时，咱们网站会在后台紧缩好几张不同尺度巨细的图片，依据网站的需求来运用，举例来说，网站侧栏的板位较小，只需求200 x 200、产品列表页只需求400 x 400，就让紧缩程式来紧缩出不同尺度的图片。不管是Wordpress仍是自架网站都有相似的套件能够运用，但网站若要装置此类的套件，相同也是需求技能人员供给帮忙才能做。

移除未运用的JavaScript / 移除未运用的CSS

JavaScript以及CSS都是网页上的程式档案，假如Google Page Speed Insight针对你的网站跑出这项主张，代表东西侦测你的网页上有些程式档案是没有运用到的，这些程式档案等于既没有在运用、但运用者的阅读器却需求去载入这些程式档，天经地义的网站速度就会被连累。若看到这个项目还请跟技能人员承认一下，是否这些的确是用不到且能够移除去的程式档案。

这个项目是归于需求技能人员帮忙做批改/查看的项目。

扫除制止转译的资源这相同是需求技能人员供给帮忙的优化项目，文言一点来说，便是网页上有JavaScript/CSS 搅扰到了初次画面的制作，实务上咱们会主张推迟较不重要的JavaScript/CSS的履行时刻。

『扫除制止转译的资源』以及『移除未运用的JavaScript / 移除未运用的CSS』都算是对程式档案的清整以及大扫除。

启用gzip或相似的紧缩技能这是Google官方引荐的优化项目之一，透过gzip紧缩技能咱们能够有用的紧缩网站上的档案巨细（包含HTML、CSS、JavaScript），从而优化网站速度，也相同需求技能人员供给帮忙来帮你装置gzip。

Reduce initial server response time（下降主机回应时刻）假如你的速度检测陈述显现出这个项目Reduce initial server response time，代表你的主机回应时刻太慢，这时会需求从头清整主机的环境、或晋级主机的环境/硬体。

供给next-gen 格局的图片

Next-gen 其实指的是新代代（Next Generation）的意思，曩昔咱们运用的图片格局大多为JPG以及PNG 居多，但Google现在特别发起运用新代代的JPEG 2000、JPEG XR 、WebP这些图片格局，因为这些格局的图片档案容量更小、图片失真不严峻、关于全体速度体会更好。但因为现在并不是一切的阅读器都援助这些格局，所以这些格局还没有遍及，现在Google也还没有强制要咱们选用这样的格局，仅是在一个推行的阶段。

以我的网站来说，我是运用WebP的图片格局，而且透过判别式来进行优化（当运用者的阅读器援助时，网站就会供给WebP图片，若遇到运用者的阅读器不援助WebP时，我的网站就会改为供给PNG图片），因为大多版别的Chrome仍是援助WebP的，所以我最近决议选用了这个图片格局，在替换到WebP之后，均匀我的每一张图片的巨细缩小了60~70%左右。

关于速度优化，略微总结一下

Google判别网站排名的信号有许多，即使咱们把Google Page Speed 做到90分、保证网站速度的优化作业很的确，但毕竟网站速度仅仅搜索引擎演算法中的其间一环，尽管他的信号强度偏高，但也不要等待只做好网站速度优化，排名就能上升。从网站内容、关键字布局、反向连接…等许多信号都跟排名有关，网站速度仅仅其间一环。

一起，网站速度优化许多项目都是需求技能人员帮忙的，像是『扫除制止转译的资源』、『扫除制止转译的资源移除未运用的JavaScript / 移除未运用的CSS』都算是对程式档案进行清整、收拾、优化的作业，假如你是运用较难更动的架站渠道、或公司没有技能人员能够供给帮忙，那么就会很难进行下去。