Front-End Checklist 深度解析 about-page 技能用 SEO 规则建立网站信任信号的完整方法【免费下载链接】Front-End-Checklist The essential checklist for modern web development, for humans and AI agents项目地址: https://gitcode.com/gh_mirrors/fr/Front-End-Checklistskills/about-page是 Front-End Checklist 中面向 SEO 审计的一条规则技能核心目标是确保网站拥有一个内容充实的独立 About 页面以支撑 E-E-A-T经验、专业性、权威性、可信度信任信号。本篇以 SKILL.md 及其 完整规则参考 为主体结合其源规则文件与生成脚本讲清这条规则的检查标准、修复方式、验证手段以及它在本仓库中从 MDX 到可安装技能的完整生产线。一、规则定位frontmatter 元数据解读每个技能目录由 frontmatter 声明其元数据about-page技能的头部声明如下见 SKILL.md--- name: about-page description: Use when auditing metadata, crawlability, structured data, or indexability related to Create a dedicated About page. Verify the rendered HTML and HTTP response rather than relying only on source files. metadata: category: seo priority: medium difficulty: intermediate estimatedTime: 10 source: frontendchecklist.io ---这些字段并非手写的孤立信息而是从源规则 packages/content/rules/en/seo/about-page.mdx 的 frontmatter 自动派生而来。对照源文件可以看到完整的元数据定义字段值含义titleCreate a dedicated About page规则标题categories/subcategoryseo / content归属 SEO 大类下的内容子类prioritymedium中等优先级非阻断性问题difficultyintermediate实施难度为中级estimatedTime10分钟预计修复耗时sourcesGoogle Search Central: Search Essentials、Google Search Central documentation规则依据的两个一手权威来源均以authority: primary标注resourcesGoogle Search Console可用于验证的工具relatedRulescontact-page、editorial-policy、author-byline、affiliate-disclosure常一起审查的关联规则源文件中的prompts与aiContext字段则分别成为 SKILL.md 的四个执行指令段落与 descriptionaiContext优先于description使用这一点可以直接在生成脚本 scripts/generate/generate-skills.ts 的buildSkillMd函数中得到印证脚本会读取fm.aiContext || fm.description并强制 description 以 Use when 开头不足 50 字符时自动追加标题补全——这是技能能被 agent 意图匹配系统正确路由的关键约定。二、核心要求Quick Reference 与信任信号四支柱规则正文同时出现在 references/rule.md 与源 MDX开宗明义An About page provides essential context about the source of the information on your website. It helps search engines and users understand the expertise and authority behind the content.快速参考清单Quick Reference给出三条硬性检查点包含一个专门页面解释网站的目的、历史与使命purpose, history, and mission介绍内容背后的关键人物或组织建立信任提供清晰的专家资质证据evidence of expertise和联系信息规则进一步在 Why It Matters 一节给出四条为什么重要的依据E-E-A-T直接支撑 Google 质量评估指南中 Trustworthiness可信度与 Authoritativeness权威性两大支柱Transparency向用户表明你是谁降低跳出率并建立长期品牌忠诚Entity Recognition帮助搜索引擎把网站与真实世界实体个人或组织关联起来Compliance对许多行业而言标明内容创建者是法律或监管要求。三、Check / Fix / Explain / Code Review四段式审计工作流SKILL.md 的主体是由源 MDXprompts字段派生的四段指令定义了 agent 执行这条规则的标准动作Check —— 检查什么Verify that the website has a dedicated About page that clearly identifies the people or organization responsible for the content.检查重点是是否存在独立 About 页且页面是否明确点出对内容负责的人或组织。注意 frontmatter 中aiContext的强调应验证渲染后的 HTML 与 HTTP 响应而不是只依赖源文件——因为静态源码里写好了路由不等于线上页面真实可达、可被索引。Fix —— 怎么修Create a new page at/aboutand add detailed information about your organization, mission, and the experts behind your content.修复动作明确在/about路径下新建页面写入关于组织、使命与内容背后专家的详细信息。Explain —— 向用户解释什么Explain how an About page contributes to E-E-A-T (Experience, Expertise, Authoritativeness, and Trustworthiness) and why its a critical SEO factor.要求把修复的意义落到 E-E-A-T 框架上解释而非泛泛谈 SEO。Code Review —— 代码审查范围Review metadata generation, rendered HTML, structured data, and response headers related to Create a dedicated About page. Flag exact routes or templates where search-facing output violates the rule, and describe how to verify the final page output.代码审查边界覆盖四个层面元数据生成、渲染 HTML、结构化数据与响应头并明确要求指出违反规则的具体路由或模板、说明如何验证最终页面输出——这与本仓库全局审计技能的保守立场宁可少报、只报有直接证据的问题一脉相承可参考 skills/frontend-checklist-global/SKILL.md 中的 Audit Stance 章节。四、代码示例让 About 页面可被发现规则强调一个常被忽略的细节About 页面本身存在还不够它必须易于被发现通常通过主导航或页脚链接实现。源 MDX 给出的标准 HTML 示例见 about-page.mdxfooter nav aria-labelFooter Navigation ul lia href/aboutAbout Us/a/li lia href/contactContact/a/li lia href/privacy-policyPrivacy Policy/a/li /ul /nav /footer示例中的细节值得注意nav携带aria-labelFooter Navigation提供导航地标语义列表结构与页脚中常见的 About / Contact / Privacy Policy 三件套并列。这实际上与可访问性规则中 landmark 导航的要求相互呼应——About 页链接的可发现性本身就是一条 HTML 结构检查。五、Exceptions判断边界避免误报规则文档专门列出三条例外情形这对 agent 执行审查时的尺度把握非常重要必要的工具页或合规页可以有意的简短——不应以排名导向内容的编辑深度标准来要求它们。换句话说About 页的充实要求不应被套用到隐私政策等功能性页面头上AI 辅助撰写本身不构成失败——真正该被标记的是无依据的声明、缺失的编辑审查或低原创度输出先可排名再谈质量当一个页面同时存在信任信号问题与抓取/索引问题时应先把页面变成可被排名eligible to rank再改进内容质量信号。六、Standards 与 Verification如何确认规则已满足判定标准以参考来源作为最终面向搜索的 HTML、元数据与抓取行为的标准在认定规则满足之前需对照 Google Search Central 的 Search Essentials 与 Google Search Central 文档逐项核对对应源 MDXsources中role: search与role: implementation的两个一手来源。自动化检查Automated Checks检查渲染后的 HTML 与 HTTP 头确认预期的元数据或可抓取性信号存在在适用时用 Google Search Console 或同类工具测试受影响 URL部署后对代表性页面集合重新抓取re-crawl。人工检查Manual Checks确认改动没有引入相互冲突的 canonical-url、robots 或结构化数据信号——例如新建的/about页不应被 noindex、不应有指向别处的 canonical也不应携带与页面内容矛盾的 JSON-LD。七、仓库工程视角这个技能是如何生成的理解skills/about-page的生产机制能解释为什么它的结构与全仓库 380 余条规则技能完全一致。关键调用链如下唯一事实源规则内容以 MDX 形式存放在 packages/content/rules/en/seo/about-page.mdxskills/about-page/下两个文件全部由它派生生成脚本scripts/generate/generate-skills.ts 用 gray-matter 解析 frontmatterbuildSkillMd组装 SKILL.mdfrontmatter 标题 Quick Reference 四段 prompt 指向 references 的指引buildReferencesMd则把 MDX 正文经stripMdxToMarkdown去除 JSX 后生成references/rule.md见 buildReferencesMd 实现。脚本采用扁平目录skills/{skillName}/以通过 skill-check 的name_matches_directory校验若同一 slug 跨类别重名会自动加类别前缀findDuplicateSlugs 逻辑提交时自动再生成lefthook.yml 配置了generate-skills钩子——凡packages/content/rules/en/**/*.mdx有改动pre-commit 即执行pnpm tsx scripts/generate/generate-skills.ts {staged_files} git add skills/增量重建并同步触发validate-rule-structure、validate-evidence、score-rules等质量门禁全量重建在仓库根目录执行pnpm generate:skills可重生成全部技能README.md 的贡献流程与 scripts/README.md 的脚本清单均有说明。因此若你只读仓库、想追溯某条技能文本的出处路径是固定的skills/{slug}/SKILL.md→ 源 MDX frontmatterskills/{slug}/references/rule.md→ 源 MDX 正文。八、实际使用安装与调用方式在支持 agent skills 的工具中安装本技能README.md 的 Use with skills 一节给出了标准用法# 安装全部技能 npx skills add frontendchecklist/skills # 只安装 about-page 这一条规则技能 npx skills add frontendchecklist/skills --skill about-page安装后当 agent 面对审计某个站点的元数据、可抓取性或索引性类请求时会因 description 的 Use when auditing metadata, crawlability, structured data, or indexability... 前缀被路由到本技能并按 Check → Fix → Explain → Code Review 四段指令执行。执行要点重申一遍以渲染后的页面为证据而不是只看源码。九、关联规则信任信号审计的完整拼图源 MDX 的relatedRules字段声明了四条同属seo/content区域、常一起审查的规则它们与 about-page 共同构成网站可信度检查面contact-page独立的联系页面与 About 页同为信任与可达性信号editorial-policy编辑政策声明支撑内容生产流程的可信度author-byline作者署名把内容责任落到具体的人affiliate-disclosure联盟营销披露属于合规层面的透明度要求。实践中建议按先可达、再可信、后详尽的顺序处理先确认 About 页路由真实存在且未被 canonical/robots 信号排斥再补齐组织信息、专家资质与联系方式最后与其他信任信号规则一起统一审查即可完整覆盖这条规则的验收标准。【免费下载链接】Front-End-Checklist The essential checklist for modern web development, for humans and AI agents项目地址: https://gitcode.com/gh_mirrors/fr/Front-End-Checklist创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考