skills.rest
goldeneggg
goldenegggCOMMUNITY
Explore all skills by this author →
𝕏@practaincGitHub

web-design-guidelines

Identifies web design and accessibility violations in HTML, CSS, and JS files.

1|Updated Dec 14, 2014
Search Tags:#accessibility#audit#review#guidelines#ux#web-design
One-click install
npx skills add https://github.com/goldeneggg/dotfiles --skill web-design-guidelines-goldeneggg
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/goldeneggg/dotfiles/tree/main/claude-linux/.claude/skills/web-design-guidelines
Command: npx skills add https://github.com/goldeneggg/dotfiles --skill web-design-guidelines-goldeneggg

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

UI code often fails accessibility and design guidelines, leading to poor usability and inconsistent experiences. This Skill automates reviews against the latest Web Interface Guidelines to surface issues quickly.

Core Features & Use Cases

  • Fetches the latest guidelines from a remote source and keeps checks up to date.
  • Applies guidelines to specified web files (HTML/CSS/JS) to identify accessibility, contrast, semantic, and UX issues.
  • Use Case: QA teams can run this on components or pages to generate a concise list of violations for fixes.

Quick Start

Provide the target UI files or patterns (for example index.html, components/*) and let the skill review them against the latest guidelines.

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 web files for accessibility and UX guideline violations?▼

To audit web files for accessibility and UX violations, provide your HTML, CSS, and JS files or patterns to a review tool that fetches the latest guidelines and applies all rules, reporting findings in a concise file:line format.

What is automated UI accessibility and design conformance review?▼

Automated UI accessibility and design conformance review is the process of scanning web files like HTML, CSS, and JS against the latest Web Interface Guidelines to surface semantic, contrast, and usability issues quickly.

How do I check my HTML and CSS components for non-conformities?▼

You can check HTML and CSS components for non-conformities by running an automated review across your project files, which applies fetched rules to identify accessibility, contrast, and semantic design violations.

Can I review web project patterns against the latest remote guidelines?▼

Yes, you can review web project patterns by fetching the latest guidelines from a specified remote URL and applying all rules to your provided HTML, CSS, and JS files to generate a concise list of violations.

Does automated web design review work for QA teams testing components?▼

Yes, automated web design review works for QA teams testing components by quickly generating a concise list of accessibility and UX guideline violations across project files, enabling fast fixes.

What is the best way to surface accessibility issues in web interface code?▼

The best way to surface accessibility issues in web interface code is to run an automated audit that fetches current guidelines and applies them to your HTML, CSS, and JS files, outputting findings in a concise file:line format.

Related Skills

Explore More Design & Creative Skills→
brainbrewlabsbrainbrewlabs
7

web-design-guidelines

Audit HTML, CSS, and JavaScript files against Web Interface Guidelines.

Official
Intermediate
jrmatherlyjrmatherly

web-design-guidelines

Analyze HTML/CSS/JS files for accessibility and design guideline compliance.

Community
Basic
breakingcircuits1337breakingcircuits1337

web-design-guidelines

Audit UI code against Web Interface Guidelines for compliance.

Community
Advanced
opencodosopencodos
14

web-design

Audit HTML, CSS, and JS for web interface guideline compliance.

Official
Intermediate