[wp-trac] [WordPress Trac] #35777: Color contrast: the input placeholder
WordPress Trac
noreply at wordpress.org
Mon Feb 8 16:25:44 UTC 2016
#35777: Color contrast: the input placeholder
-------------------------------+-----------------
Reporter: afercia | Owner:
Type: defect (bug) | Status: new
Priority: normal | Milestone: 4.5
Component: Administration | Version:
Severity: normal | Keywords:
Focuses: ui, accessibility |
-------------------------------+-----------------
In a few places in the admin screens WordPress uses placeholder attributes
for some input fields. Sooner or later the placeholder usage should be
reviewed from an accessibility perspective but for now, this ticket aims
to focus on a single aspect: color contrast.
Looking back at some history, I'd agree with Helen's comment on #22689:
targeting internal browser CSS can be hard, especially in terms of
maintenance. On the other hand, if WordPress is going to use placeholders,
then I'd say we should make sure there's a sufficient color contrast ratio
between the placeholder text and the input background.
Worth noting the style introduced in [22986] doesn't work any more since
Firefox 19. Firefox now uses a pseudo element selector `::-moz-
placeholder`.
Also, the placeholder in the "toolbar" search field (appears only when
logged in on the front end), was removed a few years ago in [19518] see
ticket #19370, but both `admin-bar.css` and `_admin.scss` still use over
qualified selectors to target it.
About the color picker placeholder: I don't see the reason why the cursor
should be centered. Also, not all browsers support text-align on input
fields. Removing the centered alignment would also allow to remove the
transparent color used on focus, see [20936].
As a best practice I'd recommend to don't try to alter native browsers
controls. Placeholders are supposed to work in a certain way, they
shouldn't disappear on focus. If there are concerns about user being
potentially confused by placeholders, then maybe they shouldn't be used in
the first place.
Worth noting the placeholder text in the color pickers used in the
Customizer doesn't fit the input field and gets cut off. Languages other
than English may have longer translations too. Probably worth a separate
ticket.
Here's some of the places where placeholders are currently used:
- media modal
- themes search
- plugins search
- Customizer, in several places
- `get_search_form()`
- color picker
- Press This
- file system credentials form
- the new wplink inline toolbar, see #33301
--
Ticket URL: <https://core.trac.wordpress.org/ticket/35777>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform
More information about the wp-trac
mailing list