Fixed
Details
Assignee
UnassignedUnassignedReporter
Matt ClareMatt ClareComponents
Fix versions
Affects versions
Priority
Major
Details
Details
Assignee
Unassigned
UnassignedReporter
Matt Clare
Matt ClareComponents
Fix versions
Affects versions
Priority
Created August 2, 2016 at 2:56 PM
Updated January 24, 2017 at 9:21 PM
Resolved January 24, 2017 at 9:21 PM
Throughout the environment screen reader specific content is placed off-screen with the CSS class "skip". This is used in many different scenarios, such as <label> elements for input fields, informative text placed in <span> elements, and skip-links used to jump to the main content. All of these elements are positioned off-screen with this "skip" CSS class, however the class itself utilizes the CSS display:none property. This not only hides the content off-screen, but it also hides it from assistive technology. As such, screen reader users never interact with this content.Developers must ensure that screen reader specific content placed off-screen remains exposed to assistive technologies. In order to ensure that this content remains exposed, the CSS display:none property must not be utilized.
http://qa03-sakai.marist.edu:8080/portal/site/%7essbtest002/tool/a81b1d1f-edd1-45c6-af8c-e565bf263479/?wicket-crypt=yodDbFp4Xto
Here is additional guidence for invisible content http://webaim.org/techniques/css/invisiblecontent/Many examples of the "skip" class suggest that the should be placed off-screen as opposed to not read.
The label a11y:invisiblecontent has been added to track the larger scope of this issue.