帮助团队在 VS Code 功能与界面开发中落实无障碍设计与可访问性要求。
复制安装指令,让 AI 自动完成配置 · 推荐新手
请帮我安装 askskill 上的 "accessibility" 技能: 1. 下载 https://raw.githubusercontent.com/microsoft/vscode/main/.github/skills/accessibility/SKILL.md 2. 保存为 ~/.claude/skills/accessibility/SKILL.md 3. 装好后重载技能,告诉我可以用了
请根据 VS Code 的 accessibility 技能要求,检查这个新功能方案是否满足无障碍标准,重点覆盖键盘导航、ARIA 标签与角色、可访问视图、提示公告和 verbosity 设置,并给出改进建议。
一份无障碍检查清单,指出风险点、缺失项和可执行的改进建议。
我正在更新一个现有 VS Code 界面。请从 accessibility 技能角度审查它在 ARIA announcements、键盘操作顺序、信号提示和帮助对话框方面的问题,并输出修改建议。
针对现有界面的可访问性问题分析,以及按优先级排序的修改方案。
请为这次 VS Code 功能提交生成一份代码评审用的无障碍检查项,涵盖 ARIA labels/roles、键盘导航、accessible views、signals 和 verbosity settings,适合开发者逐项核对。
一份适合代码评审使用的无障碍核对清单,便于开发者逐项检查。
Use this skill for any VS Code feature work that introduces or changes interactive UI. Use this skill by default for new features and contributions, including when the request does not explicitly mention accessibility.
Trigger examples:
Do not skip this skill just because accessibility is not named in the prompt.
When adding a new interactive UI surface to VS Code — a panel, view, widget, editor overlay, dialog, or any rich focusable component the user interacts with — you must provide three accessibility components (if they do not already exist for the feature):
Examples of existing features that have all three: the terminal, chat panel, notebook, diff editor, inline completions, comments, , , and . Features with only a help dialog (no accessible view) include , , , , and .
Sections 4–7 below (signals, ARIA announcements, keyboard navigation, ARIA labels) apply more broadly to any UI change, including modifications to existing features.
When updating an existing feature — for example, adding new commands, keyboard shortcuts, or interactive capabilities — you must also update the feature's existing accessibility help dialog (provideContent()) to document the new functionality. Screen reader users rely on the help dialog as the primary way to discover available actions.
An accessibility help dialog tells the user what the feature does, which keyboard shortcuts are available, and how to interact with it via a screen reader.
Create a class implementing IAccessibleViewImplementation with type = AccessibleViewType.Help.
priority (higher = shown first when multiple providers match).when to a ContextKeyExpression that matches when the feature is focused.getProvider(accessor) returns an AccessibleContentProvider.Create a content-provider class implementing IAccessibleViewContentProvider.
id — add a new entry in the AccessibleViewProviderId enum in src/vs/platform/accessibility/browser/accessibleView.ts.verbositySettingKey — reference the new AccessibilityVerbositySettingId entry (see §3).options — { type: AccessibleViewType.Help }.provideContent() — return localized, multi-line help text.Implement onClose() to restore focus to whatever element was focused before the help dialog opened. This ensures keyboard users and screen reader users return to their previous context.
Register the implementation:
AccessibleViewRegistry.register(new MyFeatureAccessibilityHelp());
in the feature's *.contribution.ts file.
The simplest approach is to return an AccessibleContentProvider directly from getProvider(). This is the most common pattern in the codebase (used by chat, inline chat, quick chat, etc.):
import { AccessibleViewType, AccessibleContentProvider, AccessibleViewProviderId } from '../../../../platform/accessibility/browser/accessibleView.js';
import { IAccessibleViewImplementation } from '../../../../platform/accessibility/browser/accessibleViewRegistry.js';
…
帮助开发者验证 Azure DevOps 流水线改动,快速排查构建与 YAML 配置问题。
帮助团队扫描本地网页无障碍问题,并生成符合 WCAG 2.1 的修复建议。