PageSpeed Insights

当PageSpeed Insights检测到网页上的文字太小而难以辨认时，就会触发此规则。 概览 您可以使用以下四种常用单位来指定网页字体大小：像素(px)、点(pt)、EM(em)和百分比(%)。 像素即“CSS像素”，会因设备尺寸和密度而异。 点是相对于像素而定义的。一个像素是0.75点*。 EM和百分比是“相对”单位：这两个单位是相对于沿用已使用字体大小和属性而言的。1 EM相当于100%。 *请参见其他说明。 此外，视口会影响字体在移动设备上的缩放方式。未适当配置视口的网页会在移动设备上缩小显示，这通常会导致网页文字较小而难以辨认。 建议 ...

当PageSpeed Insights检测到某些点按目标（例如按钮、链接或表单字段）可能过小或距离过近，以致用户不方便在触摸屏上点按时，就会触发此规则。 概览 对于用户来说，如果链接或按钮太小或摆放太密集的话，要想在触摸屏上准确点按这些目标，会比使用传统鼠标光标更费力。为了让用户免去不慎按错位置的困扰，请为每个点按目标设置足够的大小，并让它们之间保持足够的距离，以免用户在点按任何目标时手指触碰到其他任何点按目标。成人的手指指腹平均宽约10毫米（不到半英寸），因此Android界面准则建议最小点按目标尺寸约为7毫米，或在移动视口正确设置的网站上，点按目标至少要达到48 CSS像素。 ...

当PageSpeed Insights检测到网页内容不适合在指定尺寸的视口内水平显示，而强制用户水平移动网页以查看所有内容时，就会触发此规则。 概览 在桌面设备和移动设备上，用户习惯于垂直（而非水平）滚动浏览网站，而强制用户水平滚动或缩小以查看完整网页会给用户带来很差的体验。 在使用元视口代码开发移动网站的过程中，您往往会在无意中创建并不适用于指定视口的网页内容。例如，如果在视口中显示大于视口宽度的图片，会迫使用户水平滚动该视口。您应调整此内容，使其符合视口的宽度。这样一来，用户就不用水平滚动视口了。 建议 ...

当PageSpeed Insights检测到您的网页未指定视口，或者指定的视口不适合不同设备时，就会触发此规则。 概览 视口可控制网页在移动设备上的显示方式。如果未指定视口，移动设备将以典型桌面屏幕的宽度来呈现网页，并调整网页使其适合屏幕大小。通过设置视口，您可以控制网页在不同设备上的宽度和缩放比例。 左图：未指定元视口的网页。 右图：指定了与设备宽度相匹配的视口的网页。 建议 经过优化可在移动设备上正常显示的网页应在文档标头中包含元视口，指定如下内容：width=device-width, initial-scale=1。 其他信息 术语： ...

当PageSpeed Insights检测到您正在使用同步版（而非异步版）脚本时，就会触发此规则。 概览 使用异步脚本意味着系统可以更快速地呈现您的网页，而不是强制用户等待脚本完成下载，然后才呈现网页。异步版脚本可实现后台下载。 虽然最初的大多数脚本是同步的，但较新版脚本均可实现异步加载。 建议 请确保您使用的是异步版脚本。以下热门脚本均支持加载异步脚本： BuySellAds (s3.buysellads.com/ac/bsa.js)：相关博文 - 默认情况下为异步脚本 ChartBeat...

当PageSpeed Insights检测到您的HTML引用了系统阻止的外部JavaScript文件（位于网页首屏部分）时，就会触发此规则。 概览 浏览器必须先解析网页，然后才能将其呈现给用户。如果浏览器在解析过程中遇到系统阻止的外部脚本，必须停止解析并且下载该JavaScript。每次遇到这种情况时，浏览器都会增加一个网络往返过程，这样就会导致首次呈现网页的时间延迟。 建议 建议您以内嵌方式处理呈现首屏区域所需的JavaScript，并让为网页添加其他功能所需的JavaScript延迟加载，直到首屏内容发送完毕为止。请注意，要通过这种方式缩短加载时间，您还必须优化CSS发送过程。 ...

当PageSpeed Insights检测到系统需要进行更多次的网络往返来呈现网页的首屏内容时，就会触发此规则。 概览 如果所需的数据量超出初始拥塞窗口的限制，系统就需要在服务器和用户浏览器之间进行更多次的往返。如果用户使用的是延迟时间较长的网络（例如，移动网络），该问题会严重延迟网页的加载。 建议 为提高网页加载速度，请限制呈现网页首屏内容所需的数据（HTML标记、图片、CSS和JavaScript）大小。为此，您可以尝试以下几种方法： 结构化HTML，以便首先加载关键的首屏内容 减少资源所用的数据量 结构化HTML，以便首先加载关键的首屏内容 ...

当PageSpeed Insights检测到网页包含阻止呈现的外部样式表（该样式表会延迟在屏幕上显示内容的时间）时，就会触发此规则。 概览 屏幕显示内容之前，浏览器会阻止外部CSS文件。这会导致额外的网络延迟，并延长屏幕显示内容的时间。 建议 如果外部CSS资源较小，您可以直接将这些内容插入到HTML文档中，这称为“内嵌”。通过这种方式内嵌较小CSS资源，浏览器可以继续呈现网页。请注意，如果CSS文件较大，完全内嵌CSS可能会导致PageSpeed...

当PageSpeed Insights检测到网页上的图片可通过优化来减小其尺寸，且不会显著影响其视觉效果时，就会触发此规则。 概览 尽量减小图片尺寸，以缩减用户等待资源加载的时间。适当地设置图片的格式并进行压缩可以节省大量的数据字节空间。这样可以为那些网络连接较慢的用户节约时间，还可以为有流量套餐限制的用户节省成本。 建议 您应对所有图片进行基本优化和高级优化。基本优化包括裁剪不必要的区域，将颜色深度降至可接受的最低水平，移除图片评论以及将图片保存为恰当的格式。您可以使用任意图片编辑程序（例如，GIMP）执行基本优化。高级优化包括对JPEG和PNG文件执行进一步的压缩（无损压缩）。...

当PageSpeed Insights检测到您的某个资源可通过缩减操作来减小其大小时，就会触发此规则。 概览 缩减资源大小是指删除不必要的字节（例如，多余的空格、换行符和缩进）。压缩HTML、CSS和JavaScript可提高下载、解析和执行的速度。此外，对于CSS和JavaScript，还可通过以下方式进一步缩小文件体积：在对HTML进行适当更新的过程中重命名变量名称，以确保选择器继续运行。 建议 您应缩减HTML、CSS和JavaScript的大小。 要缩减HTML的大小，您可以使用PageSpeed Insights...

当PageSpeed Insights检测到您的服务器响应不包含明确的缓存标头或某些资源被指定只缓存一小段时间时，就会触发此规则。 概览 如果用户会多次访问您的网站，那么静态资源的浏览器缓存可以节省用户的时间。缓存标头应当应用到所有可缓存的静态资源中，而不仅仅是应用到一小部分静态资源（例如，图片）中。可缓存的资源包括JS和CSS文件、图像文件及其他二进制对象文件（媒体文件和PDF文件等）。通常情况下，HTML不是静态资源，默认情况下不应被视为可缓存资源。您应考虑哪些缓存政策适用于您网站的HTML。 建议 ...

当PageSpeed Insights检测到您的服务器响应时间超过200毫秒时，就会触发此规则。 概览 服务器响应时间表示加载必要HTML以开始呈现服务器所托管网页的时间，其中减去了Google和服务器之间的网络延迟时间。每次运行所用的时间可能会有所不同，但这种差异不应太大。事实上，如果服务器响应时间变化很大的话，则表明性能上可能存在问题。 建议 ...

当PageSpeed Insights检测到网页上的压缩资源未与HTTP压缩一同提供时，就会触发此规则。 概览 许多网络服务器可以通过调用第三方模块或使用内置程序将文件压缩为gzip格式，然后再发送该压缩文件以供下载。这样可以在下载呈现网站所需的资源时，为您节省一些时间。 建议 您应在自己的网络服务器上启用压缩功能。以下这些参考展示了某些热门网络服务器上所启用的压缩功能： Apache：采用mod_deflate Nginx：采用HttpGzipModule IIS：配置HTTP压缩功能 常见问题解答 PageSpeed...

当PageSpeed Insights检测到您在指定网址转至最终目标网页的过程中使用了多个重定向时，就会触发此规则。 概览 由于重定向会触发额外的HTTP请求响应周期，并会额外延长往返时间延迟，因此，将应用发出的重定向数量降至最低至关重要。避免HTTP重定向可以缩减用户等待网页加载的时间。我们建议您仔细斟酌自己网站的设计，看看可以在哪些方面提升网站性能。 以下是重定向模式的一些优劣示例： 优质：example.com使用响应性网页设计，无需重定向 中等：example.com -> m.example.com/home 劣质：example.com ->...