[wp-trac] [WordPress Trac] #26107: CSS Usability Error with .screen-reader-text

[WordPress Trac]

#26107: CSS Usability Error with .screen-reader-text
-------------------------------------+---------------------
 Reporter:  jhned                    |       Owner:  helen
     Type:  defect (bug)             |      Status:  closed
 Priority:  normal                   |   Milestone:  3.8
Component:  Accessibility            |     Version:  3.8
 Severity:  normal                   |  Resolution:  fixed
 Keywords:  has-patch needs-testing  |     Focuses:
-------------------------------------+---------------------

Comment (by afercia):

 Thinking about a little crazy alternate method, what about to remove the
 title from the label, then hide the label text from screen readers and
 provide the information in a aria-hidden attribute?
 Something like:

 {{{
 <label class="screen-reader-text" for="cb-select-2" aria-label="Select
 Sample Page">
 <span aria-hidden="true">Select</span>
 </label>

 }}}

 - browsers don't search for text in attributes
 - the relevant information would still be conveyed to screen readers
 I know it's not so orthodox :) and I've tested just with NVDA + Firefox,
 would definitely need feedback from the accessibility team.

--
Ticket URL: <https://core.trac.wordpress.org/ticket/26107#comment:11>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform