Skip to main content

Description

This prompt identifies accessibility issues that provide the best return on investment using all three analysis tools (axe-core, Pa11y, and Lighthouse). It focuses on high impact fixes that require minimal effort, includes the current Lighthouse score with projected improvement, and provides time estimates, before/after code examples, and a copyable implementation checklist. Best for: Sprint planning, identifying low-hanging fruit, quick improvements.

Arguments

ArgumentTypeRequiredDefaultDescription
urlstring-URL of the page to analyze

Example Usage

Basic Usage

Use the quick-wins-report prompt for https://my-landing-page.com

Natural Language

Show me the quick accessibility wins for https://example.com - what can we fix easily?

Output Includes

The prompt generates a prioritized report with:
  • Priority-Ordered Fixes: Ranked by impact/effort ratio across all three tools
  • Time Estimates: Approximate time to implement each fix
  • Before/After Code: Ready-to-use code examples
  • Implementation Checklist: Copyable list for task tracking
  • Current Lighthouse Score: Score with key failing audits that are also quick wins
  • Impact Estimation: Projected Lighthouse score improvement and additional WCAG criteria addressed

Example Output Structure

## Quick Wins Report: example.com

### Summary
Found **8 quick wins** that can be fixed in approximately **2-3 hours**
Estimated accessibility score improvement: **+15 points**

---

### Quick Win #1: Add Missing Alt Text
**Impact**: High | **Effort**: 5 minutes | **Instances**: 4

Screen reader users cannot access image content.

**Before:**
<img src="team-photo.jpg">

**After:**
<img src="team-photo.jpg" alt="Our team of 5 developers in the office">

**Files to update:**
- `src/components/About.tsx` (line 45)
- `src/components/Header.tsx` (line 12)

---

### Quick Win #2: Add Form Labels
**Impact**: High | **Effort**: 10 minutes | **Instances**: 3

Form inputs are not associated with labels.

**Before:**
<input type="email" placeholder="Email">

**After:**
<label for="email">Email address</label>
<input type="email" id="email" placeholder="[email protected]">

---

### Quick Win #3: Fix Button Names
**Impact**: High | **Effort**: 5 minutes | **Instances**: 2

Icon buttons lack accessible names.

**Before:**
<button><svg>...</svg></button>

**After:**
<button aria-label="Close dialog"><svg>...</svg></button>

---

## Implementation Checklist

Copy this checklist to your task tracker:

- [ ] Add alt text to 4 images (5 min)
- [ ] Add labels to 3 form inputs (10 min)
- [ ] Add aria-label to 2 icon buttons (5 min)
- [ ] Add skip-to-content link (15 min)
- [ ] Fix heading hierarchy (10 min)
- [ ] Add lang attribute to html (2 min)
- [ ] Add focus indicators to links (15 min)
- [ ] Fix link text "click here" → descriptive (10 min)

**Total estimated time: 72 minutes**

## Estimated Impact

| Metric | Before | After |
|--------|--------|-------|
| Accessibility Score | 65 | ~80 |
| Critical Issues | 4 | 0 |
| WCAG AA Compliance | Partial | Improved |

Prioritization Matrix

Quick wins are selected based on:
PriorityImpactEffortExample
🔥 HighestCriticalless than 10 minMissing alt text
⚡ HighSeriousless than 30 minForm labels
✅ MediumModerateless than 1 hourSkip links

When to Use

ScenarioRecommended
Sprint planning✅ Yes
Limited time for fixes✅ Yes
Accessibility improvement roadmap✅ Yes
Compliance auditUse full-accessibility-audit instead
Deployment decisionUse pre-deploy-check instead

Build docs developers (and LLMs) love