页面速度：定义、检查与改进方法
页面速度衡量网页加载的快慢。本文将说明如何检查并改进页面速度。
什么是页面速度？
页面速度（有时也称“加载速度”）衡量一个网页内容加载的快慢。
页面速度并非单一指标。
页面是分阶段加载的，因此页面速度是多个测量指标的统称，例如：
首字节时间（TTFB）：页面开始加载所需的时间
首次内容绘制（FCP）：用户看到页面第一个元素（例如一张图片）所需的时间
首次输入延迟（FID）：你的网站响应用户输入（例如一次按钮点击）所需的时间
加载完成时间（Onload time）：完整加载页面内容所需的时间
有时用户一开始看到的是空白页面，随后一些元素陆续加载，最后整个页面加载完成。
页面速度指标衡量上述每个事件，显示页面加载的快慢，并与 Google 的阈值 相比较。
继续阅读，了解页面速度为何对 SEO 重要，以及如何改进。
页面速度为何对 SEO 重要？
页面加载速度之所以对 SEO 重要，是因为它是已确认的排名因素，在桌面端和移动端均是如此。
Google 已明确表示，极其缓慢的页面不太可能获得良好排名。
Google 关注页面速度，因为缓慢的网站会带来糟糕的用户体验（UX）。
加载时间超过三秒的页面，用户更可能跳出（离开页面）。
因此，Google 建议页面在关键页面速度指标上达到“良好”阈值。
如何检查页面加载时间
以下为两个检查页面加载时间的最佳工具及其用法。
PageSpeed Insights
Google 的 PageSpeed Insights 是一款免费工具，用于衡量网页表现。
使用 PageSpeed Insights 可以：
检查你的页面加载时间
获取表现数据
获取改进页面的建议
衡量核心网页指标（即三项关键 UX 指标）
使用 Google PageSpeed Insights 工具的方法如下：
打开PageSpeed Insights
在搜索栏中输入页面 URL
点击“分析（Analyze）”
在报告顶部切换“移动端（Mobile）”和“桌面端（Desktop）”指标。
其下方是对该页面核心网页指标表现的总体评估：“通过（Passed）”或“未通过（Failed）”。
还会看到核心网页指标及其他页面速度指标的明细，以及详细的页面速度诊断与建议。
Semrush 网站审计
Semrush 网站审计（Site Audit）会检查所有页面的页面速度与网络表现，而非像 PageSpeed Insights 那样只检查单个页面。
网站审计会执行 140 多项站内与技术 SEO 检查。
要检查页面速度，打开该工具并输入域名，点击“开始审计（Start Audit）”。
配置审计设置，再点击“开始网站审计（Start Site Audit）”。
要检查加载速度、表现问题等，点击“站点表现（Site Performance）”下的“查看详情（View details）”。
要查看页面加载的快慢（以秒为单位），请查看“页面（HTML）加载速度”与“平均页面（HTML）加载速度”。
还会看到一份“表现问题（Performance Issues）”列表。先修复“错误（Errors）”，再处理“警告（Warnings）”。
改进页面速度 SEO 的 8 种方法
用页面速度工具检测页面或网站时，会看到许多建议。以下方法有助于加快页面速度。
1. 选择合适的图片格式
选择合适的图片格式是优化页面速度的可靠方法。
不同图片格式会产生不同的文件大小，有些格式压缩率更高。
常见格式包括：
JPEG：适合真实场景图片（照片）
PNG：适合截图、设计稿、Logo 或需要更多细节的图片
GIF：加载较慢。动态图片可考虑把 GIF 转成视频。
WebP：比 JPEG 和 PNG 更轻量（可小至三分之一）。不过，有些浏览器尚不支持 WebP。
2. 压缩你的图片
压缩图片以改善加载时间。大图会拖慢页面，并影响 SEO。
在不影响图片质量的前提下，尽量把图片文件大小压到最小。
可使用免费的图片缩放工具调整图片尺寸来实现这一点。
只需把图片上传到该工具（如 PicResize），再选择想缩小多少（例如缩小 50%）。
再用 ImageOptim 这类工具进一步优化图片。
始终在把图片上传到网站之前完成这一步。
3. 启用浏览器缓存
启用浏览器缓存可让网页数据临时存储在用户浏览器中。
浏览器缓存意味着回访用户能看到更快的加载速度，因为需要加载的元素更少（如图片与 CSS 文件）。
对于 WordPress 网站，W3 Total Cache 或 WP Rocket 这类插件可启用浏览器缓存。
4. 精简 JavaScript、CSS 和 HTML
精简（Minify）JavaScript、CSS 与 HTML 可减小文件大小，从而改善页面速度。
精简会移除不必要的代码元素（如换行与空白字符），让计算机更快读取代码。
例如，以下是一段未精简的 CSS 代码示例：
以下是同一段 CSS 代码精简后的样子：
如何判断代码是否需要精简？
使用网站审计，它会标记出含未精简 JavaScript 与 CSS 的页面。
要找出需要精简的页面，在网站审计报告中点击“问题（Issues）”，再点击相关问题，获取受影响的完整页面列表。
再用在线精简工具或 WP Rocket 这类 WordPress 插件精简受影响的代码。
5. 使用内容分发网络
使用内容分发网络（CDN）可缩短用户的页面加载时间。
CDN 是分布在世界各地的服务器系统。
CDN 通过从离用户物理位置更近的服务器加载网站缓存版本，让网站“更接近”用户。
例如，若把网站缓存在 CDN 上，位于澳大利亚的用户将从本地服务器而非洛杉矶服务器收到网站。
这会缩短加载时间。
CDN 服务商包括 Cloudflare 与 Jetpack。
6. 改善你的服务器响应时间
改善服务器响应时间以缩短加载耗时。
当用户请求一个页面时，浏览器会发出请求，服务器接收请求并获取所请求的文件。服务器响应时间慢会导致页面加载缓慢。
如何改善网站的服务器响应时间？
可考虑把主机方案升级到更快的选项，例如虚拟专用服务器（VPS）比共享主机更快。
其他可尝试的做法：
优化服务器的应用逻辑与配置
为数据库表建立索引，或升级你的数据库系统
增加随机存取存储器（RAM）与处理能力
可咨询主机服务商或开发者来协助实施这些步骤。
7. 减少重定向
减少重定向可移除额外的加载步骤，从而改善页面速度。
重定向发生在用户点击一个 URL 却被自动转到另一个 URL 时，例如转到一篇博客文章的更新版本。
重定向对 SEO 与用户体验都有用。
把网络流量从陈旧或过时的页面重定向到相关的新页面，能保住搜索表现，并避免出现失效页面与 404 错误响应。
然而，有时会出现重定向链（即一个页面对用户多次重定向）。
每次重定向都会为页面加载增加一个额外步骤，从而拖慢页面速度。这意味着移除不必要的重定向可提升页面速度。
使用网站审计工具找出不必要的重定向。
打开“问题”标签页，在搜索栏输入“redirect”。
你会看到一份与重定向相关的“错误”“警告”与“提示”列表，包括：
重定向链与重定向循环
临时重定向
永久重定向
查看所有已识别的重定向链、循环与不必要的重定向。点击每个问题中的链接，查看受影响页面列表。
报告会显示每个页面的重定向类型与重定向次数：
把原始 URL 直接重定向到最终 URL，即可移除多余的重定向。
8. 减少 HTTP 请求
HTTP 请求发生在网络浏览器向网站服务器发送“请求”以获取更多信息时。
用户访问页面时，服务器会收到来自浏览器的请求，并以一个包含文本、图片或多媒体的文件作为响应。在请求完成之前，用户无法查看该文件。
若该文件不包含查看页面所需的全部信息，浏览器会再发送一个请求。每个额外请求都会拖慢页面速度，让用户更久才能看到完整页面。
减少或加快 HTTP 请求以改善页面速度。
要查看一个页面的 HTTP 请求数量，请使用 Google Chrome。在 Chrome 中打开页面，在任意位置右键单击，选择“检查（Inspect）”。
会打开 Chrome DevTools 窗口，点击“网络（Network）”标签页。
重新加载页面，即可看到所有 HTTP 请求（包括对图片、插件、JavaScript 或 CSS 文件的请求），以及每个文件的文件大小与加载耗时。
左下角还会显示总请求数。
降低 HTTP 请求数量应能改善页面速度。
没有具体的目标数值，但可作参考：HTTP 请求数的中位数在桌面端为 76，移动端为 70。
优化技术 SEO
页面速度是技术 SEO 的关键组成部分，既影响搜索排名，也影响用户体验。
要评估网站的技术健康状况（包括页面速度），请使用 SEO 审计工具，它提供详细分析并推荐改进表现的步骤。
不妨通过一次免费的网站审计开始优化网站，迈出通往更高排名与更满意用户的第一步。