temp_preferences_customTHE FUTURE OF PROMPT ENGINEERING

WAI-ARIA & WCAG 2.1 Compliance Auditor

Enterprise accessibility audit for complex UI components and dynamic application states.

terminalchatgpttrending_upRisingcontent_copyUsed 110 timesby Community

ariawcaginclusive-designa11yaccessibility

chatgpt

0 words

System Message

You are an Accessibility (a11y) Consultant and WCAG 2.1 Level AA Specialist. Your goal is to ensure the web is inclusive for all users, including those using screen readers (JAWS, NVDA, VoiceOver), switch controls, and keyboard-only navigation. ### CORE AUDIT AREAS 1. **Semantic Integrity**: Ensure the use of native HTML elements over `div` with ARIA roles wherever possible. 2. **Focus Management**: Identify 'focus traps' in modals or lost focus when elements are removed from the DOM. 3. **ARIA Usage**: Check for 'ARIA-itis' (over-use of ARIA) and ensure attributes like `aria-expanded`, `aria-controls`, and `aria-describedby` are correctly linked. 4. **Dynamic Updates**: Implement `aria-live` regions for toasts, errors, or live data updates to notify assistive technology. ### QUALITY RULES - You must explain *why* an accessibility barrier exists from the user's perspective. - You must provide the corrected code snippet with clear comments on the ARIA attributes. - You must verify that color contrast meets the 4.5:1 ratio for normal text.

User Message

### ACCESSIBILITY AUDIT TARGET - **Component Type**: {{&{UI_COMPONENT}}} - **Target Compliance**: {{&{WCAG_LEVEL}}} - **Interactivity**: {{&{HOW_IT_INTERACTS}}} ### SOURCE CODE: {{&{CODE_FOR_AUDIT}}} ### THE TASK: Please review this code for accessibility barriers. Focus specifically on how a screen reader user would perceive this component. If there are missing keyboard listeners (e.g., Space/Enter/Escape), provide the code to fix them. Ensure that the visual focus state is preserved and distinct.

About this prompt

Accessibility is often an afterthought, leading to legal risks and poor user experience. This prompt acts as a CPACC-certified expert to audit your components for W3C compliance. It doesn't just check for alt tags; it analyzes keyboard focus traps, aria-live regions for dynamic content, and color contrast ratios. It provides the exact HTML/ARIA refactor needed to make complex widgets (like tabs, modals, or comboboxes) fully usable for screen reader users and those with motor impairments.

signal_cellular_altexpertcodeMore Frontend Dev prompts

Latest Insights

Stay ahead with the latest in prompt engineering.

View blogchevron_right

How to Write System Prompts That Actually Work

Article

person Admin•schedule 5 min read

How to Write System Prompts That Actually Work

System prompts set the rules of the game for every AI interaction. This hands-on guide shows you exactly how to structure them for reliability and consistency.

Claude vs GPT-4o: Which Model Fits Your Use Case?

Article

person Admin•schedule 5 min read

Claude vs GPT-4o: Which Model Fits Your Use Case?

Choosing between Claude and GPT-4o is less about which is "better" and more about which fits your specific task. Here is a practical breakdown.

How Our Design Team Cut Brief-Writing Time by 70% with AI

Article

person Admin•schedule 5 min read

How Our Design Team Cut Brief-Writing Time by 70% with AI

A real-world case study on how a 12-person design team at a product agency standardised their creative brief process using prompt templates on PromptShip.

Why AI Hallucinations Happen (and How to Reduce Them)

Article

person Admin•schedule 5 min read

Why AI Hallucinations Happen (and How to Reduce Them)

Hallucinations are not bugs — they are a fundamental property of how language models work. Understanding why they happen is the first step to minimising them.

The State of AI Coding Assistants in 2026

Article

person Admin•schedule 5 min read

The State of AI Coding Assistants in 2026

From autocomplete to autonomous agents — AI coding tools have changed dramatically. Here is where things stand and what to expect next.

From Idea to Shipped Prompt: A Solo Founder's AI Workflow

Article

person Admin•schedule 5 min read

From Idea to Shipped Prompt: A Solo Founder's AI Workflow

One founder. No team. A dozen AI-powered tools and a tight prompt library. Here is the workflow that runs a bootstrapped SaaS doing $15k MRR.

Recommended Prompts

claudeshieldTrusted

bookmark

WCAG 2.2 Accessibility Reviewer for React & HTML

Audits React, JSX, and HTML for WCAG 2.2 Level AA compliance — checking semantic structure, ARIA misuse, keyboard reachability, focus order, color contrast intent, and screen-reader narration — and returns prioritized findings with success-criterion citations and copy-paste fixes.

WCAG 2.2 Accessibility Auditor

Performs a comprehensive WCAG 2.2 Level AA accessibility audit of frontend code identifying violations with SC references, impact severity, affected user groups, and remediation code.

Design System Component Code Reviewer

Expert review of design system component implementations covering API design, variant patterns, accessibility, composability, and documentation.

Core Web Vitals & Critical Path Specialist

Technical optimization of LCP, CLS, and INP metrics to pass Google's PageSpeed Insights.

React Error Boundary & Fallback UI Designer

Designs a complete React error handling system with strategically placed error boundaries, graceful fallback UIs, error logging integration, and recovery mechanisms.

Angular Component Lifecycle Optimizer

Analyzes Angular component lifecycle hooks usage to eliminate memory leaks, prevent ExpressionChangedAfterChecked errors, and optimize change detection cycles.

star 0fork_right 134

bolt

pin_invoke