Website dễ tiếp cận: danh sách kiểm tra WCAG 2.2 trước khi vận hành

Bài viết giúp chủ doanh nghiệp và marketing team kiểm khả năng tiếp cận của website trước khi vận hành: màu chữ, alt text, heading, form, bàn phím, mobile và các điểm mới trong WCAG 2.2.

Bạn đã từng duyệt một website rất đẹp nhưng chữ quá nhạt, menu khó bấm trên điện thoại, hoặc form báo lỗi mà không nói rõ phải sửa gì chưa? Đó không chỉ là lỗi thẩm mỹ. Đó là dấu hiệu khả năng tiếp cận của website chưa đủ tốt.

Website dễ tiếp cận là phần nên được kiểm trước khi vận hành, giống như kiểm tốc độ, SEO kỹ thuật hay bảo mật cơ bản. Bài này giúp bạn dùng WCAG 2.2 theo cách thực tế: không cần đọc toàn bộ tiêu chuẩn, nhưng vẫn biết những điểm quan trọng phải nghiệm thu. Cùng xem nhé!

Khả năng tiếp cận của website theo checklist WCAG 2.2 trước khi vận hành — Website dễ tiếp cận nên được kiểm trước khi vận hành, không đợi đến khi người dùng gặp lỗi.

Tóm tắt nhanh

Website dễ tiếp cận là website dễ đọc, dễ điều hướng và dễ thao tác cho nhiều nhóm người dùng, thiết bị và hoàn cảnh sử dụng.
WCAG 2.2 là khung tham chiếu để kiểm các điểm như bàn phím, trạng thái focus, form, độ tương phản, vùng bấm và xác thực.
Trước khi vận hành, bạn nên kiểm thủ công cùng tool tự động vì tool chỉ bắt được một phần lỗi.
Lỗi phổ biến thường nằm ở chữ thiếu tương phản, thiếu alt text, form không có label và trạng thái focus không rõ.
Checklist tốt nhất nên gắn vào quy trình nghiệm thu website, không xử lý như việc phụ sau bàn giao.

Khả năng tiếp cận của website là gì?

Website dễ tiếp cận là website có thể được sử dụng bởi nhiều người nhất có thể, bao gồm người dùng bàn phím, người dùng trình đọc màn hình, người lớn tuổi, người dùng mobile và người đang ở môi trường khó thao tác. Nói đơn giản: website không chỉ đẹp, mà phải dùng được.

WCAG viết tắt của Web Content Accessibility Guidelines, một bộ hướng dẫn do W3C phát triển để giúp nội dung web dễ tiếp cận hơn [1]. Với doanh nghiệp, bạn không cần biến buổi nghiệm thu thành lớp học tiêu chuẩn. Nhưng bạn cần biết các tình huống rủi ro: người dùng không thấy nút, không tab được đến form, không hiểu lỗi, hoặc không hoàn tất đăng ký.

Website dễ tiếp cận: Khả năng website hỗ trợ người dùng đọc, hiểu, điều hướng và hoàn thành tác vụ mà không bị chặn bởi giao diện, nội dung, thiết bị hoặc cách tương tác.

Điểm thú vị là tiêu chí dễ tiếp cận không chỉ phục vụ người khuyết tật. Chữ có tương phản tốt cũng giúp người dùng đọc ngoài trời. Nút đủ lớn giúp thao tác trên điện thoại dễ hơn. Form có label rõ giúp giảm lead lỗi. Vì vậy, website dễ tiếp cận là một phần của chất lượng UX và conversion, không phải một hạng mục trang trí.

Sơ đồ website dễ tiếp cận cho nhiều nhóm người dùng và thiết bị — Khả năng tiếp cận tốt giúp nhiều nhóm người dùng hoàn thành tác vụ dễ hơn.

WCAG 2.2 cần kiểm gì trước khi vận hành?

Với website doanh nghiệp, WCAG 2.2 nên được dùng như checklist nghiệm thu các điểm có ảnh hưởng trực tiếp đến thao tác: focus, target size, dragging, help, form nhập lại và authentication. Đây là lớp bổ sung quan trọng so với cách kiểm giao diện chỉ nhìn bằng mắt.

Theo W3C WAI, WCAG 2.2 bổ sung các tiêu chí như Focus Not Obscured, Focus Appearance, Dragging Movements, Target Size, Consistent Help, Redundant Entry và Accessible Authentication [2]. Dịch sang ngôn ngữ thực tế, bạn cần hỏi:

Khi tab qua trang, người dùng có thấy rõ đang đứng ở đâu không?
Nút và vùng bấm trên mobile có đủ lớn, đủ khoảng cách không?
Có thao tác nào bắt buộc kéo-thả trong khi có thể thay bằng bấm/chọn không?
Nếu website có hotline, chat, form hỗ trợ, vị trí hỗ trợ có nhất quán không?
Form nhiều bước có bắt người dùng nhập lại thông tin đã cung cấp không?
Đăng nhập hoặc xác thực có bắt người dùng giải câu đố quá khó không?

Đừng lo nếu đội của bạn chưa thể đạt mọi tiêu chí ở mức cao nhất ngay từ đầu. Với một dự án thiết kế website trọn gói, mục tiêu hợp lý là đưa tiêu chí dễ tiếp cận vào phần nghiệm thu: template chính được kiểm, lỗi quan trọng được sửa, và các giới hạn còn lại được ghi rõ.

Checklist WCAG 2.2 về focus target size form và xác thực — WCAG 2.2 nhấn mạnh nhiều tình huống thao tác thực tế trước khi vận hành.

Checklist nghiệm thu website dễ tiếp cận

Checklist thực tế nên bắt đầu từ những lỗi người dùng gặp nhiều nhất: tiêu đề trang, heading, alt text, độ tương phản, bàn phím, focus, form label và thông báo lỗi. Đây là nhóm điểm W3C Easy Checks khuyến nghị kiểm sớm khi review khả năng tiếp cận [3].

1. Page title và heading có mô tả đúng nội dung không?

Mỗi trang quan trọng nên có title riêng, không dùng chung kiểu “Trang chủ” hoặc “Dịch vụ”. Heading cũng cần theo thứ tự logic để người dùng và công cụ hỗ trợ hiểu cấu trúc. Nếu bạn đang làm lại website, hãy đưa phần này vào checklist nội dung ngay từ wireframe, giống như quy trình trong bài thiết kế website từ brief đến bàn giao.

2. Ảnh quan trọng có alt text đúng vai trò không?

Không phải ảnh nào cũng cần mô tả dài. Ảnh trang trí có thể để rỗng tùy cách triển khai, nhưng ảnh sản phẩm, biểu đồ, ảnh quy trình hoặc ảnh chứa thông tin cần alt text rõ. WebAIM Million 2026 ghi nhận 16.2% ảnh trên homepage bị thiếu alternative text [5]. Đây là lỗi nhỏ nhưng ảnh hưởng lớn đến khả năng hiểu nội dung.

3. Màu chữ và nền có đủ tương phản không?

Low contrast là lỗi rất phổ biến. WebAIM Million 2026 phát hiện 83.9% homepage có low contrast text [5]. Với doanh nghiệp, lỗi này thường xuất hiện ở chữ xám nhạt, text trên banner ảnh, placeholder form, hoặc nút phụ. Mình khuyên bạn kiểm bằng tool, rồi nhìn lại trên màn hình mobile thật để tránh trường hợp tool pass nhưng trải nghiệm vẫn khó đọc.

4. Website dùng được bằng bàn phím không?

Hãy mở trang, bấm phím Tab liên tục và tự hỏi: bạn có đi được qua menu, CTA, form, modal, footer không? Focus có bị mất trong popup không? Nút đóng modal có reachable không? Nếu không dùng chuột mà vẫn hoàn tất được tác vụ chính, website đã qua được một phần rất quan trọng.

5. Form có label, hướng dẫn và lỗi rõ ràng không?

W3C Forms Tutorial nhấn mạnh việc dùng label, instruction, validation và error message để người dùng biết phải nhập gì và sửa gì [6]. Đừng chỉ tô đỏ ô nhập. Hãy nói rõ: “Email chưa đúng định dạng” hoặc “Số điện thoại cần 10 chữ số”. Với form tạo lead, đây là điểm ảnh hưởng trực tiếp đến chuyển đổi.

Bạn đang đọc bài viết thuộc chuyên mục Thiết kế website của VietnamTutor — nơi mình chia sẻ cách xây dựng website doanh nghiệp dễ dùng, dễ vận hành và có thể đo hiệu quả sau khi triển khai.

Checklist nghiệm thu website dễ tiếp cận trước khi bàn giao — Checklist accessibility nên nằm trong bước nghiệm thu, không để sau launch mới xử lý.

Kiểm tra khả năng tiếp cận trên mobile thế nào?

Trên mobile, accessibility tập trung vào khả năng đọc, vùng bấm, trạng thái focus, text thay thế, hướng màn hình và việc giao diện không phụ thuộc vào một thao tác khó. MDN liệt kê các nhóm kiểm quan trọng như color, visibility, focus, text equivalents, state handling và orientation [4].

Mobile thường là nơi lỗi dễ lộ rõ nhất. Nút có thể đẹp trên desktop nhưng quá sát nhau trên điện thoại. Sticky bar có thể che nội dung. Popup chat có thể che CTA. Menu có thể mở được bằng chạm nhưng không có trạng thái rõ khi dùng thiết bị hỗ trợ.

Checklist mobile nên gồm các bước sau:

Kiểm chữ nhỏ, line-height và contrast trên màn hình 390px.
Kiểm CTA, menu, tab, checkbox và radio có đủ dễ bấm bằng ngón tay không.
Kiểm nội dung không bị khóa ở một hướng xoay màn hình nếu không có lý do chính đáng.
Kiểm form không bị bàn phím ảo che nút submit hoặc thông báo lỗi.
Kiểm banner, cookie bar, chat widget và sticky CTA không che focus hoặc nội dung quan trọng.

Nếu website của bạn là landing page chạy ads, trải nghiệm dễ dùng trên mobile càng quan trọng. Bạn có thể kết hợp checklist này với bài landing page optimization để kiểm cả trải nghiệm đọc, hành động chính và conversion.

Kiểm tra website dễ tiếp cận trên mobile trước khi vận hành — Mobile accessibility giúp người dùng thao tác dễ hơn trong điều kiện thực tế.

Tool tự động có đủ không?

Tool tự động hữu ích nhưng không đủ để kết luận một website accessible. Nó có thể phát hiện lỗi kỹ thuật như thiếu label, low contrast hoặc ảnh thiếu alt, nhưng không thể thay thế việc người thật kiểm luồng thao tác.

WebAIM Million 2026 phát hiện 56,114,377 lỗi về khả năng tiếp cận trên 1,000,000 homepage, trung bình 56.1 lỗi mỗi trang; 95.9% homepage có lỗi WCAG 2 có thể phát hiện tự động [5]. Con số này rất đáng chú ý, nhưng cũng cần hiểu đúng: WebAIM chỉ đo các lỗi mà hệ thống tự động phát hiện được trên homepage. Một trang không bị tool báo lỗi vẫn chưa chắc dễ tiếp cận đầy đủ.

Quy trình hợp lý là kết hợp 3 lớp:

Automated scan: dùng Lighthouse, axe DevTools hoặc công cụ tương tự để bắt lỗi dễ thấy.
Manual keyboard test: dùng Tab, Shift + Tab, Enter, Space và Escape để kiểm luồng chính.
Content review: đọc lại heading, alt text, label, thông báo lỗi và nội dung CTA bằng góc nhìn người dùng mới.

Thú vị nhỉ: nhiều lỗi dễ tiếp cận cũng là lỗi UX bình thường. Khi bạn sửa độ tương phản, heading, form và trạng thái lỗi, website thường dễ đọc hơn, rõ hơn và ít làm người dùng bỏ cuộc hơn.

So sánh kiểm khả năng tiếp cận website bằng tool tự động và kiểm thủ công — Tool tự động nên là bước đầu, không phải toàn bộ quá trình kiểm trải nghiệm dễ dùng.

Đưa checklist vào quy trình thiết kế website ra sao?

Cách làm bền vững là đưa tiêu chí dễ tiếp cận vào từng mốc thiết kế: brief, wireframe, UI, development, QA và bàn giao. Nếu đợi đến cuối dự án mới kiểm, chi phí sửa thường cao hơn và dễ bỏ sót những lỗi nằm trong cấu trúc giao diện.

Với dự án website doanh nghiệp, bạn có thể áp dụng luồng sau:

Brief: xác định nhóm người dùng chính, thiết bị phổ biến, tác vụ quan trọng và yêu cầu tuân thủ nếu có.
Wireframe: kiểm cấu trúc heading, thứ tự nội dung, vị trí form, CTA và khu vực hỗ trợ.
UI design: kiểm độ tương phản, cỡ chữ, spacing, trạng thái button, link, input, lỗi và focus.
Development: dùng HTML semantic, label đúng, alt text đúng, component không khóa bàn phím.
QA trước khi vận hành: scan tự động, test bàn phím, test mobile thật và review nội dung.
Bàn giao: ghi checklist pass/fail, lỗi còn lại, cách editor nhập alt text và cách kiểm khi thêm landing page mới.

Nếu website đang cũ, trải nghiệm dễ dùng cũng là tín hiệu tốt để quyết định khi nào doanh nghiệp cần thiết kế lại website. Một site đẹp nhưng khó đọc, khó bấm, form lỗi và mobile kém thường cần sửa trải nghiệm từ gốc.

Đừng quên liên kết trải nghiệm dễ dùng với hiệu năng. Một website dễ dùng nhưng tải chậm vẫn làm người dùng bỏ đi; ngược lại, website nhanh nhưng form khó điền cũng không tạo chuyển đổi tốt. Sau khi kiểm xong, bạn có thể tiếp tục kiểm Core Web Vitals cho WordPress để hoàn thiện checklist vận hành.

Nguồn tham khảo

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

Website dễ tiếp cận có phải chỉ dành cho người khuyết tật không?

Không. Website dễ tiếp cận hỗ trợ người khuyết tật, nhưng cũng giúp người dùng mobile, người lớn tuổi, người dùng bàn phím, người đọc trong môi trường ánh sáng mạnh và người cần hoàn tất tác vụ nhanh hơn.

WCAG 2.2 có bắt buộc với mọi website doanh nghiệp không?

Tùy thị trường và ngành, yêu cầu pháp lý có thể khác nhau. Nhưng ngay cả khi không bị bắt buộc, WCAG 2.2 vẫn là khung tham chiếu tốt để kiểm chất lượng UX, form, mobile và khả năng thao tác trước khi vận hành.

Có thể dùng Lighthouse để kết luận website đã accessible không?

Không nên. Lighthouse và các tool tự động giúp phát hiện lỗi nhanh, nhưng không kiểm được toàn bộ ngữ cảnh, luồng thao tác, chất lượng alt text, sự rõ ràng của nội dung hoặc trải nghiệm người dùng thực tế.

Checklist dễ tiếp cận nên kiểm ở thời điểm nào?

Nên kiểm nhiều lần: khi duyệt wireframe, khi duyệt UI, khi development xong template chính và ngay trước khi vận hành. Kiểm sớm giúp sửa lỗi rẻ hơn và tránh thay đổi lớn ở cuối dự án.

Lỗi về khả năng tiếp cận nào thường gặp nhất trên website doanh nghiệp?

Các lỗi thường gặp gồm chữ thiếu tương phản, ảnh thiếu alt text, form không có label, trạng thái focus không rõ, nút quá nhỏ trên mobile, thông báo lỗi mơ hồ và popup che nội dung hoặc CTA.

Accessibility có ảnh hưởng đến SEO không?

Accessibility không phải một nút SEO thần kỳ, nhưng nhiều thực hành tốt như heading rõ, alt text đúng, link dễ hiểu, nội dung dễ đọc và trải nghiệm mobile tốt đều hỗ trợ chất lượng trang và khả năng người dùng tương tác.

Website dễ tiếp cận không cần bắt đầu bằng một dự án quá lớn. Bạn có thể bắt đầu bằng checklist trước khi vận hành: độ tương phản, bàn phím, trạng thái focus, form, alt text, heading và mobile. Khi các điểm cơ bản này được kiểm đều đặn, website của bạn dễ dùng hơn cho phần lớn khách hàng. Hãy đưa checklist này vào buổi nghiệm thu nhé!