accessibility

Audits web pages for WCAG 2.1 compliance and implements accessibility fixes.

Updated Feb 4, 2026
One-click install
npx skills add https://github.com/bluebricks-nl/blue-bricks-template --skill accessibility-bluebricks-nl
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: accessibility
Source: https://github.com/bluebricks-nl/blue-bricks-template/tree/main/.claude/skills/accessibility
Command: npx skills add https://github.com/bluebricks-nl/blue-bricks-template --skill accessibility-bluebricks-nl

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 adhering to accessibility standards.

Core Features & Use Cases

  • WCAG Compliance: Audits and provides guidance based on Web Content Accessibility Guidelines (WCAG) 2.1.
  • Perceivable, Operable, Understandable, Robust: Offers detailed checks and code examples for each of the POUR principles.
  • Use Case: When developing a new feature, use this Skill to ensure all interactive elements are keyboard navigable, color contrast meets AA standards, and all images have descriptive alt text.

Quick Start

Use the accessibility skill to audit the current page 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 page for WCAG 2.1 compliance?

You can audit web accessibility by checking your HTML, CSS, and JavaScript against WCAG 2.1 guidelines, focusing on color contrast, keyboard navigation, screen reader support, and form labeling to ensure inclusive design.

What are the POUR principles in web accessibility?

The POUR principles in web accessibility are Perceivable, Operable, Understandable, and Robust. These four concepts ensure web content is accessible and usable by individuals with disabilities using various assistive technologies.

How do I make interactive elements keyboard navigable for screen readers?

To make interactive elements keyboard navigable, implement HTML, CSS, and JavaScript best practices that ensure logical tab order and focus management, allowing screen reader users to operate web content without a mouse.

Does this approach help fix color contrast and form labeling issues?

Yes, this approach provides detailed checks and code examples to fix color contrast and form labeling issues, ensuring your web content meets AA standards for visually impaired and cognitively disabled users.

What is the best way to ensure all images have descriptive alt text?

The best way to ensure images have descriptive alt text is to audit your web content using WCAG 2.1 guidelines, which provides specific checks for the Perceivable principle to make visual information accessible.

When do I need to implement inclusive design in web development?

You need to implement inclusive design in web development whenever building new features or auditing existing pages, ensuring all interactive elements are operable and content is perceivable by every user.