This product was not featured by Product Hunt yet. It will not be visible on their landing page and won't be ranked (cannot win product of the day regardless of upvotes).
A11y Navigation Auditor
All your structural a11y checks, in one Chrome side panel
Visualize your page's structure, accessible names, and live ARIA states—all in one Chrome side panel. See the information assistive tech relies on at a glance, with issues flagged automatically (error / warning / info). No overlay clutter, no DevTools digging. On-device AI guidance powered by Gemini Nano—100% local, zero data leaving your browser.
As the creator of A11y Navigation Auditor and an IAAP WAS (Certified Web Accessibility Specialist), I've spent years auditing websites. Over time, I've felt that existing tools for auditing page structure have clear limitations.
Existing approaches each have trade-offs: single-category extensions force you to switch tools just to check headings or landmarks; overlay-based tools clutter the page and block your view; and digging through deeply nested DevTools panels is just overwhelming.
That's why I built this tool. It unifies and visualizes your page's underlying structure right inside a clean Chrome side panel. You can capture the entire "backbone" of your site at a glance and perform professional-grade structural audits without the noise.
✨ Key Features: - 6 Core Categories: A unified view for Headings, Links, Form Controls, Landmarks, Images, and Tables—inspired by VoiceOver's Rotor, surfacing the information assistive tech relies on. - Accessible Names & Live ARIA Monitoring: See each element's computed accessible name (per the AccName spec) and track dynamic ARIA state changes in real time. - On-Device AI Guidance: Powered by Chrome's built-in Gemini Nano, the tool provides context-aware guidance instantly and locally—no API key, no token costs, zero data leaving your browser.
🔍 What You'll See: - Headings: full hierarchy (h1–h6, including role="heading"), each with its accessible name and where the name comes from. - Links: accessible name and destination URL for every link, with classification icons (navigation / new window / in-page anchor) and aria-current state. - Form Controls: accessible name and its source, element type/role, autocomplete values, and real-time ARIA state badges (aria-expanded, aria-pressed, aria-invalid, and more). - Landmarks: the full landmark structure of the page—each landmark's type, source HTML element, and accessible name. - Images: thumbnail preview, accessible name, and classification (informative / decorative / text image / linked image). - Tables: accessible name, dimensions, header cell () and presence, and accessible description.
⚡ Built for Real Audit Work: - Issues flagged as errors, warnings, or info—so you can prioritize at a glance. - Each finding references a WCAG Success Criterion for traceable, defensible audits. - Click any item in the side panel to scroll to and highlight the matching element on the page. - Live ARIA tracking via MutationObserver—no manual rescans, just differential updates as you interact. - Third-party widgets (cookie banners, consent UIs) excluded automatically, so you can focus on your own content.
I designed this tool from an auditor's practical perspective—to make accessibility a baseline of quality, not a hurdle. I'd love to hear from you: what's the most frustrating part of your structural auditing workflow today?
No comment highlights available yet. Please check back later!
About A11y Navigation Auditor on Product Hunt
“All your structural a11y checks, in one Chrome side panel”
A11y Navigation Auditor was submitted on Product Hunt and earned 4 upvotes and 1 comments, placing #100 on the daily leaderboard. Visualize your page's structure, accessible names, and live ARIA states—all in one Chrome side panel. See the information assistive tech relies on at a glance, with issues flagged automatically (error / warning / info). No overlay clutter, no DevTools digging. On-device AI guidance powered by Gemini Nano—100% local, zero data leaving your browser.
A11y Navigation Auditor was featured in Chrome Extensions (52.7k followers), Developer Tools (514.5k followers) and Inclusivity (527 followers) on Product Hunt. Together, these topics include over 86.8k products, making this a competitive space to launch in.
Who hunted A11y Navigation Auditor?
A11y Navigation Auditor was hunted by Ayumu Futamata. A “hunter” on Product Hunt is the community member who submits a product to the platform — uploading the images, the link, and tagging the makers behind it. Hunters typically write the first comment explaining why a product is worth attention, and their followers are notified the moment they post. Around 79% of featured launches on Product Hunt are self-hunted by their makers, but a well-known hunter still acts as a signal of quality to the rest of the community. See the full all-time top hunters leaderboard to discover who is shaping the Product Hunt ecosystem.
Want to see how A11y Navigation Auditor stacked up against nearby launches in real time? Check out the live launch dashboard for upvote speed charts, proximity comparisons, and more analytics.
Ayumu Futamata
Hey Product Hunt 👋
As the creator of A11y Navigation Auditor and an IAAP WAS (Certified Web Accessibility Specialist), I've spent years auditing websites. Over time, I've felt that existing tools for auditing page structure have clear limitations.
Existing approaches each have trade-offs: single-category extensions force you to switch tools just to check headings or landmarks; overlay-based tools clutter the page and block your view; and digging through deeply nested DevTools panels is just overwhelming.
That's why I built this tool. It unifies and visualizes your page's underlying structure right inside a clean Chrome side panel. You can capture the entire "backbone" of your site at a glance and perform professional-grade structural audits without the noise.
✨ Key Features:
- 6 Core Categories: A unified view for Headings, Links, Form Controls, Landmarks, Images, and Tables—inspired by VoiceOver's Rotor, surfacing the information assistive tech relies on.
- Accessible Names & Live ARIA Monitoring: See each element's computed accessible name (per the AccName spec) and track dynamic ARIA state changes in real time.
- On-Device AI Guidance: Powered by Chrome's built-in Gemini Nano, the tool provides context-aware guidance instantly and locally—no API key, no token costs, zero data leaving your browser.
🔍 What You'll See:
- Headings: full hierarchy (h1–h6, including role="heading"), each with its accessible name and where the name comes from.
- Links: accessible name and destination URL for every link, with classification icons (navigation / new window / in-page anchor) and aria-current state.
- Form Controls: accessible name and its source, element type/role, autocomplete values, and real-time ARIA state badges (aria-expanded, aria-pressed, aria-invalid, and more).
- Landmarks: the full landmark structure of the page—each landmark's type, source HTML element, and accessible name.
- Images: thumbnail preview, accessible name, and classification (informative / decorative / text image / linked image).
- Tables: accessible name, dimensions, header cell () and presence, and accessible description.
⚡ Built for Real Audit Work:
- Issues flagged as errors, warnings, or info—so you can prioritize at a glance.
- Each finding references a WCAG Success Criterion for traceable, defensible audits.
- Click any item in the side panel to scroll to and highlight the matching element on the page.
- Live ARIA tracking via MutationObserver—no manual rescans, just differential updates as you interact.
- Third-party widgets (cookie banners, consent UIs) excluded automatically, so you can focus on your own content.
I designed this tool from an auditor's practical perspective—to make accessibility a baseline of quality, not a hurdle. I'd love to hear from you: what's the most frustrating part of your structural auditing workflow today?
Thanks so much for your support! ❤️