I want browser “find” features to emit window events.

Submitted by Paul Grenier

First, disclosures suck. But they're everywhere. I'm looking at you tab panels, accordions, fly-outs, details elements, etc. “Readability mode” / “read aloud” features and extensions usually don’t expose the hidden information. If someone bothered with a print.css, then maybe you could see it there.

For example: go to this Web Accessibility Initiative demo and launch the print dialog. You won’t see the hidden content. But you would if you were on Inclusive Design Principles.

“Find in Page” won’t search or highlight the hidden content either. To find what you're looking for, you have to open everything on the page and then “find” again. Unless, of course, it’s a tab panel or a one-thing-open-at-a-time style accordion; for those you have to “find” with each exclusive panel open! This is especially frustrating when a search result says the page has certain content, but you can’t find it quickly using the built-in browser tools.

Now imagine that an event was triggered when users initiate “Find in Page,” but before the search is executed against the page. You could programmatically open all of the disclosures via JavaScript, allowing the browser to highlight every instance of the searched terms.

window.addEventListener('before-find', openAllDisclosures, false);

This could also be really useful for analytics, helping teams answer the question “what did the user expect to find on this page?” (Hint: the answer is your disclosures are still a bad idea, but at least I can prove it to you with analytics.)

Tagged
JavaScript Accessibility User experience