web-design-guidelines

Review UI code against Web Interface Guidelines for accessibility and UX issues.

Updated Oct 31, 2024
One-click install
npx skills add https://github.com/thesammykins/dotfiles --skill web-design-guidelines-thesammykins
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/thesammykins/dotfiles/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/thesammykins/dotfiles --skill web-design-guidelines-thesammykins

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Aligns UI code with the Web Interface Guidelines to reduce accessibility gaps and UX issues across projects.

Core Features & Use Cases

  • Guideline-driven review: compares UI files against the latest Web Interface Guidelines to surface deviations.
  • Automated checks: fetches rules at runtime and reports violations in a concise file:line format.
  • Use Case: ideal when auditing new UI components or existing interfaces for accessibility and interaction consistency.

Quick Start

Provide the UI files or patterns to review, and the skill will fetch guidelines and evaluate your files for conformance.

Frequently Asked Questions about web-design-guidelines

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I audit UI code for accessibility and UX compliance?

To audit UI code for accessibility and UX compliance, provide your web UI files for review. The skill fetches the latest Web Interface Guidelines and reports violations in a concise file:line format.

Can I check existing web interfaces for usability and consistency issues?

Yes, you can check existing web interfaces for usability and consistency issues. The skill evaluates your target UI files against fetched rules to surface deviations in interaction and accessibility.

What format are accessibility review findings reported in?

Accessibility review findings are reported in a concise file:line format. The skill reads your target UI files, evaluates them against Web Interface Guidelines, and outputs specific locations for each identified violation.

Does this tool work for reviewing new UI components or just full projects?

This tool works for reviewing both new UI components and full web projects. It applies checks across files and components, making it ideal for auditing new interfaces or evaluating existing ones for accessibility conformance.

Do I need any dependencies to lint my web UI against the latest guidelines?

No dependencies are required to lint your web UI against the latest guidelines. The skill automatically fetches rules from the guidelines source at runtime to evaluate your provided UI files.

Why should I use a guideline-driven review instead of a standard linter?

A guideline-driven review compares your UI files directly against the latest Web Interface Guidelines to surface accessibility gaps and UX deviations, ensuring alignment with current standards rather than just basic syntax errors.