skills.rest
cedricziel
cedriczielCOMMUNITY
Explore all skills by this author →
Website𝕏@cedriczielGitHub

ux-principles

Codify accessible web UI guidelines for server-rendered templates and ARIA usage.

6|1|Updated Feb 21, 2026
Search Tags:#theming#accessibility#ux#responsive-design#semantic-html#web-ui#aria
One-click install
npx skills add https://github.com/cedricziel/assistant --skill ux-principles-cedricziel
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ux-principles
Source: https://github.com/cedricziel/assistant/tree/main/.claude/skills/ux-principles
Command: npx skills add https://github.com/cedricziel/assistant --skill ux-principles-cedricziel

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Improve accessibility, consistency, and responsiveness of the assistant's web UI by applying standardized UX patterns across templates, components, and styling.

Core Features & Use Cases

  • Accessible HTML and ARIA usage to enhance screen reader navigation and focus management.
  • Keyboard-friendly navigation and focus handling to ensure all interactive elements are operable by keyboard.
  • Responsive breakpoints and dark-theme colour tokens to maintain a cohesive, accessible UI across devices.
  • No inline JavaScript policy, enforcing external JS and data-driven interactions for CSP and maintainability. Use when building or reviewing any web-facing HTML/CSS in this project.

Quick Start

Review and apply the UX principles to an existing web page to ensure accessibility, consistency, and maintainable code.

Frequently Asked Questions about ux-principles

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

FAQPage Schema
How do I ensure my web UI is accessible with semantic HTML and ARIA?▼

Ensure web UI accessibility by using semantic HTML elements, applying ARIA roles for screen reader navigation, and enforcing keyboard-friendly focus management across server-rendered templates.

What are the best practices for responsive design and theming in web templates?▼

Apply standardized responsive breakpoints and dark-theme colour tokens to maintain a cohesive UI across devices, using standardized color tokens to meet accessibility requirements consistently.

Why should I avoid inline JavaScript when building accessible web interfaces?▼

Avoid inline JavaScript to enforce external JS and data-driven interactions, ensuring Content Security Policy compliance and long-term maintainability across accessible web interfaces.

How do I manage keyboard navigation and focus for interactive UI elements?▼

Manage keyboard navigation by ensuring all interactive elements are operable by keyboard, applying standardized focus handling and ARIA usage to enhance screen reader focus management.

Can I use these UX principles for reviewing existing server-rendered HTML?▼

Yes, you can review and apply these UX principles to existing server-rendered web pages to validate semantic HTML, ARIA usage, and responsive behavior for accessibility compliance.

Related Skills

Explore More Design & Creative Skills→
RaNDoM6913RaNDoM6913
1

ui-reviewer

Audit frontend UI for accessibility, semantic HTML, z-index, and animation issues.

Community
Intermediate
aesthezelaesthezel
8

accessibility

Audit web content for WCAG 2.2 compliance and generate improvement suggestions.

Community
Advanced
danmestasdanmestas
4

vitaly

Enforce accessible form design patterns with ARIA attributes and keyboard navigation.

Community
Advanced
SAPSAP
294

a11y-audit

Audit UI components for WCAG AA accessibility compliance.

Official
Advanced