Dán HTML để xem landmark tree của trang (banner/main/nav/aside/footer + ARIA role) và các vấn đề cấu trúc a11y.
HTML được parse trên trình duyệt. Không chạy script DOM nào.
Landmark theo role
Dán HTML, xem cây H1-H6, nhận cảnh báo WCAG cho level bị bỏ qua, thiếu H1, heading rỗng.
Dán HTML để audit các phần tử <img>, <svg>, <input type=image> và role=img theo luật alt-text WCAG 2.1.
Dán HTML form để kiểm tra mỗi <input>, <select>, <textarea>, <button> có accessible name theo WCAG 3.3.2.
Landmark là các vùng có tên mà user dùng screen reader nhảy giữa chúng bằng 1 phím để bỏ qua phần đã đọc — header, navigation menu, vùng nội dung chính, sidebar, footer. HTML5 thêm phần tử landmark native (<header>, <nav>, <main>, <aside>, <footer>) không cần ARIA role rõ ràng, nhưng luật khi nào mỗi cái thành landmark khá tinh tế: <header> chỉ thành banner nếu ở document root (không nested trong <article> hay <section>); <section> chỉ tính là region landmark nếu có aria-label; <form> là landmark chỉ khi có tên; và nhiều landmark cùng role cần tên duy nhất nếu không screen reader đọc chúng không phân biệt được. Công cụ ARIA Landmark Visualizer parse bất kỳ HTML nào bạn dán, xác định mọi landmark (native hay role-based), render tree với accessible name của chúng, và flag các vấn đề cấu trúc mà audit bằng axe-core hay VoiceOver sẽ surface — thiếu <main>, nhiều <main>, role attribute thừa trên native element, region landmark không tên, landmark cùng role cần phân biệt.
banner (page header, thường <header> ở root), navigation (<nav>), main (<main>, chính xác 1 trên page), complementary (<aside>), contentinfo (page footer, <footer> ở root), search (wrapper search box, không có element native — dùng role="search"), form (<form> có tên), region (<section> có tên). Nhiều landmark cùng role được phép nhưng cần aria-label hay aria-labelledby duy nhất. Native element luôn thắng ARIA role — viết <nav> chứ không phải <div role="navigation">.