Communitygithub.com

EshaRana17/网站审核

为创始人、自由职业者和小型企业提供网站和落地页审核服务。对转化率、文案重写、可访问性、性能及网站规划进行评分并提供可执行的修复建议。

网站审核 是什么?

该技能为小型企业网站和落地页提供全面审核,覆盖转化率优化、文案重写、可访问性检查(WCAG 2.2 AA)、性能审计(Core Web Vitals)以及从零开始的网站规划。它通过5秒测试、价值主张清晰度、视觉层级、CTA强度、社交证明、异议处理、表单摩擦等八个维度对转化率进行评分,并生成排名前十的修复列表。文案重写功能会捕捉品牌语调,从不同角度撰写标题选项,并将功能列表转化为利益点。可访问性检查涵盖文本对比度、替代文本、标题结构、表单标签、键盘导航等关键要素,并提供可复制粘贴的修复代码片段。性能审计检查LCP、INP、CLS等核心指标,并提供按优先级排序的优化清单。网站规划功能则从商业目标出发,生成站点地图、页面蓝图和启动清单。该技能适用于Claude Code等AI代理平台,使用时会根据用户请求动态加载对应的参考文件(如 conversion.md、accessibility.md 等),并运行辅助脚本 `page_audit.py` 分析用户提供的HTML文件。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add EshaRana17/claude-website-review-skill

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

网站审核 是做什么的?

一个实用的审核工具,专为小型企业网站和落地页设计。它提供基于证据的发现、评分和优先级排序的修复建议,非专业人士也能在本周内执行。

选择工作流程

阅读请求并选择一个或多个工作流程。如果用户只说“审核我的网站”,则运行工作流程1,并提供工作流程3和4作为后续选项。

用户询问的内容工作流程加载参考文件
"为什么转化率不高?"、审核、CRO、首页反馈1. 转化率审核references/conversion.md
重写标题、文案、CTA、要点2. 文案重写references/copywriting.md
可访问性、a11y、WCAG、屏幕阅读器、对比度3. 可访问性检查references/accessibility.md
网站慢、页面速度、Lighthouse、Core Web Vitals、头部信息4. 性能与技术检查references/performance.md
新网站、站点地图、“我需要哪些页面”5. 网站规划references/site-plan.md

仅加载所选工作流程所需的参考文件。

输入及其允许的检查项

根据用户提供的任何信息进行处理,并明确说明哪些内容无法检查。

  • URL:如果有可用的抓取或浏览器工具,请读取页面。如果没有,则请求截图、粘贴的文案或保存的HTML。切勿假装访问过页面。
  • 截图:适合检查信息层级、首屏内容、视觉对比度(仅估算)、CTA放置。无法验证替代文本、标签、标题或速度。
  • 粘贴的文案:适合检查信息和文案。无法判断布局或视觉效果。
  • HTML文件:适合检查结构和可访问性标记。在其上运行 scripts/page_audit.py(见下文)。无法测量真实速度。
  • Lighthouse 或 PageSpeed 报告(粘贴或导出):将其作为性能数字的真相来源。

在开始之前,收集(或推断并说明假设)以下信息:页面的目标受众、页面希望用户执行的单一主要操作、以及流量来源(广告、搜索、社交、推荐)。如果缺少信息,问一个简短的问题或陈述假设并继续。

基本规则

  1. 证据优先。 每项发现都必须引用页面上的观察结果(引用文案、命名元素、给出测量值)。不得提供没有实际页面依据的泛泛建议。
  2. 不捏造事实。 切勿虚构推荐语、评论、客户数量、统计数据、奖项、标志或保证。当缺少证据时,使用明确标记的占位符,如 [此处填写真实客户引语],并说明需要收集什么。
  3. 保持品牌语调。 重写内容应符合现有语气、阅读难度和词汇,除非用户要求新的语调。
  4. 按影响和努力程度排序。 网站所有者时间有限。对修复建议进行排序,而不是列举清单。
  5. 区分测量值与估算值。 将从截图中猜测的对比度问题或从标记中推断的速度问题标记为估算值。
  6. 精确引用标准。 使用参考文件中的事实(WCAG 2.2、Core Web Vitals 阈值)。如果用户引用了更新的标准,则以该标准为准,并说明建议基于哪个版本。
  7. 使用通俗语言。 专业术语首次出现时用几句话解释。

工作流程 1:落地页转化率审核

详细信息、评分标准和检查项:references/conversion.md。

步骤:

  1. 5秒测试。 仅根据首屏(如果可用,同时检查移动端和桌面端),回答:这是什么?给谁用的?我为什么要关心(结果或差异化因素)?我下一步该做什么?每个问题标记为通过/部分通过/不通过,并引用回答该问题的文本。
  2. 对八个维度进行评分(每个0-5分),使用参考文件中的评分标准:价值主张清晰度、视觉层级、CTA强度和位置、社交证明、异议处理、表单和结账摩擦、与流量来源的信息匹配度、信任和信誉信号。
  3. 列出问题,并附上证据、影响(高/中/低)和难度(快速/中等/困难)。
  4. 按影响优先排序,其次按努力程度,给出排名前十的修复建议(快速获胜的排得更前)。
  5. 针对前2或3个修复建议提出测试方案,如果网站有足够的流量(见参考文件中的流量说明);否则建议直接上线。

输出模板:

## 转化率审核:[页面名称]

**假设受众:** ... | **主要操作:** ... | **流量来源:** ...

### 5秒测试
| 问题 | 结果 | 证据 |
|---|---|---|
| 这是什么? | 通过/部分通过/不通过 | "引用的标题" |
| 给谁用的? | ... | ... |
| 为什么关心? | ... | ... |
| 下一步做什么? | ... | ... |

### 评分卡(总分 X / 40)
| 维度 | 得分 (0-5) | 一句话理由 |
|---|---|---|

### 排名前十的修复建议(按影响排序)
1. **[修复建议]** - 影响:高 | 难度:快速
   原因:... 证据:... 方法:...

### 已经做得很好的部分
- ...

### 未检查项
- ...(以及哪些输入可以检查它)

工作流程 2:文案重写

详细信息、公式和语调匹配方法:references/copywriting.md。

步骤:

  1. 捕捉语调。 注意语气(例如温暖、直接、技术、俏皮)、句子长度、人称(我们/你/我)、品牌使用和避免的词语。在重写前用两到三行描述这个语调概况。
  2. 找到核心信息。 客户、问题、结果、差异化因素、可用的证明。如果差异化因素不明确,则询问,或提供两种表述方式。
  3. 撰写标题选项(5个为默认值),每个使用不同的角度(结果、问题、受众号召、差异化因素、具体性)。为每个选项提供一行理由,并推荐一个。
  4. 撰写副标题,补充标题未提及的方法、受众或证明。
  5. 撰写CTA变体(3到5个):以动词为主导,具体说明下一步会发生什么,并在下方可选地添加降低风险的文字(例如“无需信用卡”),仅当对这家企业确实如此时才使用。
  6. 将功能列表重写为利益点:先写功能,然后是它对客户意味着什么。确保这些主张是用户可以支持的。
  7. 标记需要证明的主张,并列出需要收集的证据,而不是虚构。

输出:语调概况、标题表格(选项、角度、理由)、推荐选择、副标题、CTA列表、前后对比的功能列表、需要证明的列表。

绝不编写虚假的推荐语、评论数、评分、客户标志、“曾被报道于”字样或用户未提供的数字结果。

工作流程 3:可访问性检查(WCAG 2.2 AA 要点)

详细信息、标准列表和修复代码片段:references/accessibility.md。

WCAG 2.2 自2023年10月起成为W3C推荐标准(最新版本日期为2024年12月12日)。它移除了4.1.1解析规则,并增加了九项成功标准,其中六项为A级或AA级。此检查涵盖大多数小网站失败的要点;它不是完整的合规性审计,请在输出中明确说明。

步骤:

  1. 如果HTML可用,运行 scripts/page_audit.py 并将其输出作为证据。
  2. 按此顺序检查要点:文本对比度、非文本对比度、替代文本、标题和区域标记、表单标签和错误、键盘访问和可见焦点、焦点不被遮挡、目标大小、动态和动画、语言和页面标题、链接和按钮名称。
  3. 针对每个失败点给出:标准编号和名称、级别、出现位置、影响对象、以及可复制粘贴的修复代码片段。
  4. 推荐手动测试步骤:仅键盘操作走查、200%缩放和320 CSS像素宽度的回流测试、以及一个屏幕阅读器(NVDA、VoiceOver 或 TalkBack)。

输出:摘要(阻塞/严重/轻微数量)、发现表格、修复代码片段、手动测试清单、“未检查”列表。

工作流程 4:性能与基础知识检查

详细信息、阈值和测量指南:references/performance.md。

Core Web Vitals 包括 LCP(加载)、INP(响应性,2024年3月取代FID)和 CLS(视觉稳定性)。良好阈值(页面加载的第75百分位):LCP 2.5秒或更短,INP 200毫秒或更短,CLS 0.1或更小。

步骤:

  1. 询问用户是否有 PageSpeed Insights 或 Lighthouse 结果。现场数据(真实用户,来自 Chrome UX 报告)优于实验室数据;说明你拥有的是哪种数据。
  2. 如果没有测量数据,从标记或截图中推断可能的问题,并将其标记为需要验证的假设。
  3. 检查:LCP元素及其加载方式、图像格式和大小、字体加载、阻塞渲染的CSS和JS、第三方脚本、布局偏移来源、移动端视口和点击目标、缓存和压缩、HTTPS和安全头部信息。
  4. 输出一个按优先级排序的清单:P1(立即修复)、P2(本月内)、P3(锦上添花),每个都附有“如何测量”,明确指出具体的Lighthouse审计项或PageSpeed现场数据。

工作流程 5:从零开始的网站规划

详细信息、页面蓝图和文案大纲:references/site-plan.md。

步骤:

  1. 简报。 收集业务类型、地点或服务区域、主要客户、前3项服务或产品、主要转化目标(电话、预订、报价、购买、注册)、可用的证明、品牌语调、内容预算。以一个分组问题询问缺失的信息,或者基于已声明的假设继续。
  2. 站点地图。 从最精简开始(通常5到8页)。通过每个页面回答的客户问题或它可以排名的搜索词来证明每个页面的必要性。
  3. 逐页规划。 针对每个页面:目的、主要CTA、各部分顺序、文案大纲(标题方向加关键点)、要放置的证明、内部链接。
  4. 启动清单。 技术、可访问性、分析和法律基础。
  5. 所有者的内容待办清单(需要收集的照片、引语、数字)。

输出:简报回顾、站点地图树、页面规划、启动清单、内容待办。

辅助脚本:page_audit.py

scripts/page_audit.py 是一个仅使用标准库的Python 3脚本。它读取一个本地HTML文件,绝不访问网络。当用户提供HTML(保存的页面、导出或源代码)时使用它。

python scripts/page_audit.py path/to/page.html            # 可读报告
python scripts/page_audit.py path/to/page.html --json     # 机器可读

它报告:缺少 lang、视口meta、标题和meta描述;没有 alt 或 width/height 的图像;没有可访问标签的表单字段;标题顺序问题(跳级、缺失或多个 h1);外部脚本的数量及其主机;类似CTA的按钮和链接。

退出码:0表示未发现任何问题,1表示发现问题,2表示使用错误或文件错误。将其发现仅视为标记证据:它无法看到CSS、对比度、JavaScript渲染的内容或真实性能。一个可尝试的示例文件位于 assets/sample.html。

如果用户只提供一个URL,不要使用脚本下载页面。请用户保存页面(浏览器“另存为”,仅HTML)或粘贴源代码。

组合工作流程

对于“完整审核”,依次运行工作流程1、然后以简短形式运行3和4(仅列出最重要的发现),最后生成一个合并的优先级列表,不超过10个项目,以便网站所有者只有一个计划,而不是三个。

回复前的质量检查清单

  • 每个分数和发现都有来自页面的证据。
  • 没有虚构的证明、数字或引语。
  • 修复建议已排序,每个都有影响和难度说明。
  • 标准按编号和版本引用(如适用)。
  • “未检查”部分诚实说明了输入的局限性。
  • 重写内容与已声明的语调概况一致。

相关技能