Babak Sekandari
asked on
How to get visual impaired OCR to read Google custom search results
I'm trying to make a website compliant with the Americans with Disabilities Act. We want visually impaired people to be able to use OCR software more effectively with our college websites. Here is the site:
https://devallauth.dcccd.net/Pages/default.aspx
The OCR reads the page fine. Then when someone enters a search with its Google custom search, the site presents the results in an overlay div but the OCR does not read the search results in the overlay div. The OCR continues to read the original page elements. The overlay div gets added by the Google custom search code.
I then tried adding some code (in a test version of the site) to set the focus to the overlay div; but the OCR still didn't read the search results. Then I noticed that when I would hit the tab key or the enter key, the OCR would start reading the data on the overlay div so I added some JavaScript to force a tab keystroke; but that didn't work. I think that if I can just simulate a tab keystroke or an enter keystroke the right way then the OCR would start reading the overlay div. Here is the code I have for setting the focus on the overlay div wrapper and then forcing a keyboard enter press:
https://devallauth.dcccd.net/Pages/default.aspx
The OCR reads the page fine. Then when someone enters a search with its Google custom search, the site presents the results in an overlay div but the OCR does not read the search results in the overlay div. The OCR continues to read the original page elements. The overlay div gets added by the Google custom search code.
I then tried adding some code (in a test version of the site) to set the focus to the overlay div; but the OCR still didn't read the search results. Then I noticed that when I would hit the tab key or the enter key, the OCR would start reading the data on the overlay div so I added some JavaScript to force a tab keystroke; but that didn't work. I think that if I can just simulate a tab keystroke or an enter keystroke the right way then the OCR would start reading the overlay div. Here is the code I have for setting the focus on the overlay div wrapper and then forcing a keyboard enter press:
visibleWrapper.setAttribute('tabindex', -1);
visibleWrapper.focus();
keyUp = jQuery.Event("keyup", {keyCode: 13});
jQuery(visibleWrapper).trigger(keyUp);
Maybe I should trigger the key event from the <body> or the window? Is there a better route? Any suggestions are appreciated. Thanks.
This question needs an answer!
Become an EE member today
7 DAY FREE TRIALMembers can start a 7-Day Free trial then enjoy unlimited access to the platform.
View membership options
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
ASKER