页面具备完整的摘要描述 (Meta Description)
优质的元描述会在搜索结果中作为摘要卡片展示,直接决定潜在搜索用户的点击率与停留预期。
超链接具备明确具体的描述性锚文本
1 link found链接锚文本是搜索引擎判断目标页面主题的核心依据,应避免使用“点击这里”、“更多”等模糊泛化词汇。
页面未配置 noindex 标签且 robots.txt 未拦截爬虫,保证搜索引擎可顺畅抓取页面并建立全量索引。
<title> 标签是搜索引擎识别网页主题和评估核心权重的最关键信号,也是搜索结果第一展现行。
确保网页响应 HTTP 200 成功状态。4xx 客户端错误或 5xx 服务器故障会导致搜索引擎降权或移出索引库。
超链接具备标准的 href 目标网址,未采用阻断爬虫的 JavaScript 伪协议,确保整站权重有效流通。
为面向出海和跨国访客的站点向搜索引擎明确各语言/国家版本页面对应关系,避免国际化内容被判重复。
结构化数据可让网页在搜索结果中展现评分、价格、产品参数、面包屑等富媒体卡片 (Rich Snippets)。
标记浏览器呈现第一段 DOM 内容的时间,是衡量首屏速度的首要信号。
阻塞首屏渲染的请求会延迟 LCP,建议异步加载或内联关键资源。
避免发生多次页面链式重定向 (301 / 302)
每次重定向都会引入一次额外的网络往返延迟,建议超链接直达最终目标网址。
为 img 标签设置 width/height 可预留渲染空间,减少布局偏移和 CLS。
分散或精简主线程重度计算,提高页面在用户滚动或交互时的帧率稳定性。
控制页面网络总传输体积在合理范围内
Total size was 1 KiB建议单页面总下载体积控制在 2MB~3MB 以内,兼顾移动网络和低速网络访问。
按需拆包并减少未使用的 JavaScript 脚本
按需分包加载业务脚本,避免首屏强行下载后续页面才用到的非核心冗余脚本。
清理首屏未使用的无用样式声明,减少浏览器主线程渲染计算与样式重排负担。
通过精简变量名与删除多余字符减少脚本体积,加快下载并降低浏览器脚本编译解析开销。
去除样式表中的多余空格、换行和开发注释,缩减网络传输体积加快首屏下载。
最大潜在首次输入延迟 (Max Potential FID)
20 ms估算最坏情况下用户首次交互的响应延迟,是 INP 出现前的历史核心指标。
视口设置不当会导致移动端点击交互错位,应正确配置 viewport。
第三方脚本可能显著拖慢加载,应评估并优先加载页面核心内容。
缩短依赖链长度、减小资源体积或延迟非关键资源下载,以提升页面加载速度。
标记页面主要内容完全加载的时间,是核心 Web 体验指标之一。
现代浏览器已原生支持多数新特性,避免为旧浏览器打包过多 polyfill。
缩短图片下载时间可提升页面感知加载速度和 LCP 表现。
JavaScript 在修改 DOM 样式后立刻读取几何属性会触发强制回流,严重影响性能。
建议将 font-display 设为 swap 或 optional,确保字体加载期间文字始终可见。
移除打包中重复的大体积 JS 模块,减少不必要的网络传输与解析开销。
过大的 DOM 会延长样式计算与布局回流时间,增加内存占用,影响页面响应速度。
首个网络请求最关键,应避免重定向、提升服务器响应速度并启用文本压缩。
列出未由用户交互触发的布局偏移及其根因,如元素增删、字体变化等。
为静态资源设置长期缓存,可显著加快老用户重复访问时的加载速度。
反映页面内容可见填充的速度,数值越低首屏呈现越快。
衡量页面生命周期内发生的意外布局移动,偏移越小视觉越稳定。
FCP 到可交互之间阻止输入响应的总毫秒数,反映主线程繁忙程度。
缩短服务器初始首字节响应时间 (TTFB)
Root document took 0 ms优化后端 PHP/数据库查询或开启服务端页面级缓存,建议首字节响应时间控制在 500ms 以内。
主内容区使用 <main> 地标,便于屏幕阅读器快速跳转。
避免在 body 上设置 aria-hidden=true
在 document body 上设置 aria-hidden=true 会导致辅助技术无法访问整个页面内容。
链接、按钮等交互控件应清晰可辨,并正确反馈状态,避免与非交互元素混淆。
自定义交互控件应通过 aria-label 或 aria-labelledby 提供可访问名称。
对屏幕外内容使用 display:none 或 aria-hidden=true,避免屏幕阅读器读出不可见内容。
合理使用 <main>、<nav> 等语义地标元素,帮助辅助技术快速定位页面结构。
当对话框等动态内容插入页面时,应将焦点移至新内容,方便辅助技术用户感知。
用户应能自由 Tab 进入和离开任何控件或区域,不会被意外困住。
DOM 顺序与视觉阅读顺序保持一致,提升辅助技术用户的导航体验。
Tab 键遍历顺序应与视觉布局一致,且不应聚焦到屏幕外元素。
自定义交互控件应支持键盘 Tab 聚焦并显示清晰焦点样式。
确保文字与背景颜色反差足够高(不低于 4.5:1),保证各类光线环境下均清晰易读。
可点击区域应具备足够大小与间距,方便运动障碍用户准确触发。
避免设置 user-scalable=no,保障各类访客群体自主放大阅读。
避免空链接或纯图标无文字说明的超链接,保障阅读流畅性。
应使用符合 BCP 47 标准的语言代码,帮助屏幕阅读器正确发音。
HTML 根元素配置了有效语言代码 (lang 属性)
向搜索引擎与翻译工具准确声明当前文档所用主语言(如 zh-CN)。
标题应按层级顺序使用,禁止跳级,帮助辅助技术理解页面结构。
<title> 标签是搜索引擎识别网页主题和评估核心权重的最关键信号,也是搜索结果第一展现行。
自定义交互控件应使用合适的 ARIA 角色,确保辅助技术理解其用途。
通过 <meta charset> 声明编码,防止文字乱码与安全风险。
HTTPS 证书确保访客与网站间的数据传输不被窃听篡改,是搜索引擎排名和信任度的基础。
在用户明确产生互动操作(如点击查找附近)时再按需请求权限,提升访客信任感。
使用 aspect-ratio 或 width/height 预留空间,防止加载时页面跳动。
图片自然尺寸应与显示尺寸和像素比相匹配,避免模糊或过度下载。
标准 doctype 触发标准渲染模式,避免怪异模式下的布局差异。
第三方 Cookie 在部分浏览器或隐私模式下可能被阻止,应避免关键功能依赖。
浏览器控制台无未经捕获的 JavaScript 错误
控制台报错代表前端代码存在逻辑缺陷,可能影响页面功能交互或埋点数据采集。
提供有效的 JavaScript 源映射 (Source Map)
为压缩后的 JS 提供 source map,便于排查问题与定位性能瓶颈。
Chromium 内核在审计中标记的同源策略、Cookie、混合内容等警告。