Web Accessibility (hay còn gọi là a11y — viết tắt của accessibility, 11 chữ cái ở giữa chữ a đầu và y cuối) là việc thiết kế và phát triển website sao cho mọi người đều có thể sử dụng, bao gồm cả người khuyết tật. Mình nghĩ đây là một trong những chủ đề bị xem nhẹ nhất trong web development, dù ảnh hưởng đến khoảng 1,3 tỷ người trên thế giới.
Web Accessibility Là Gì?
Web Accessibility là thực hành xây dựng website, ứng dụng web và công cụ số sao cho người khuyết tật có thể cảm nhận, hiểu, điều hướng và tương tác đầy đủ. Khái niệm này không chỉ giới hạn ở người mù hay điếc, mà bao gồm cả người có vấn đề về vận động (không dùng chuột được), suy giảm nhận thức, hay đơn giản là người lớn tuổi dùng công nghệ không thuận thạo.
Nói đơn giản: website accessible là website ai cũng dùng được, không bị rào cản.
Tại Sao Web Accessibility Quan Trọng?
Có ba lý do chính khiến mình nghĩ accessibility không phải tùy chọn:
1. Về mặt đạo đức: Internet là nơi mọi người tiếp cận thông tin, học tập, mua sắm, làm việc. Nếu website không accessible, bạn đang vô tình loại bỏ một bộ phận người dùng khỏi không gian số. Mình luôn nghĩ rằng xây dựng web accessible là điều đúng đắn cần làm, giống như xây ramp cho xe lăn ở cầu thang vậy.
2. Về mặt pháp lý: Nhiều quốc gia đã luật hóa accessibility. Mỹ có ADA (Americans with Disabilities Act), châu Âu có European Accessibility Act (bắt đầu áp dụng 2025), Việt Nam có Luật Người khuyết tật 2010. Năm 2025, các doanh nghiệp EU bị phạt nếu website không đạt chuẩn WCAG 2.1 AA.
3. Về mặt kinh doanh: 1,3 tỷ người khuyết tật toàn cầu là thị trường khổng lồ. Thêm vào đó, Google ưu tiên website accessible trong kết quả tìm kiếm — nhiều nguyên tắc SEO trùng hợp với accessibility (semantic HTML, alt text, cấu trúc rõ ràng).
WCAG Là Gì? Bốn Nguyên Tắc Cốt Lõi
WCAG (Web Content Accessibility Guidelines) là bộ tiêu chuẩn quốc tế do W3C ban hành. Phiên bản mới nhất hiện tại là WCAG 2.2 (ra mắt 2023). WCAG xoay quanh bốn nguyên tắc, nhớ theo từ POUR:
Perceivable (Có thể cảm nhận): Nội dung phải hiển thị được cho người dùng bằng ít nhất một giác quan. Ví dụ: hình ảnh phải có alt text để screen reader đọc lên, video phải có phụ đề cho người khiếm thính.
Operable (Có thể vận hành): Mọi chức năng phải thao tác được. Không phải ai cũng dùng chuột — nhiều người chỉ dùng bàn phím hoặc phần mềm nhận diện giọng nói. Menu, form, button đều phải tab được bằng keyboard.
Understandable (Có thể hiểu): Nội dung và cách vận hành phải rõ ràng. Ngôn ngữ đơn giản, form có hướng dẫn cụ thể, lỗi nhập liệu có thông báo dễ hiểu (không hiện mã lỗi technical).
Robust (Mạnh mẽ): Website phải tương thích với nhiều công nghệ hỗ trợ khác nhau — screen reader (NVDA, JAWS, VoiceOver), phần mềm phóng to, công cụ nhận diện giọng nói.
Các Cấp Độ WCAG: A, AA, AAA
WCAG chia thành ba cấp độ tuân thủ:
Cấp A: Yêu cầu tối thiểu (ví dụ: không được dùng màu làm phương tiện duy nhất để truyền thông tin). Hầu hết website hiện đại vượt qua cấp này dễ dàng.
Cấp AA: Tiêu chuẩn phổ biến nhất, được luật pháp nhiều nước yêu cầu (contrast tối thiểu 4.5:1, resize text 200%, không có lỗi keyboard trap). Đây là mục tiêu mình khuyên mọi dự án nên nhắm đến.
Cấp AAA: Cao nhất, rất khó đạt hoàn toàn cho toàn bộ website (contrast 7:1, ngôn ngữ cấp lớp đọc thấp hơn, sign language cho video). Thường chỉ áp dụng cho từng phần cụ thể.
Các Vấn Đề Accessible Thường Gặp Nhất
Qua kinh nghiệm làm web, mình thấy vài lỗi dưới đây lặp đi lặp lại nhiều nhất:
1. Thiếu alt text: Hình ảnh không có thuộc tính alt, khiến screen reader không biết hình đó là gì. Hình trang trí dùng alt=”” (empty), hình nội dung phải mô tả cụ thể.
2. Tương phản màu kém: Chữ xám nhạt trên nền trắng trông đẹp nhưng người suy giảm thị lực không đọc được. Công cụ kiểm tra: WebAIM Contrast Checker.
3. Không điều hướng được bằng keyboard: Menu dropdown chỉ mở bằng chuột, người dùng bàn phím bị kẹt. Hãy thử tắt chuột và chỉ dùng phím tab để duyệt website của bạn.
4. Form không có label: Ô nhập liệu chỉ có placeholder chứ không có <label>, screen reader không biết cần nhập gì. Placeholder không thay thế được label.
5. heading levels lộn xộn: Nhảy từ H1 sang H4, bỏ qua H2, H3. Screen reader dùng heading structure để điều hướng — cần tuần tự logic.
Cách Kiểm Tra Accessible Trên Website
Bạn không cần là chuyên gia mới kiểm tra được accessibility. Dưới đây là các công cụ mình dùng thường xuyên:
Lighthouse: Tích hợp sẵn trong Chrome DevTools, chạy audit accessibility nhanh. Điểm 90+ là mục tiêu tốt. Đã có bài riêng về Lighthouse trên blog.
WAVE (wave.webaim.org): Extension miễn phí, highlight trực tiếp lỗi trên trang — thiếu contrast, missing alt, structural issue.
axe DevTools: Extension mạnh hơn, tích hợp được vào CI/CD pipeline để kiểm tra tự động.
Kiểm tra thủ công: Tắt chuột duyệt web bằng keyboard, phóng to trình duyệt 200%, tắt CSS xem cấu trúc semantic có ổn không. Kiểm tra thủ công thường phát hiện lỗi mà công cụ tự động bỏ sót.
ARIA Là Gì? Khi Nào Cần Dùng?
ARIA (Accessible Rich Internet Applications) là tập thuộc tính HTML bổ sung giúp screen reader hiểu các thành phần phức tạp như modal, tab, accordion, live region. Ví dụ: aria-label, role="dialog", aria-expanded="true".
Nhưng có một nguyên tắc quan trọng mình muốn nhấn mạnh: sử dụng semantic HTML trước, ARIA sau. Nếu đã có thẻ HTML đúng (<button>, <nav>, <main>), không cần ARIA. Nguyên tắc số 1 trong community là “No ARIA is better than bad ARIA” — ARIA dùng sai còn tệ hơn không dùng.
Nói về HTML semantic, đây chính là nền tảng đầu tiên của accessibility. Nếu bạn viết HTML chuẩn, bạn đã giải quyết được 60-70% vấn đề rồi.
Accessible Và SEO Có Liên Quan Gì Không?
Nhiều hơn bạn nghĩ. Mình luôn nói với team rằng tốt cho accessibility thường đồng nghĩa với tốt cho SEO:
Semantic HTML giúp cả Googlebot và screen reader hiểu cấu trúc. Alt text giúp hình ảnh xuất hiện trong Google Images. Heading structure rõ ràng giúp Google parse nội dung. Tốc độ tải nhanh (xem bài Page Speed) tốt cho cả user experience lẫn core web vitals.
Đặc biệt năm 2026, khi AI search engine (ChatGPT, Perplexity, Gemini) ngày càng quan trọng, cấu trúc nội dung rõ ràng giúp AI hiểu và trích dẫn tốt hơn. Accessible website = máy móc dễ đọc = SEO tốt hơn.
Cách Bắt Đầu Làm Website Accessible
Nếu bạn chưa từng quan tâm accessibility, đây là checklist mình gợi ý cho tuần đầu tiên:
Bước 1: Chạy Lighthouse audit trên 5 trang quan trọng nhất của website. Xem điểm accessibility và danh sách lỗi cụ thể.
Bước 2: Sửa lỗi dễ trước — thêm alt text cho hình ảnh, sửa contrast, thêm label cho form. Đây là những fix nhanh nhưng tác động lớn.
Bước 3: Kiểm tra keyboard navigation. Tắt chuột, chỉ dùng phím tab để duyệt website. Nếu bị kẹt ở đâu, sửa ngay chỗ đó.
Bước 4: Audit CSS — đảm bảo font size tối thiểu 16px, line-height 1.5, focus visible rõ ràng.
Bước 5: Đặt mục tiêu đạt WCAG 2.1 AA cho toàn bộ website trong 3-6 tháng. Nếu làm Responsive Design rồi thì accessibility là bước tiếp theo tự nhiên.
Kết Luận
Web Accessibility không phải tính năng thêm vào, mà là tiêu chuẩn cơ bản của web development. Bắt đầu từ semantic HTML, đảm bảo keyboard navigation, kiểm tra contrast, chạy audit định kỳ — bạn đã đi được 80% quãng đường.20% còn lại là các case phức tạp cần chuyên gia, nhưng 80% đầu ai cũng làm được.
Mình tin rằng web accessible là web tốt hơn cho tất cả mọi người, không chỉ người khuyết tật. Khi bạn làm cho website rõ ràng hơn, dễ dùng hơn, nhanh hơn — toàn bộ người dùng đều được hưởng lợi.
Thuật ngữ liên quan
- .htaccess Là Gì? Tệp Cấu Hình Apache Giải Thích Dễ Hiểu Cho Người Mới
- 301 Redirect Là Gì? Hướng Dẫn Chuyển Hướng URL Không Mất SEO
- Adam Optimizer Là Gì? Giải Thích Dễ Hiểu Về Bộ Tối Ưu Hàng Đầu Deep Learning
- Adapter Layer (Lớp Adapter) Là Gì? Giải Thích Dễ Hiểu Cho Người Mới
- Adversarial Training (Huấn Luyện Đối Kháng) Là Gì? Giải Thích Dễ Hiểu Cho Người Mới
Xem toàn bộ thư viện thuật ngữ AI & SEO A-Z.
