ANDI - Accessible Name and Description Inspector

ANDI is a web accessibility inspection tool.

What does ANDI do?

1. Automatically detects accessibility issues
2. Suggests ways to improve accessibility
3. Reveals what a screen reader should say for interactive elements

What problem does ANDI solve?

For many web developers, accessibility is an unfamiliar and complex territory and therefore often neglected. ANDI bridges the gap between developers and end users by revealing where accessibility issues occur on the page. To accomplish this, it analyzes the HTML of the web page being testing and extracts accessibility related markup.

Developers like ANDI because:

• It's easy to install, quick to run, and helps satisfy accessibility requirements.

Testers like ANDI because:

• It saves them time by automatically finding potential defects and offering solutions.

End Users Ultimately Benefit:

• When web pages are accessible, everyone can efficiently perceive, understand, navigate, and interact with the Web.

javascript:void((function(){andiScript=document.createElement('script');andiScript.setAttribute('src','https://srbala.com/ANDI/andi.js');document.body.appendChild(andiScript)})());

Installation Instructions

Drag and Drop this link: ANDI into your browser's favorites/bookmark bar. Hide Accessible Instructions

Internet Explorer

Ensure that IE's Favorites Bar is visible, then choose one installation method:

Mouse Users

• Right click this link: ANDI and select "Add to favorites bar"
• Or drag and drop this link ANDI into the Favorites Bar.

Keyboard Only Users

• Keyboard Users can tab to this link: ANDI, press shift+F10 (which brings up a context menu) and select "Add to favorites bar"

ANDI is now installed to IE and ready to be launched.

Firefox

Ensure that Firefox's Bookmarks Toolbar is visible, then choose one installation method:

Mouse Users

• Mouse users can right click this link: ANDI and select "Bookmark This Link". Add it to the Bookmarks Toolbar.
• Or drag and drop this link ANDI into Bookmarks Toolbar.

Keyboard Only Users

• Keyboard users can tab to this link: ANDI, press shift+F10 (which brings up a context menu) and select "Bookmark This Link". Add it to the Bookmarks Toolbar.

ANDI is now installed to Firefox and ready to be launched.

Chrome

Ensure that Chrome's Bookmarks Bar is set to always show.

• Now drag and drop this link: ANDI to the Bookmarks Bar.
• Unfortunately, Chrome does not offer a simple keyboard accessible alternative.

ANDI is now installed to Chrome and ready to be launched.

Sounds handy! How do I install ANDI?

ANDI is a browser based "favelet" that, essentially, installs with a drag and drop, and is launched with the click of a button. Users can visit this installation page for browser installation instructions (includes keyboard accessible instructions).

If an organization wishes to host its own fork or copy of ANDI, see this page for alternate hosting instructions.

How can I make ANDI better?

If you would like to contribute to ANDI's development, some background knowledge of accessibility would certainly be helpful. ANDI is written in javascript, jquery, html, and CSS. Knowledge of javascript optimization and DOM manipulation is crucial to maintaining ANDI's quick agility.

What areas of accessibility does ANDI cover?

The current version of ANDI offers the ability to inspect focusable elements, data tables, images, and in-depth link and button analysis, page structure, and hidden content detection. Future versions of ANDI will incorporate color contrast analysis and more.

Who maintains ANDI?

ANDI is maintained by the Accessible Solutions Branch at SSA.