Make WordPress Core

Opened 12 years ago

Closed 12 years ago

#21458 closed defect (bug) (fixed)

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

Reported by: rianrietveld's profile rianrietveld Owned by: azaozz's profile azaozz
Milestone: 3.5 Priority: normal
Severity: normal Version:
Component: Accessibility Keywords: needs-patch
Focuses: Cc:


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,

Attachments (3)

21458.patch (1.9 KB) - added by SergeyBiryukov 12 years ago.
21458.2.patch (2.1 KB) - added by SergeyBiryukov 12 years ago.
21458.3.patch (1.6 KB) - added by SergeyBiryukov 12 years ago.

Download all attachments as: .zip

Change History (8)

#1 @SergeyBiryukov
12 years ago

  • Keywords has-patch added
  • Milestone changed from Awaiting Review to 3.5

#2 @helenyhou
12 years ago

  • Keywords needs-patch added; has-patch removed

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.

#3 follow-up: @SergeyBiryukov
12 years ago

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):

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

21458.2.patch toggles .screen-reader-text instead (the change in 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).

#4 in reply to: ↑ 3 @azaozz
12 years ago

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.

#5 @azaozz
12 years ago

  • Owner set to azaozz
  • Resolution set to fixed
  • Status changed from new to closed

In [21584]:

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

Note: See TracTickets for help on using tickets.