WordPress.org

Make WordPress Core

Opened 8 years ago

Closed 8 years ago

#25898 closed defect (bug) (fixed)

Twenty Fourteen: consider removing non-standard `::selection` selectors

Reported by: lancewillett Owned by: lancewillett
Milestone: 3.8 Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords:
Focuses: Cc:

Description

See https://developer.mozilla.org/en-US/docs/Web/CSS/::selection for the explanation.

Code: http://core.trac.wordpress.org/browser/trunk/src/wp-content/themes/twentyfourteen/style.css?order=name#L456

I believe this came through from the original theme, Further, and they aren't in any standard spec and aren't recommended for production (it's experimental).

Attachments (2)

25898.diff (573 bytes) - added by lancewillett 8 years ago.
25898.1.diff (568 bytes) - added by iamtakashi 8 years ago.

Download all attachments as: .zip

Change History (11)

@lancewillett
8 years ago

#1 @lancewillett
8 years ago

  • Component changed from General to Bundled Theme
  • Keywords has-patch added; needs-patch removed

#2 follow-up: @iamtakashi
8 years ago

The style is not important at all. I'm fine to remove that.

#3 @lancewillett
8 years ago

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

In 26062:

Twenty Fourteen: remove non-standard ::selection selectors. Closes #25898.

@iamtakashi
8 years ago

#4 @iamtakashi
8 years ago

Attached a patch that removes ::selection selectors from accent color style.

#5 @celloexpressions
8 years ago

  • Resolution fixed deleted
  • Status changed from closed to reopened

I'd argue that just because it's non-standard doesn't mean we shouldn't support it. Many, many web users are in the habit of highlighting text when reading (I use it a lot, it can help with focus, several other WordPress people use it too).

::selection has wide support across all browsers (Chrome 1+, Firefox 1+ w/ -moz-, IE 9+, Opera 9.1+, Safari 1+). Yes, there are slight variations between behavior but changing color and background-color doesn't break anything. Using it doesn't make anything worse, and almost always makes things better. The appearance of a color that is completely foreign to the design of a website when selecting text is just plain bad design.

The MDN article is a big exaggeration; the W3C discussion they reference is centered on details of slight inconsistent behavior between vendors, and concerns with nesting, etc. We're using it, like most sites that do, in the most widely accepted way (one rule for the whole site), using only the widely accepted color and background properties. It's only a matter of time before it re-enters the standards, as usage continues to increase and it is an excellent design touch.

The <meta> viewport is non-normative too (though almost everyone uses it), and the standards currently recommend that it is mapped to the standard `@viewport` css declaration (since that should really be done in css, not html, but Apple made up their own standard and everyone followed). But we aren't pulling that out, because it's necessary for the design of the website to work. IMO this is exactly the same situation, using a widely-adopted non-standard to achieve a better design. (See #25888 for adding that, or at least the required -ms- prefix to all of the responsive bundled themes).

I really think we should revert [26062], it's a step in the wrong direction (trying to fix something that really isn't broken). Reopening for discussion, and because there's another patch up to finish removing it anyway.

#6 in reply to: ↑ 2 @celloexpressions
8 years ago

Replying to iamtakashi:

The style is not important at all. I'm fine to remove that.

As someone who uses it regularly, it is critical (and as mentioned & linked above I'm not the only one). It is extremely annoying when sites don't use it.

#7 @lancewillett
8 years ago

Nick: good points all around, thanks for the thorough research on this one. Though I personally don't use the highlight text color styles much (or notice it) I agree it's worth the trade-off with having a non-valid, non-standard selector or two.

#8 @lancewillett
8 years ago

In 26069:

Twenty Fourteen: implement UX features in spite of being non-standard CSS selectors that won't validate. @viewport for a better touch experience on Windows, and ::selection for better text selection styles. See #25888 and #25898, props celloexpressions.

#9 @lancewillett
8 years ago

  • Keywords 2nd-opinion has-patch removed
  • Resolution set to fixed
  • Status changed from reopened to closed
Note: See TracTickets for help on using tickets.