ARIA Landmark Visualizer

Landmarks are the named regions screen-reader users jump between with a single keypress to skip past the parts they've already read — headers, navigation menus, the main content area, the sidebar, the footer. HTML5 added native landmark elements (<header>, <nav>, <main>, <aside>, <footer>) that don't need explicit ARIA roles, but the rules around when each becomes a landmark are subtle: <header> only becomes a banner if it's at the document root (not nested inside <article> or <section>); <section> only counts as a region landmark if it has an aria-label; <form> is a landmark only when named; and multiple landmarks of the same role need unique names or the screen reader announces them indistinguishably. This ARIA Landmark Visualizer parses any HTML you paste, identifies every landmark (native or role-based), renders the tree with their accessible names, and flags the structural problems an audit by axe-core or VoiceOver would surface — missing <main>, multiple <main>, redundant role attributes on native elements, region landmarks without names, and same-role landmarks that need disambiguation.