Label field post_title in edit-form-advanced.php missed by some screen readers

[rianrietveld]

In wp-admin/edit-form-advanced.php a label is added to the title field post_title like:

<label class="hide-if-no-js" style="visibility:hidden" id="title-prompt-text" for="title"><?php echo apply_filters( 'enter_title_here', __( 'Enter title here' ), $post ); ?></label>

Some screen readers omit visibility: hidden.

Maybe a solution: remove the hardcoded style="visibility:hidden" in the PHP
and add it to the css id="title-prompt-text";

Kind regards,
Rian

[helenyhou]

This is the text that shows as a placeholder inside the title input. Moving the visibility: hidden to the CSS isn't going to help. Seems we have a couple options:

• Toggle the screen-reader-text class to hide it in a screen reader friendly manner
• aria-describedby

Also, fullscreen/DFW will need the same treatment.

[SergeyBiryukov]

I was under impression that the issue here is the hardcoded style="visibility:hidden" (according to the description).

DFW title doesn't have that hardcoded style (but is still controlled by wptitlehint() JS function):
​http://core.trac.wordpress.org/browser/tags/3.4.1/wp-includes/class-wp-editor.php#L679

So I thought that 21458.patch​ would make it more consistent.

21458.2.patch​ toggles .screen-reader-text instead (the change in wp-admin.dev.css is to prevent .screen-reader-text's left: -1000em from being overridden, which causes a visual bug).

21458.3.patch​ is an attempt at adding aria-describedby (not sure if that would work with style="visibility:hidden" though).

[azaozz]

Replying to SergeyBiryukov:

Yeah, not sure whether aria-describedby can be used with hidden element either. Sounds like it should be possible but don't know if all screenreaders would pick it.

21458.2.patch looks good, better to go with it.

[azaozz]

In [21584]:

Don't hide the label for the Title on the Edit Post screen, use 'screen-reader-text' instead, props SergeyBiryukov, fixes #21458