extension ExtPose

ARIA DevTools

CRX id

dneemiigcbbgbdjlcdjjnianlikimpck-

Description from extension meta

Easily spot missing ARIA labels, misused ARIA roles, and incomplete keyboard support in your web applications.

Image from store ARIA DevTools
Description from store Creating accessible web applications is difficult. It gets even harder if you don't understand how people with disabilities use computers. With ARIA DevTools you see your website the way screen readers present it to the blind users. All page elements are presented according to their explicit or implied ARIA roles. This includes headings, images, tables and form items beyond others. It's now easy to spot missing ARIA labels, misused ARIA roles, and incomplete keyboard support. This makes testing and development of accessible websites easier. This is an Open Source project that can be found on Github: https://github.com/ziolko/aria-devtools

Latest reviews

  • (2023-09-18) Ahmed Elswerkey: cool, also you can see the accessibility tree from the inspecting tool, Elements > "styles row" > accessibility
  • (2022-12-23) Martijn Noordermeer: Works pretty well, unless you're using Shadow DOM. I'm building my app in Lit-Element, which uses open Shadow DOMs for every component, and the extension is just not reading any of it and giving me a blank page.
  • (2022-03-23) Kai Luo: Delightfully simple and useful! 5 stars!
  • (2022-03-03) Spencer Gregson: If you've ever touched an ARIA attribute you NEED this tool to check your work. It makes creating dynamic and highly interactive content so clear. I've recommended aria-devtools to every developer I've worked on a component with or taught accessibility to. Thanks so much!
  • (2021-11-10) AbdalKarim Akilan: It deserves more than 5 stars. A must have tool for writing semantically correct HTML.
  • (2021-08-22) Chris Templin: A small, fast and very handy extension. Of course, it's great for accessibility. However, beyond that, it really helps you to think more logically about your code structure.
  • (2021-08-05) Reinier Kaper: Invaluable little tool to help you write much better UX. It makes you (painfully) aware of how intrusive certain things can be and how little feedback we normally provide on an accessibility level. This has become my go-to extension while developing and I'm encouraging the rest of my team to do the same!
  • (2021-07-06) Malte Bastian: A awesome and easy-to-use tool to see how screen readers would interact with a web page or web app.
  • (2021-06-28) Matt Jackson: Simple and accurate (the best code always is)
  • (2021-06-25) Peter Hillerström: Excellent extension for checking and fixing accessibility issues. Pascal Corpet already described very well how it works and feels to use!
  • (2021-05-18) Brendan Arnold: A nice, easy to use tool for seeing how screen-readers would interpret a webpage. We use this extensively in our organisation and it has been very useful for making sure that our efforts towards a11y are going in the right direction
  • (2021-05-04) Agustín Bustos: Besides providing amazing feedback on accessibility, this extension gives an amazing visual clue of the semantic structure of websites. Undoubtedly, for me one of the best out there.
  • (2021-02-26) Cezar Popa: Thank you for such a great tool!
  • (2021-01-26) Freyja Nash: I feel like the most difficult part about writing accessible code is not being able to see the accessibility. This plugin lets you do that though. I would highly recommend it.
  • (2020-11-24) Philippe Ruffinoni: This is the extensionI I looking for a while to understand and develop ARIA's interfaces. Thanks for the developers
  • (2020-10-09) Kristóf Egressy: Simple and visually appealing. Well Played!
  • (2020-10-08) Pascal Corpet: This extension is so simple to use and made me realize how much websites that I was using or creating were broken for other people. As a developer it's now one of my first check on a new site, app or page that I create: what does it look like with ARIA DevTools? Little bonus, the pirate emoji gives a nice touch in my extension bar and I feel that this tool is *also* for people that are not visually impaired.
  • (2020-09-09) Sen Sha: A very good extensions when it comes to developing WCAG compatible sites. There are a few other extensions out there too, but none of them are able to visualize the accessibility tree like this one. This one creates a complete new view of the site, showing to you very well ordered only what a screenreader would see. This makes developing really easy and comfortable. I highly can recommended this extension, to come around WCAG compatible development issues.

Latest issues

  • (2021-12-16, v:1.3.2) Samantha Garcia: Adjusting speed
    This tool goes too quickly for me to read what is shown on the screen. Is there a way to make it show for longer so I can verify it is reading the right thing?
  • (2021-09-30, v:1.3.1) Mike Kennedy: Confused
    Hello, I am trying to figure out how to use this extension. How can you tell which elements are missing an appropriate ARIA label? Will they be highlighted red or something? Or are these nodes simply recommendations of where ARIA labels might be beneficial? Thanks

Statistics

Installs
7,522 history
Category
Rating
4.8846 (26 votes)
Last update / version
2024-01-22 / 1.3.12
Listing languages
en

Links