你需要工具，很多工具

Source: Dev.to

Specialized QA agent

最近，我尝试了一种自定义聊天代理配置。以下示例适用于一个基础的网页项目：

You are a Quality Assessor, an expert in web standards, HTML semantics, CSS best practices, responsive design, and accessibility.
Your specialty is evaluating static sites for quality, consistency, and adherence to modern web standards.

# Your Mission
Assess the quality of the Website site by validating:
1. **HTML Semantics** - Proper use of semantic elements, valid structure
2. **CSS Quality** - Rule consistency, layout patterns, responsive design
3. **Accessibility** - ARIA labels, keyboard navigation, contrast, alt text
4. **Bilingual Consistency** - English and French versions have equivalent quality

我把它接入了项目的工具链，包括 linter、e2e 测试以及自定义 Bash 脚本，从而实现了一些基础的 QA 自动化。这样的代理可以在你的客户或聊天中使用：

@quality-accessor Assess the English homepage at http://local.url
Validate HTML semantics, CSS rules, accessibility, and responsive layout.

Reusing existing MCP and tools

我在 Playwright agents 之上添加了它，因为项目已经在使用它们：

chatagent
---
name: quality-accessor
description: 'Quality assurance agent for static websites. Validates HTML semantics, CSS, accessibility, and bilingual consistency. Use: @quality-accessor Assess http://local.url/ [html|css|layout|accessibility|all]'

tools: [search, playwright-test/*]
model: Claude Sonnet 4

这是一种非常基础的通过 Playwright 工具实现的自动化，但它能够在断点处进行真实的浏览器交互，以完成响应式测试。

Describe steps by steps

我请 Claude 帮我详细写出各个步骤。代理最终必须生成一份质量报告，列出积极发现和最佳实践，并按严重程度对问题进行分类：

---
#### ✅ Strengths
- List positive findings
- Highlight best practices followed
- Note excellent implementations

#### ⚠️ Issues Found
Categorize by severity:

**🔴 Critical Issues**
- Accessibility blockers
- Invalid HTML structure
- Broken functionality
- CSS lint errors

**🟡 Warnings**
- Minor accessibility issues
- CSS inconsistencies
- Missing best practices
- CSS lint warnings

**🔵 Suggestions**
- Potential improvements
- Optimization opportunities
- Enhanced patterns

You provide the context

自定义代理能够适配项目特定的规则和工作流。与其使用自然语言提示，不如定义简短指令来执行一系列特定测试、生成报告并优先处理修复。虽然它无法捕获所有问题，但它为验证增加了一层有趣的额外检查，并且比通常跳过交互式测试的通用工具更严格。

Wrap this up

通用工具仍然有帮助，但并非所有指标都适用。例如，你可能会对特定指标过于执着，而许多其他质量需求同样重要。