无障碍审计与修复
Accessibility audit & remediation
Audit an app or site with screen readers and checkers, then fix the defects.
20 条本项目编写的提案 · 分类 v1.1 · 新增基准运行 0 次。下方验证方式与部分得分规则是设计,不是执行结果。
- 典型应用
- axe · Lighthouse · VoiceOver · Accessibility Inspector
- 小类 GUI 需求标签
HY· 混合
任务提案 · 20
展开查看完整原文与建议检查方式;两种界面均保留提案英文原文。
R02.07.01.03-T01 Clear all serious axe violations on a five-page site
原始指令
The sandbox marketing site in site/ (static HTML/CSS/JS, served at localhost:8080) has axe-core violations on 5 pages. Run axe in the browser, fix every serious and critical violation in the source, and keep the visual design unchanged.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- axe DevTools · Chrome
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
HY· 混合- 交互原语
code· 代码与命令vis· 视觉判断- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 2 / 5
建议验证方式
Grader runs axe-core 4.9 on all 5 pages: zero serious/critical violations; total violations ≤2 minor. Screenshot SSIM ≥0.97 vs baseline per page. Hidden checks for aria-hidden misuse to block 'hide the element' shortcuts.
建议部分得分
60% serious/critical cleared (per page); 20% design unchanged; 20% no aria-hidden/role abuse
R02.07.01.03-T02 Audit a checkout flow with VoiceOver only
原始指令
On macOS, use VoiceOver (no mouse) to complete the sandbox checkout at localhost:3000 in Safari. Record every barrier you hit in output/vo_audit.csv (step, element, WCAG criterion, what VoiceOver announced, expected) and note whether you could finish.
- 平台
mac· macOSweb· 任意系统(网页)- 应用
- VoiceOver · Safari
- 交互表面
brow· 浏览器- GUI 需求 · 任务设定
G2· GUI 必要- GUI 需求 · 普通权限
G2· GUI 必要- 交互原语
key· 快捷键vis· 视觉判断- 工作产物
WP01· 文档- 条件
- 未声明
- 提案难度
- 3 / 5
建议验证方式
8 seeded barriers (unlabeled icon button, focus trap, unannounced error, wrong heading order…). Rows matched by step/element and criterion; recall and precision scored. VoiceOver speech log (captured by grader) must show the agent reached the confirmation page. Pointer devices are disabled and the input log must show only keyboard/VoiceOver commands.
建议部分得分
55% barriers found; 15% criteria correct; 15% precision; 15% completed with VO
R02.07.01.03-T03 Fix keyboard navigation, focus order and modal focus trapping
原始指令
In the React app fixtures/booking, make every interactive element reachable by Tab in visual order, add a visible 3:1 focus indicator, a skip link to main, and make the date modal trap focus, close on Escape and return focus to its trigger.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- Chrome · axe DevTools
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
HY· 混合- 交互原语
code· 代码与命令key· 快捷键- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 3 / 5
建议验证方式
Hidden Playwright keyboard tests: Tab sequence equals spec order (24 stops), focus ring contrast ≥3:1 measured on screenshots, skip link moves focus to main, modal trap/Escape/return-focus behavior. Mouse-only handlers on divs rejected by eslint-plugin-jsx-a11y.
建议部分得分
35% tab order; 20% focus indicator contrast; 15% skip link; 30% modal behavior
R02.07.01.03-T04 Repair brand color tokens to meet WCAG contrast with minimal change
原始指令
input/tokens.json defines 14 brand colors used for text and UI components; 9 pairs listed in input/pairs.csv fail WCAG 2.2 AA. Adjust tokens so every listed pair meets its required ratio (4.5:1 text, 3:1 UI), changing each color as little as possible, and rebuild the style guide page.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- Colour Contrast Analyser · Chrome
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
CL· CLI 足够- 交互原语
vis· 视觉判断code· 代码与命令- 工作产物
WP03· 视觉排版- 条件
- 未声明
- 提案难度
- 3 / 5
建议验证方式
Grader computes contrast for all pairs: all pass. Mean ΔE2000 between old and new tokens ≤ reference solution ×1.25; hue shift ≤10° per token. Style guide renders with new tokens (computed CSS check).
建议部分得分
50% all pairs pass; 30% minimal change (ΔE); 10% hue preserved; 10% style guide rebuilt
R02.07.01.03-T05 Remediate an iOS app for VoiceOver
原始指令
fixtures/Transit (SwiftUI) fails Xcode Accessibility Inspector audits on 4 screens. Fix labels, traits, grouping of route rows, heading traits for section titles, and Dynamic Type clipping, then confirm with VoiceOver in the Simulator that a route can be found and favorited.
- 平台
mac· macOSios· iOS/iPadOS- 应用
- Xcode · Accessibility Inspector · iOS Simulator · VoiceOver
- 交互表面
mob· 移动触控desk· 桌面 GUI- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
HY· 混合- 交互原语
code· 代码与命令vis· 视觉判断touch· 触控手势- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 4 / 5
建议验证方式
Hidden XCUITest runs performAccessibilityAudit on 4 screens: zero issues. Element tree checks: each route row is one element with label 'Line 5, to Airport, 4 min'; headings have header trait; at AX5 text size no truncated labels.
建议部分得分
40% audit clean; 25% row grouping/labels; 15% heading traits; 20% Dynamic Type
R02.07.01.03-T06 Fix TalkBack labels and touch targets in an Android app
原始指令
In fixtures/Pantry (Android Views), fix missing content descriptions, 48 dp minimum touch targets, focus order on the edit screen and announce list updates. Verify with TalkBack and Accessibility Scanner on the API 34 emulator.
- 平台
mac· macOSwin· Windowslin· Linuxand· Android- 应用
- Android Studio · TalkBack · Accessibility Scanner
- 交互表面
mob· 移动触控desk· 桌面 GUI- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
HY· 混合- 交互原语
code· 代码与命令touch· 触控手势- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 3 / 5
建议验证方式
Espresso tests with AccessibilityChecks.enable() over 5 screens: zero errors. Hidden UiAutomator traversal of the edit screen records focus order == spec. Live region announcement present on list change (accessibilityLiveRegion polite).
建议部分得分
40% ATF checks clean; 25% touch targets; 20% focus order; 15% live region
R02.07.01.03-T07 Make a WPF app usable with Narrator and high contrast
原始指令
fixtures/Ledger (WPF) is unusable with Narrator: unnamed buttons, custom controls without automation peers, mouse-only grid editing, and invisible text in high-contrast themes. Fix it and verify with Accessibility Insights for Windows FastPass and Narrator.
- 平台
win· Windows- 应用
- Visual Studio · Accessibility Insights · Narrator
- 交互表面
desk· 桌面 GUI- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
HY· 混合- 交互原语
code· 代码与命令key· 快捷键vis· 视觉判断- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 4 / 5
建议验证方式
Accessibility Insights CLI scan of 4 windows: zero failures. FlaUI tests: all buttons have Name, custom gauge exposes RangeValue pattern, grid cells editable via keyboard. High-contrast screenshot: text/background contrast ≥7:1 at OCR boxes.
建议部分得分
35% scan clean; 25% automation peers; 20% keyboard grid; 20% high contrast
R02.07.01.03-T08 Make a dashboard's tables and charts accessible
原始指令
The sandbox analytics page renders a div-based table and 3 SVG charts with no text alternatives. Convert the table to semantic markup with headers and caption, give each chart a concise description plus an accessible data table toggle, and ensure sort buttons announce state.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- axe DevTools · NVDA · Chrome
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
CL· CLI 足够- 交互原语
code· 代码与命令vis· 视觉判断- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 3 / 5
建议验证方式
Grader: table has th scope and caption; NVDA (via guidepup) reading a cell announces its row and column headers; each chart has role=img + aria-label or figure/figcaption and a data table whose values equal the chart's data; aria-sort updates on click. axe clean.
建议部分得分
30% table semantics; 35% chart alternatives with exact data; 20% sort state; 15% axe clean
R02.07.01.03-T09 Make form errors perceivable to screen readers
原始指令
The sandbox insurance quote form shows errors only as red borders. Add programmatically associated error messages, an error summary that receives focus on submit, required field indication, and autocomplete attributes, without changing validation logic.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- Chrome · NVDA · axe DevTools
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
CL· CLI 足够- 交互原语
code· 代码与命令type· 文字与表单- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 3 / 5
建议验证方式
Playwright submits invalid data: summary focused, links jump to fields; each invalid input has aria-invalid and aria-describedby pointing to text; NVDA speech log on field focus includes the error. Validation rules unchanged (unit tests).
建议部分得分
30% error association; 25% summary focus; 20% required/autocomplete; 25% NVDA announces errors
R02.07.01.03-T10 Remediate a tagged PDF in Acrobat Pro to pass PAC
原始指令
input/annual_report.pdf (24 pages, untagged scan-free PDF) must pass PDF/UA. In Acrobat Pro, add tags, fix reading order of the 2-column pages, mark artifacts, add alt text to 9 figures (text in input/alt.csv), table headers on 4 tables and set document language and title.
- 平台
mac· macOSwin· Windows- 应用
- Adobe Acrobat Pro
- 交互表面
desk· 桌面 GUI- GUI 需求 · 任务设定
G2· GUI 必要- GUI 需求 · 普通权限
G2· GUI 必要- 交互原语
click· 指向与点击drag· 拖放vis· 视觉判断- 工作产物
WP01· 文档- 条件
licensed· 授权专业软件long· 长流程- 提案难度
- 4 / 5
建议验证方式
PAC 2024 (CLI) on output/annual_report_ua.pdf: zero PDF/UA and WCAG failures. Tag-tree checks: figure alt equals CSV, tables have TH with scope, reading order of pages 4–9 matches reference. Visual content unchanged (page SSIM ≥0.99). Acrobat JavaScript and Action Wizard are disabled, no PDF libraries are installed, and the file must be saved by Acrobat Pro (Producer/XMP).
建议部分得分
35% PAC clean; 25% reading order; 20% alt text; 20% table headers
R02.07.01.03-T11 Write a WCAG 2.2 conformance report with evidence
原始指令
Evaluate the sandbox web app 'Clinicly' (6 key flows) against the 50 WCAG 2.2 A/AA success criteria using automated tools plus manual keyboard and screen-reader checks. Fill output/acr.csv (criterion, conformance level: Supports/Partially/Does Not Support/N/A, evidence, location).
- 平台
mac· macOSwin· Windowsweb· 任意系统(网页)- 应用
- axe DevTools · NVDA · VoiceOver · Chrome
- 交互表面
brow· 浏览器- GUI 需求 · 任务设定
G2· GUI 必要- GUI 需求 · 普通权限
G2· GUI 必要- 交互原语
key· 快捷键vis· 视觉判断click· 指向与点击- 工作产物
WP01· 文档- 条件
long· 长流程- 提案难度
- 5 / 5
建议验证方式
Grader compares per-criterion conformance to an expert key built from 14 seeded defects: accuracy ≥0.85 for pass; each 'Does Not Support' must cite a location matching a seeded defect. Evidence quality checked by LLM rubric (10%). axe-core CLI/npm is not installed on the VM, and NVDA/VoiceOver speech logs captured by the grader must show manual passes through all 6 flows.
建议部分得分
55% conformance accuracy; 25% defect locations cited; 10% N/A correctness; 10% evidence rubric
R02.07.01.03-T12 Add captions and accessible controls to a video player
原始指令
The custom video player in fixtures/learn-player has icon-only controls and no captions. Add a WebVTT captions track from input/lecture.srt (convert timing), a captions toggle, keyboard shortcuts per the APG, accessible names and pressed states for all controls.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- Chrome · axe DevTools
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
CL· CLI 足够- 交互原语
code· 代码与命令av· 音视频时序key· 快捷键- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 3 / 5
建议验证方式
Grader: VTT cues match SRT text and times ±10 ms; toggling captions changes textTracks mode; all buttons named with aria-pressed where toggles; keyboard space/k/arrows behave; axe clean.
建议部分得分
30% captions correct; 20% toggle; 30% names/states; 20% keyboard
R02.07.01.03-T13 Make a news site reflow at 400% zoom
原始指令
The sandbox news site needs horizontal scrolling at 320 CSS px width and breaks with WCAG text-spacing overrides. Fix the CSS so content reflows at 1280 px with 400% zoom, nothing is lost with text-spacing (line 1.5, paragraph 2, letter 0.12, word 0.16 em), and fixed headers don't cover focused content.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- Chrome
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
HY· 混合- 交互原语
code· 代码与命令vis· 视觉判断- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 3 / 5
建议验证方式
Playwright at 320×256 viewport across 6 pages: scrollWidth ≤ 320 except data tables; text-spacing bookmarklet applied: no clipped text (scrollHeight vs clientHeight on text containers). Focused elements not obscured by the sticky header (bounding-box overlap).
建议部分得分
40% reflow; 30% text spacing; 20% focus not obscured; 10% tables scroll locally
R02.07.01.03-T14 Honor reduced-motion preferences across a landing page
原始指令
The landing page in site/ has parallax, auto-playing carousel and scroll-triggered animations. With prefers-reduced-motion: reduce, disable parallax and non-essential animations, stop the carousel autoplay, and add a pause button for the carousel in all modes.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- Chrome
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
CL· CLI 足够- GUI 需求 · 普通权限
CL· CLI 足够- 交互原语
code· 代码与命令- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 2 / 5
建议验证方式
Playwright with reducedMotion 'reduce': no CSS animations/transitions longer than 0.01 s running, carousel index unchanged after 10 s, scroll position-linked transforms constant. Normal mode: pause button stops rotation and is labelled.
建议部分得分
40% reduced motion respected; 30% carousel autoplay stops; 30% pause button works and is named
R02.07.01.03-T15 Announce route changes and manage focus in a single-page app
原始指令
In the React SPA fixtures/portal, client-side navigation leaves screen-reader users silent and focus on the old link. Add route-change announcements, move focus to each new page's H1, update document titles, and keep browser back/forward working.
- 平台
mac· macOSwin· Windowsweb· 任意系统(网页)- 应用
- NVDA · VoiceOver · Chrome
- 交互表面
brow· 浏览器- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
CL· CLI 足够- 交互原语
code· 代码与命令key· 快捷键- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 4 / 5
建议验证方式
Grader drives NVDA via guidepup across 8 route changes: speech log contains the new page title within 1 s each time; document.activeElement is the H1; titles match spec; history navigation repeats the announcements.
建议部分得分
40% announcements; 30% focus on H1; 15% titles; 15% back/forward
R02.07.01.03-T16 Rebuild a combobox and date picker to ARIA APG patterns
原始指令
Replace the custom autocomplete and date picker in fixtures/travel-form with implementations following the ARIA Authoring Practices combobox (list autocomplete) and date picker dialog patterns, including full keyboard support and screen-reader announcements, without third-party widget libraries.
- 平台
mac· macOSwin· Windowsweb· 任意系统(网页)- 应用
- Chrome · NVDA · VoiceOver
- 交互表面
brow· 浏览器- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
CL· CLI 足够- 交互原语
code· 代码与命令key· 快捷键- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 5 / 5
建议验证方式
Hidden Playwright tests derived from the APG keyboard tables (31 interactions) plus NVDA speech-log checks for option count and selected date announcements. ARIA attributes validated (aria-activedescendant, aria-expanded, grid roles). No widget libraries in package.json.
建议部分得分
45% combobox interactions; 40% date picker interactions; 15% SR announcements
R02.07.01.03-T17 Raise a page's Lighthouse accessibility score to 100
原始指令
The sandbox product page at localhost:4000/p/42 scores 71 in Lighthouse accessibility. Fix the source until Lighthouse reports 100 for accessibility on desktop and mobile, without removing content.
- 平台
mac· macOSwin· Windowslin· Linux- 应用
- Lighthouse · Chrome
- 交互表面
brow· 浏览器term· 终端- GUI 需求 · 任务设定
CL· CLI 足够- GUI 需求 · 普通权限
CL· CLI 足够- 交互原语
code· 代码与命令- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 2 / 5
建议验证方式
Grader runs Lighthouse CLI (desktop and mobile presets): accessibility 100 both. Content parity: visible text and image count equal to baseline; no aria-hidden on content regions.
建议部分得分
60% score 100 on both presets (partial by score); 40% content parity
R02.07.01.03-T18 Fix a PowerPoint deck's accessibility issues
原始指令
input/onboarding.pptx (18 slides) fails PowerPoint's Accessibility Checker. Give every slide a unique title, add alt text from input/alt.csv, mark decorative images, fix reading order on 5 slides with the Selection/Reading Order pane, and correct 3 low-contrast text boxes using theme colors.
- 平台
mac· macOSwin· Windows- 应用
- PowerPoint
- 交互表面
desk· 桌面 GUI- GUI 需求 · 任务设定
G2· GUI 必要- GUI 需求 · 普通权限
G2· GUI 必要- 交互原语
click· 指向与点击drag· 拖放vis· 视觉判断- 工作产物
WP03· 视觉排版- 条件
licensed· 授权专业软件- 提案难度
- 3 / 5
建议验证方式
Grader parses PPTX XML: unique titles; descr attributes equal CSV; decorative flag set; shape order on 5 slides equals reference reading order; text contrast ≥4.5:1 from theme colors. Slide renders SSIM ≥0.97 vs original except fixed text boxes. VBA macros and AppleScript are disabled, python-pptx is absent, and the file must be saved by PowerPoint (docProps/app.xml).
建议部分得分
20% titles; 25% alt/decorative; 30% reading order; 25% contrast and layout unchanged
R02.07.01.03-T19 Verify landmarks and headings with VoiceOver on iOS Safari
原始指令
On the iOS Simulator, navigate the sandbox clinic site with VoiceOver using the rotor (headings, landmarks, form controls). Fix the site's markup so the rotor exposes the heading outline and landmarks in input/structure_spec.md and every form control has a label, then re-verify.
- 平台
mac· macOSios· iOS/iPadOS- 应用
- VoiceOver · iOS Simulator · Safari
- 交互表面
mob· 移动触控term· 终端- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
HY· 混合- 交互原语
touch· 触控手势code· 代码与命令- 工作产物
WP06· 代码 / 工程- 条件
- 未声明
- 提案难度
- 4 / 5
建议验证方式
Grader extracts the Safari accessibility tree via WebKit inspector protocol: heading levels/texts and landmarks match spec order exactly; form controls labelled. VoiceOver rotor traversal (XCUITest-driven) lists the same headings.
建议部分得分
40% heading outline; 30% landmarks; 20% labels; 10% rotor verification
R02.07.01.03-T20 Bring a legacy jQuery app to WCAG 2.2 AA across 12 pages
原始指令
Remediate the legacy jQuery app fixtures/permits (12 pages: forms, tabs, accordions, data grid, file upload, modal workflows) to WCAG 2.2 AA. Use axe, keyboard testing and NVDA, and keep all existing Cypress functional tests green.
- 平台
win· Windowsweb· 任意系统(网页)- 应用
- axe DevTools · NVDA · Chrome
- 交互表面
brow· 浏览器- GUI 需求 · 任务设定
HY· 混合- GUI 需求 · 普通权限
HY· 混合- 交互原语
code· 代码与命令key· 快捷键vis· 视觉判断- 工作产物
WP06· 代码 / 工程- 条件
long· 长流程- 提案难度
- 5 / 5
建议验证方式
Grader: axe zero violations on all 12 pages; hidden keyboard and NVDA speech tests (60 checks: tab order, widget patterns, status messages, target size 24 px) pass rate; Cypress suite green. Visual diff SSIM ≥0.95 per page.
建议部分得分
30% axe clean; 45% keyboard/NVDA checks; 15% functional tests green; 10% visuals preserved
已有研究映射
当前映射未给此小类指定基准参考。