search

WordPress / twentysixteen

Twenty Sixteen is a theme now included in all WordPress installs. To report any issues please go here: https://core.trac.wordpress.org/newticket
324 stars 150 forks source link

The clip CSS property has been deprecated #471

Closed henrywright closed 8 years ago

henrywright commented 8 years ago

The clip CSS property is used in style.css. You might want to use clip-path instead. Ref:

https://developer.mozilla.org/en/docs/Web/CSS/clip

josephfusco commented 8 years ago

The clip property is still used in core for the same purpose of skip links and screen reader text. It is the most supported way to handle this whereclip-path falls short in IE & Edge. I think we should follow core patterns on this and update when a new solution is implemented.

See: https://make.wordpress.org/accessibility/2015/02/09/hiding-text-for-screen-readers-with-wordpress-core/#comment-72450

henrywright commented 8 years ago

@josephfusco I can see why clip-path falls short; it's experimental and browser support is pretty poor at best. The reason for using clip is to hide screen reader text. Is there an alternative approach to hiding text that doesn't rely on using a deprecated property?

josephfusco commented 8 years ago

Joe Dolson does a great job at explaining a couple different ways in that link above. One of them being absolute positioning, which does not require clip but does require additional RTL support.

While I agree that we shouldn't be using depreciated properties, this isn't the only case of using something because it offers wider coverage. Example would be the theme uses :before & :after which are both depreciated in favor of ::before & ::after. If someone came up with a better tested solution for this, we should by all means include it.

henrywright commented 8 years ago

Thanks for the link to Joe's article. I suppose you could just add right: -999em; to rtl.css?

I'd be interested to hear of alternative tried and tested solutions too. I guess it's a common problem on the web, not specific to WordPress.

karmatosed commented 8 years ago

@davidakennedy what is your opinion on this? Interested to get the a11y view point.

davidakennedy commented 8 years ago

I would stick with clip for now. As Joe explains in the comment on the post he wrote, it's still the best method for hiding text in an accessible way. I would be very uncomfortable with using clip-path because if the poor browser support. Sometimes, being bleeding edge isn't great for users or because of the workarounds it would require. I think it's smarter to follow Core's lead here.

karmatosed commented 8 years ago

Closing as it seems to make sense to stick with clip.