SuperAPI AI 工具集

ui-ux-specialist

前端与建站

查看项目

更新于 10-16 02:21

技能介绍

用途

ui-ux-specialist(v1.1.0)是一个无障碍与前端体验方向的专业技能,自我定位为“资深无障碍与前端工程师”,专注 WCAG 2.2 标准、语义化 HTML 与包容性设计,面向 2026 年的前端实践。其主张是:在 2026 年,无障碍不是一项“功能”,而是一项人权与法律要求,因此该技能聚焦于构建语义化、可键盘导航、高性能的界面,让所有用户无论身体或认知能力如何都能使用。

主要能力与关注点

技能列出了前端卓越的若干优先级:语义完整性(为正确的任务使用正确的 HTML 标签,拒绝“纯 div”界面)、键盘可导航性(每个交互元素都能通过 Tab/Enter/Space 到达并操作)、视觉清晰度(高对比度、清晰的焦点指示、一致的排版)、错误韧性(宽容的表单与清晰的错误恢复路径)以及性能预算(确保无障碍特性不会拖慢加载时间)。

反面模式清单

技能给出“Do Not”清单,说明哪些做法在 2026 年已不可取及现代化替代方案:div 按钮对屏幕阅读器和键盘用户不可见,应使用 button 或 role=button;固定字号对视力障碍用户不友好,应使用 rem 与响应式缩放;仅靠颜色表达状态对色盲用户不可访问,应辅以图标与文本标签;缺少焦点环会让键盘用户困惑,应使用 focus-visible 高对比度焦点环;自动播放视频对认知或前庭障碍用户造成不适,应使用 prefers-reduced-motion。

标准与实现要点

WCAG 2.2 AA 合规在该技能中被视为强制要求,涉及:目标尺寸(所有触控/点击区域最小 24x24px)、焦点保留(指示器不得被覆盖层遮挡)、对比度(文本 4.5:1,UI 元素 3:1)。在语义 HTML 与 ARIA 方面,强调使用 main、nav、aside 等地标,仅在原生 HTML 不足时使用 ARIA,表单使用显式标签并用 aria-describedby 提供提示。技能还提到响应式与流式交互、包容性设计模式等章节。

参考库

技能提供 UI/UX 实现的深入参考,包括 WCAG 2.2 标准(合规与成功标准)、语义 HTML 与 ARIA(构建坚实基础)、包容性设计(为人类多样性而设计)、UI 模式(视觉与结构设计标准)。

使用方式与限制

该技能通过技能目录页面发布,来源为 yuniorglez/gemini-elite-core。资料未提供具体安装命令、调用步骤、收费方式、支持的平台或集成方式,这些信息暂未提供。适用场景为需要按 WCAG 2.2 标准审查或构建前端界面、提升键盘可操作性与语义结构、实施包容性设计的开发任务。