skills.rest
Jaylaelike
JaylaelikeCOMMUNITY
Explore all skills by this author →
GitHub

web-design-guidelines

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

Updated Sep 6, 2024
Search Tags:#accessibility#frontend#web design#review#UI guidelines#ux review
One-click install
npx skills add https://github.com/Jaylaelike/pm25-interactive-thaipbs-app --skill web-design-guidelines-jaylaelike
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: web-design-guidelines
Source: https://github.com/Jaylaelike/pm25-interactive-thaipbs-app/tree/main/.agents/skills/web-design-guidelines
Command: npx skills add https://github.com/Jaylaelike/pm25-interactive-thaipbs-app --skill web-design-guidelines-jaylaelike

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill helps teams verify that UI code adheres to Web Interface Guidelines, ensuring accessibility, consistency, and a high-quality user experience.

Core Features & Use Cases

  • Fetch the latest Web Interface Guidelines and apply them to UI assets.
  • Analyze HTML, CSS, and JavaScript files for accessibility, semantics, responsive behavior, and visual usability.
  • Provide actionable findings with references to guideline rules to support remediation in design-review or code-review workflows.

Quick Start

Use the web-design-guidelines skill to review your UI assets by providing the files or patterns you want checked. The system will fetch the latest guidelines from the source URL in the Skill metadata and evaluate your inputs accordingly.

Frequently Asked Questions about web-design-guidelines

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

FAQPage Schema
How do I review my UI code for accessibility and visual consistency?▼

To review UI code for accessibility and visual consistency, provide your HTML, CSS, and JavaScript files to a web design guideline checker, which evaluates them against fetched standards and outputs actionable compliance findings for remediation.

What is a web interface guidelines compliance check?▼

A web interface guidelines compliance check analyzes HTML, CSS, and JavaScript files to identify gaps in accessibility, usability, semantics, and visual consistency, ensuring UI code adheres to established design standards for high-quality user experience.

Can I use automated UX review for small web projects?▼

Yes, automated UX review applies to web projects of any size. By evaluating provided UI assets against fetched web interface guidelines, it scales to identify accessibility and semantic compliance gaps regardless of project scope.

How to check HTML and CSS files against web design guidelines?▼

Check HTML and CSS files against web design guidelines by submitting the files for analysis. The system fetches the latest guideline rules, evaluates semantics and responsive behavior, and generates actionable findings with references for code-review workflows.

Does UI accessibility review require fetching external guideline sources?▼

Yes, UI accessibility review requires fetching the latest guidelines from a designated source URL. This ensures the evaluation of UI assets applies current checks for accessibility, semantics, and visual usability to generate precise findings.

Related Skills

Explore More Design & Creative Skills→
heykaran77heykaran77

web-design-guidelines

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

Community
Intermediate
Ayushkumar48Ayushkumar48

web-design-guidelines

Audit web UI files for accessibility and UX guideline compliance.

Community
Intermediate
betaTridentbetaTrident

browser-qa

Automate visual regression testing and UI interaction verification for web applications.

Community
Advanced
Kilo-OrgKilo-Org
166

web-design-guidelines

Evaluate UI code against Web Interface Guidelines for accessibility and design compliance.

Official
Intermediate