Kiểm tra khả năng truy cập website (WCAG) miễn phí

Kiểm tra URL hoặc HTML theo WCAG 2.2 A / AA bằng axe-core: thiếu alt ảnh, nhãn form, tên link và nút, lỗi ARIA, thứ tự heading và nhiều lỗi khác.

Kết quả

Bấm “Chạy” để xem kết quả.

Gửi html (mã nguồn trang) hoặc một url công khai. Trang được phân tích thành DOM mà không cần trình duyệt và kiểm tra bằng bộ quy tắc axe-core (Deque, MPL-2.0) theo level WCAG đã chọn (a, aa mặc định, aaa) cùng các thực hành tốt: alt của ảnh, nhãn form, tên link và nút, tiêu đề và ngôn ngữ trang, thứ tự heading, landmark, danh sách, bảng, role và giá trị thuộc tính ARIA, id ARIA trùng, giá trị autocomplete, chặn phóng to trong thẻ meta viewport, tiêu đề iframe…

Mỗi lỗi có mã quy tắc, impact (critical, serious, moderate, minor), tiêu chí WCAG (ví dụ 1.1.1), link hướng dẫn và tối đa max_nodes phần tử vi phạm kèm CSS selector, đoạn HTML và cách sửa. score (0-100) tóm tắt kết quả; needs_review liệt kê các kiểm tra axe chưa kết luận được.

Các quy tắc cần trang đã hiển thị (tương phản màu, kích thước vùng chạm, khoảng cách chữ, vùng cuộn, thứ tự focus) không được chạy và được liệt kê trong not_checked; nội dung do JavaScript thêm vào không được thấy. Kiểm tra tự động chỉ phát hiện một phần lỗi WCAG, nên hãy kiểm tra thủ công thêm. HTML tối đa 3 MB.

Dùng trong code của bạn

curl -X POST "https://apibox.io.vn/v1/a11y-check" \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"html":"<!doctype html><html><head><title>Shop</title></head><body><img src=\"logo.png\"><a href=\"/cart\"></a><form><input type=\"email\" placeholder=\"Email\"><button></button></form></body></html>"}'

const res = await fetch('https://apibox.io.vn/v1/a11y-check', {
  method: 'POST',
  headers: {
    Authorization: 'Bearer YOUR_API_KEY',
    'Content-Type': 'application/json',
  },
  body: JSON.stringify({
    "html": "<!doctype html><html><head><title>Shop</title></head><body><img src=\"logo.png\"><a href=\"/cart\"></a><form><input type=\"email\" placeholder=\"Email\"><button></button></form></body></html>"
  }),
});
const data = await res.json();
console.log(data);

import requests

res = requests.post(
    "https://apibox.io.vn/v1/a11y-check",
    headers={"Authorization": "Bearer YOUR_API_KEY"},
    json={"html": "<!doctype html><html><head><title>Shop</title></head><body><img src=\"logo.png\"><a href=\"/cart\"></a><form><input type=\"email\" placeholder=\"Email\"><button></button></form></body></html>"},
    timeout=30,
)
print(res.json())

<?php
$ch = curl_init('https://apibox.io.vn/v1/a11y-check');
curl_setopt_array($ch, [
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_CUSTOMREQUEST => 'POST',
    CURLOPT_HTTPHEADER => ['Authorization: Bearer YOUR_API_KEY', 'Content-Type: application/json'],
    CURLOPT_POSTFIELDS => '{"html":"<!doctype html><html><head><title>Shop</title></head><body><img src=\\"logo.png\\"><a href=\\"/cart\\"></a><form><input type=\\"email\\" placeholder=\\"Email\\"><button></button></form></body></html>"}',
]);
$response = curl_exec($ch);
print_r(json_decode($response, true));

Tài liệu API → Nhận API key miễn phí

Hỏi đáp

Có giống chạy axe trong trình duyệt không?

API chạy cùng bộ quy tắc axe-core trên DOM tĩnh. Các quy tắc cần bố cục hoặc màu đã tính (tương phản màu, kích thước vùng chạm) không chạy được và nằm trong not_checked; nội dung do JavaScript tạo ra không được kiểm tra.

Kiểm tra theo phiên bản WCAG nào?

Các quy tắc WCAG 2.0, 2.1 và 2.2 đến mức bạn chọn (A, AA mặc định, hoặc AAA), cùng các quy tắc best practice của axe trừ khi best_practices=false.

Điểm được tính thế nào?

Bắt đầu từ 100 và trừ theo mỗi quy tắc bị vi phạm tuỳ mức độ (critical 10, serious 6, moderate 3, minor 1) so với số quy tắc đã kiểm tra. Dùng để theo dõi tiến độ, không phải chứng nhận tuân thủ.