accessibility-compliance

Tổng quan

accessibility-compliance là gì?

accessibility-compliance là một kỹ năng thiết thực dành cho các nhà phát triển frontend cần triển khai, kiểm tra hoặc duy trì giao diện người dùng có khả năng truy cập. Nó tập trung vào các hướng dẫn WCAG 2.2, mẫu ARIA, điều hướng bằng bàn phím, hỗ trợ trình đọc màn hình và khả năng truy cập trên thiết bị di động. Kỹ năng này giúp đảm bảo các dự án web hoặc React của bạn có thể sử dụng được cho tất cả mọi người, bao gồm cả người khuyết tật.

Ai nên sử dụng kỹ năng này?

• Kỹ sư frontend xây dựng hoặc tái cấu trúc các thành phần giao diện
• Các nhóm hướng tới tuân thủ WCAG 2.2 cấp độ AA hoặc AAA
• Nhà phát triển thêm các vai trò, trạng thái và thuộc tính ARIA
• Bất kỳ ai chịu trách nhiệm kiểm tra khả năng truy cập hoặc thiết kế bao gồm

Các vấn đề được giải quyết

• Đảm bảo giao diện có thể nhận biết, vận hành, hiểu được và bền vững
• Cung cấp các mẫu ARIA thực tiễn và kỹ thuật truy cập trên thiết bị di động
• Giúp bạn xây dựng cho người dùng bàn phím, trình đọc màn hình và cảm ứng
• Hỗ trợ tuân thủ các tiêu chuẩn khả năng truy cập pháp lý và tổ chức

Cách sử dụng

Các bước cài đặt

1. Thêm kỹ năng vào agent hoặc dự án của bạn bằng lệnh:

   npx skills add https://github.com/wshobson/agents --skill accessibility-compliance
   

2. Bắt đầu với tệp SKILL.md để có cái nhìn tổng quan về các tính năng và quy trình của accessibility-compliance.

3. Xem xét các tệp hỗ trợ để biết chi tiết triển khai:

   • references/aria-patterns.md: Vai trò, trạng thái và thuộc tính ARIA kèm ví dụ React
   • references/mobile-accessibility.md: Kích thước mục tiêu cảm ứng, khoảng cách và hỗ trợ trình đọc màn hình trên thiết bị di động
   • references/wcag-guidelines.md: Nguyên tắc WCAG 2.2, mức độ tuân thủ và mẫu mã

Điều chỉnh cho dự án của bạn

• Sử dụng các mẫu được cung cấp làm tham khảo, không phải giải pháp thay thế trực tiếp. Điều chỉnh ARIA, điều hướng bàn phím và kỹ thuật truy cập di động phù hợp với mã nguồn và framework giao diện của bạn.
• Tích hợp kiểm tra khả năng truy cập vào quy trình phát triển, đặc biệt khi xây dựng các thành phần hoặc biểu mẫu tùy chỉnh.
• Kiểm thử với các công nghệ hỗ trợ thực tế (ví dụ: VoiceOver, TalkBack, NVDA) và điều hướng bằng bàn phím.

Khi nào nên dùng accessibility-compliance

• Kiểm tra hoặc khắc phục các vấn đề về khả năng truy cập
• Xây dựng các thành phần giao diện mới với thiết kế bao gồm
• Đảm bảo tính nhất quán khả năng truy cập giữa di động và máy tính để bàn
• Đáp ứng yêu cầu khả năng truy cập của tổ chức hoặc pháp luật

Câu hỏi thường gặp

accessibility-compliance bao gồm những gì?

Kỹ năng này bao gồm các hướng dẫn WCAG 2.2, mẫu ARIA, điều hướng bàn phím, quản lý tiêu điểm, biểu mẫu truy cập, mục tiêu cảm ứng trên di động và hỗ trợ trình đọc màn hình. Nó cung cấp ví dụ mã và thực hành tốt nhất cho dự án React và web.

Tôi nên bắt đầu từ đâu?

Bắt đầu với SKILL.md để có cái nhìn tổng quan, sau đó khám phá thư mục references/ để xem các mẫu và ví dụ mã chi tiết. Các tệp references/aria-patterns.md và references/mobile-accessibility.md đặc biệt hữu ích cho việc triển khai thực tế.

Kỹ năng này chỉ dành cho React phải không?

Mặc dù nhiều ví dụ sử dụng React, các nguyên tắc và mẫu áp dụng cho bất kỳ framework frontend nào hoặc dự án vanilla HTML/JS.

Kỹ năng này có đảm bảo tuân thủ WCAG không?

Không. accessibility-compliance cung cấp hướng dẫn và mẫu, nhưng bạn cần điều chỉnh và kiểm thử trong bối cảnh của mình. Luôn xác thực với người dùng thực và công nghệ hỗ trợ.

Tôi có thể tìm thêm tài nguyên ở đâu?

Xem thư mục references/ để có các hướng dẫn và ví dụ mã được tuyển chọn. Để xem danh sách tệp đầy đủ, mở tab Files trong Agent Skills Finder.