skills.rest
carloitaben
carloitabenCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

accessibility

Audit web content for WCAG 2.1 compliance with code examples and testing checklists.

Updated Jul 2, 2024
Search Tags:#accessibility#a11y#screen reader#web development#keyboard navigation#WCAG#usability
One-click install
npx skills add https://github.com/carloitaben/dotfiles --skill accessibility-carloitaben
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: accessibility
Source: https://github.com/carloitaben/dotfiles/tree/main/.config/opencode/skills/accessibility
Command: npx skills add https://github.com/carloitaben/dotfiles --skill accessibility-carloitaben

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses the critical need to make web content usable by everyone, including individuals with disabilities, by auditing and improving adherence to accessibility standards.

Core Features & Use Cases

  • WCAG 2.1 Compliance: Provides guidelines and checks against the POUR principles (Perceivable, Operable, Understandable, Robust).
  • Code Auditing: Offers examples and best practices for fixing common accessibility issues in HTML, CSS, and JavaScript.
  • Testing Checklists: Includes automated and manual testing strategies, along with screen reader commands.
  • Use Case: A developer needs to ensure their new web application is usable by screen reader users and meets legal accessibility requirements. They use this Skill to identify and fix issues like missing alt text, poor color contrast, and keyboard navigation problems.

Quick Start

Use the accessibility skill to audit the provided webpage for WCAG 2.1 compliance.

Frequently Asked Questions about accessibility

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

FAQPage Schema
How do I audit my web application for WCAG 2.1 compliance?▼

To audit web accessibility for WCAG 2.1 compliance, evaluate your HTML, CSS, and JavaScript against the Perceivable, Operable, Understandable, and Robust (POUR) principles. This process identifies issues like missing text alternatives and poor color contrast.

How do I fix keyboard navigation and focus visibility issues in web development?▼

Fix keyboard navigation and focus visibility issues by implementing proper ARIA usage and focus management in your code. Best practices include ensuring logical tab order and visible focus indicators for users navigating without a mouse.

What is the best way to test screen reader compatibility for web content?▼

The best way to test screen reader compatibility is combining automated validation tools with manual testing checklists. This approach verifies that text alternatives and ARIA landmarks are properly announced to assistive technologies.

Does this accessibility audit cover color contrast and text alternative requirements?▼

Yes, this accessibility audit covers color contrast and text alternative requirements. It provides specific code examples and best practices to resolve these common issues and ensure content is perceivable by all users.

Can I use this to check if my website meets legal accessibility requirements?▼

Yes, you can use this to check if your website meets legal accessibility requirements. Auditing against WCAG 2.1 guidelines helps ensure your web content is usable by individuals with disabilities and aligns with compliance standards.

Related Skills

Explore More Software Engineering Skills→
yahav123147yahav123147

accessibility

Diagnose WCAG 2.1 compliance issues and recommend HTML/CSS/JS fixes.

Community
Intermediate
CrazyDubyaCrazyDubya

accessibility-auditor

Audit web applications for WCAG 2.1 Level AA accessibility compliance.

Community
Intermediate
kennedym-dskennedym-ds
14

accessibility-wcag

Evaluate and implement WCAG 2.1 AA accessibility patterns for frontend web development.

Community
Advanced
mikecubedmikecubed

a11y-check

Detect accessibility issues in TSX/JSX code and provide remediation guidance.

Community
Advanced