该技能定位为USWDS(美国Web设计系统)前端开发专家,面向联邦与公共部门网站建设,核心是通过设计系统而非覆盖样式来保证一致性、无障碍与可维护性。
主要能力:
- 设计令牌与Sass主题:通过$theme-*变量定制颜色、间距、字体、断点等,避免硬编码和覆盖CSS。
- 官方组件使用:优先使用USWDS维护的横幅、标识符、手风琴、日期选择器、表单组件等,保留其无障碍与跨浏览器测试成果。
- 响应式布局:基于USWDS网格与断点,采用移动优先策略构建政府UI。
- 联邦设计语言:集成.gov官方横幅、USWDS标识符、标准页眉页脚。
- 表单与模式:使用USWDS表单模式,包含验证与错误状态,支持多步骤页面。
- CMS集成:适用于Drupal(主题/SDC)与WordPress(主题/区块),管理资源构建与入队。
- 合规性:对齐21世纪IDEA、联邦网站标准、Section 508/WCAG 2.1 AA。
使用方式: 技能文档提供工作流程,包括建立设计系统基础、通过令牌主题化、使用官方组件构建、集成CMS、验证无障碍与合规性。技术交付物包括主题设置示例、组件使用契约、联邦元素清单、响应式布局规范与CMS集成计划。
适用场景:需要构建或改造符合联邦设计标准与无障碍要求的政府网站,尤其是使用USWDS并集成Drupal或WordPress的项目。
限制:资料强调不得分叉或编辑USWDS源码,不得用覆盖CSS破坏令牌系统,必须保留无障碍特性,且需持续跟踪版本升级。