正在打开每日关注
正在打开每日关注
先统一组件与样式令牌,再在组件库层修复无障碍并通过多设备核心路径验收。
𝟮. 𝗱𝗲𝘀𝗶𝗴𝗻 𝘀𝘆𝘀𝘁𝗲𝗺, 𝘁𝗵𝗲𝗻 𝗮𝗰𝗰𝗲𝘀𝘀𝗶𝗯𝗶𝗹𝗶𝘁𝘆 𝗶𝗻 𝘁𝗵𝗲 𝗹𝗶𝗯𝗿𝗮𝗿𝘆 task: pull the scattered UI components, style tokens and repeated interactions into one component library. hand-rolled one-offs get replaced, all new UI goes through the library, no bypassing. this is a refactor, so start in a worktree. then: fix accessibility at the library layer. contrast, font scaling, keyboard (Tab / Enter / Space / Esc), focus states, and the semantics of images, icon buttons, forms and status. verify: start the app locally from the current commit and walk the core paths at desktop, tablet and phone. overlap, overflow, truncation, horizontal scroll, fix them one by one. finish: record what changed and what risk is left, then write a review skill you run before touching UI next time. done = low-vision, keyboard-only and different-device users can complete the core actions. run this through the goal wrapper. fix it in the library and 𝗲𝘃𝗲𝗿𝘆 𝗰𝗼𝗺𝗽𝗼𝗻𝗲𝗻𝘁 𝘂𝘀𝗶𝗻𝗴 𝗶𝘁 𝗶𝗻𝗵𝗲𝗿𝗶𝘁𝘀. page-level still needs its own pass: heading order, where focus lands after routing, live regions, image alt.
是什么 这是一条面向真实前端代码库的设计系统与无障碍改造方法论。它要求把分散的 UI 组件、样式令牌和重复交互集中到组件库,并以当前提交为基线在独立 worktree 中推进,降低重构对主线的干扰。
核心设计 组件库被当作体验治理边界:替换一次性实现,新 UI 不得绕过库层。对比度、字体缩放、Tab/Enter/Space/Esc、焦点状态,以及图片、图标按钮、表单和状态语义,应成为基础组件的默认能力;页面层再处理标题层级、路由后的焦点落点和 live region。桌面、平板、手机的核心路径要逐项检查重叠、溢出、截断与横向滚动。
关键洞察 无障碍不是发布前的补丁,而是组件契约、交互质量和完成标准。把低视力、键盘操作与多设备验证放进同一闭环,才能确认用户真的能完成核心动作。
边界与风险 这是纯观点推文,没有仓库或视觉证据,不能证明具体实现已合规;“goal wrapper”也未定义。库层修复仍可能被上下文样式、复杂状态或第三方控件绕过,应补充自动化语义/键盘测试、真实设备验证,并记录未覆盖路径和残余风险。