技能 web-design-guidelines
📦
web-design-guidelines
v1.0.0 内容修订 r1 中风险 ⚙️ 外部命令🌐 网络访问
根据设计指南审查 Web 界面
团队在发布前需要一致的 UI、可访问性和 UX 检查。此技能会将 Web Interface Guidelines 应用于所选文件，并报告简洁的问题发现。
支持: Claude Codex Code(CC)
使用我的智能体安装
将此请求复制给你的智能体，其中包含权威 Skill 页面和清单。
智能体请求
Review the Skillstore skill "web-design-guidelines" from https://skillstore.io/skills/zhanlincui-web-design-guidelines.md and its manifest at https://skillstore.io/api/skills/zhanlincui-web-design-guidelines/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.你的智能体仍应展示其计划，并按安全策略请求必要确认。
Agent 可读资源
当 AI Agent、爬虫或脚本需要干净上下文，而不是读取完整页面时，请使用这些链接。
测试它
正在使用“web-design-guidelines”。 审查定价页面中的指南问题。
预期结果:
- app/pricing/page.tsx:58 - 主要操作和次要操作在视觉上同等突出。请明确主要路径。
- app/pricing/page.tsx:91 - 功能对比仅使用颜色表达状态。请为状态添加文本标签。
正在使用“web-design-guidelines”。 审计组件库的交互质量。
预期结果:
- components/Dialog.tsx:34 - 未描述焦点处理。请验证键盘进入、escape 和焦点返回行为。
- components/Card.tsx:76 - 仅在 hover 时显示的细节可能会让触屏用户看不到信息。
安全审计
中风险v5 • 2026/7/8 打开版本化报告
The markdown backtick detections are false positives: they are inline formatting and a fenced URL block. The hardcoded WebFetch URL is confirmed as a low network risk, and the larger concern is reliance on mutable remote content as instructions.
1
已扫描文件
40
分析行数
1
复核项
0
已忽略误报
已确认安全问题 (1)
中
Remote Instruction Supply Chain
SKILL.md directs the agent to fetch remote guidelines and says the fetched content contains all rules and output format instructions. Treating mutable network content as instructions can change skill behavior after marketplace review.
The file explicitly requires fetching the URL and following rules from fetched content; the risk depends on future remote content but the delegation pattern is clear.
能力复核项 (1)
这些是真实的本地能力，对此技能可能是预期行为，因此需要复核，但不会按已确认恶意行为计分。
低
Hardcoded URL
https://raw.githubusercontent.com/vercel-labs/web-interface-guidelines/main/command.md
The skill instructs the agent to fetch a hardcoded raw GitHub URL before reviews. This intended network dependency can pull changed remote content and should be disclosed and controlled.
风险因素
⚙️ 外部命令 (2)
🌐 网络访问 (1)
审计者: codex 查看审计历史 →
分享与引用此报告
分享版本化评估报告、中性徽章、嵌入卡片和引用。Skillstore 只报告证据，不判断该 Skill 是否安全。
复制报告链接
https://skillstore.io/skills/zhanlincui-web-design-guidelines/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown 徽章
[](https://skillstore.io/skills/zhanlincui-web-design-guidelines?utm_source=security_passport_badge)HTML 徽章
<a href="https://skillstore.io/skills/zhanlincui-web-design-guidelines?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/zhanlincui-web-design-guidelines/security.svg" alt="Skillstore security assessment" loading="lazy"></a>嵌入卡片
<iframe src="https://skillstore.io/embed/skills/zhanlincui-web-design-guidelines.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>学术引用 (APA · BibTeX · CFF)
APA 引用
ZhanlinCui. (2026). web-design-guidelines security audit report (audit version 5) [Author version 1.0.0]. Skillstore. https://skillstore.io/skills/zhanlincui-web-design-guidelines/audits/5BibTeX 引用
@techreport{zhanlincui-zhanlincui-web-design-guidelines-2026,
author = {ZhanlinCui},
title = {web-design-guidelines security audit report (audit version 5)},
institution = {Skillstore},
year = {2026},
number = {5},
url = {https://skillstore.io/skills/zhanlincui-web-design-guidelines/audits/5},
note = {Author version 1.0.0}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "web-design-guidelines security audit report (audit version 5)"
version: "1.0.0"
type: report
authors:
- name: "ZhanlinCui"
date-released: "2026-07-08"
url: "https://skillstore.io/skills/zhanlincui-web-design-guidelines/audits/5"
identifiers:
- type: other
value: "skillstore:zhanlincui-web-design-guidelines:audit:5"
description: "Skillstore immutable audit report identifier"
比较变体
7 个可安装变体每位作者的技能都保持为独立的可安装项。推荐变体按 Skillstore 证据排序。
为什么此变体排名第一
Skillstore 评分最高
作者 / 来源 Skillstore 评分 证据置信度 Skillstore 使用量 已更新
shreyam1008 推荐
shreyam1008-web-design-guidelines
Skillstore 评分 75
证据置信度 中
Skillstore 使用量 2
已更新
2026-10-04
vercel-labs-web-design-guidelines
Skillstore 评分 73
证据置信度 高
Skillstore 使用量 61
已更新
2026-09-09
ZhanlinCui 当前
zhanlincui-web-design-guidelines
Skillstore 评分 72
证据置信度 高
Skillstore 使用量 146
已更新
2026-09-09
supercent-io-web-design-guidelines
Skillstore 评分 71
证据置信度 高
Skillstore 使用量 61
已更新
2026-09-09
Skillstore 评分
评分依据 证据置信度: 高 55
架构
100
可维护性
87
内容
74
社区
83
规范符合性
你能构建什么
合并前 UI 审查
在打开或合并 pull request 之前，检查组件和页面文件中的指南问题。
设计 QA 支持
将已实现的界面与界面质量预期和可访问性实践进行比较。
团队标准审计
在多个项目中运行一致的界面审查，无需重写本地审查清单。
试试这些提示
审查单个页面
根据 Web Interface Guidelines 审查 src/app/page.tsx，并列出带有文件和行号引用的简洁问题发现。
检查组件集合
使用当前指南审查 src/components 中的所有组件，检查可访问性、间距、布局、文案和交互问题。
审计功能分支
根据指南审查此分支中已更改的 UI 文件。按严重程度对问题分组，并包含修复建议。
比较实现模式
审查 app、component 和 design-system 文件中反复出现的指南违规问题。识别系统性风险，并推荐团队层面的修复方案。
最佳实践
- 提供代表用户流程的具体文件或 glob 模式。
- 仅允许该技能从可信且已审查的来源获取指南。
- 当审查覆盖许多文件时，要求按严重程度分组。
避免
- 当只有一个界面发生更改时，不要要求审查整个仓库。
- 不要将指南发现的问题视为自动的产品需求。
- 不要获取未经审查的指南来源，也不要盲目粘贴远程指令。
常见问题
此技能审查什么？
它会审查 Web 界面文件中的设计、UX、可访问性和指南一致性问题。
它会编辑我的代码吗？
不会。除非你另行要求代理进行更改，否则它只会报告问题发现。
为什么它需要网络访问权限？
它会在审查前从配置的来源获取最新的 Web Interface Guidelines。
我可以在 Codex 中使用它吗？
可以。报告列明支持 Claude、Codex 和 Claude Code 工作流。
它可以审查截图吗？
该技能是为基于文件的审查编写的。截图审查需要单独的视觉上下文。
我应该如何处理大型项目？
先从已更改的文件或一个用户流程开始，然后在完成高影响修复后再运行更广泛的审计。
开发者详情
作者
ZhanlinCui许可证
MIT
作者版本
v1.0.0
Skillstore 修订
r1
引用
88a205c7f635a966e31156313b590d59007c5caa
维护新鲜度
2026/7/18
使用量
129 次下载 · 197 次浏览
文件结构
📄 SKILL.md