القائمة
評估與改善介面、內容與互動的無障礙品質,使產品更符合 WCAG 與包容性設計原則。當任務涉及對比度、鍵盤操作、語意化、表單可用性、螢幕閱讀器支援或 a11y 檢查時使用。
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
收斂洞察、界定問題、優先順序與成功指標，並確認限制條件（含可及性/a11y）。
蒐集使用者洞察、執行訪談並萃取人物誌與需求背景，建立對目標族群的同理心。
發散解法、繪製線框並探索視覺方向；內含 20 種 UI 風格參考以快速收斂。
將優選解法轉成可操作原型，設定互動、轉場與狀態，為測試與示範做準備。
建立與維護設計系統、Design Tokens、元件規範與文件結構,提升產品一致性與跨團隊協作效率。當任務涉及元件庫、樣式規範、token、文件化、系統治理或跨產品一致性時使用。
規劃資訊架構、內容層級與導航結構,讓使用者更容易理解與找到資訊。當任務涉及網站地圖、內容分類、導航重組、卡片分類、tree testing 或大型內容結構設計時使用。
| name | accessibility-design |
| description | 評估與改善介面、內容與互動的無障礙品質,使產品更符合 WCAG 與包容性設計原則。當任務涉及對比度、鍵盤操作、語意化、表單可用性、螢幕閱讀器支援或 a11y 檢查時使用。 |
| license | MIT |
| metadata | {"author":"goodux","version":"1.0.0","category":"accessibility","language":"zh-TW"} |
檢查並改善介面的可感知、可操作、可理解與穩健性,讓產品更符合 WCAG 與真實使用限制。
design-system: 把無障礙規範沉澱到元件與 token 中usability-testing: 邀請不同能力的使用者驗證改善方案wireframing: 在早期調整版面與流程避免後期返工prototyping: 模擬焦點流、錯誤回饋與狀態變化# A11y 檢查結果
- 目標標準: WCAG 2.1 AA
- 高風險問題: 焦點不明顯、錯誤訊息未被朗讀、表單缺 label
修正建議:
- 所有按鈕加入可見 focus 樣式
- 錯誤訊息與欄位透過 aria-describedby 關聯
- 圖示按鈕補 aria-label
本技能提供完整的無障礙設計範例庫，請參考 examples.yaml：
使用方式：使用檢查清單逐項檢查，參考 ARIA 模式實作無障礙元件。
TEMPLATE.md，確認欄位結構、最小必要欄位、品質標準與驗證方式。examples.yaml，從既有檢查清單、ARIA 模式、測試方式與問題解法中選取最適合的內容。TEMPLATE.md 的格式與命名規則，避免建立重複或標準不一致的檢查項。TEMPLATE.md 的格式要求，其次再引用 examples.yaml 的內容細節。