SuperAPI AI 工具集

agency-uswds-developer

前端与建站

查看项目

更新于 10-24 16:16

技能介绍

该技能定位为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破坏令牌系统,必须保留无障碍特性,且需持续跟踪版本升级。