Hacker Newsnew | past | comments | ask | show | jobs | submitlogin

I can't find the information, but my understanding is that this approach isn't good from an accessibility standpoint because a screenreader still interprets the icons as their corresponding character and reads that character. As a result, instead of ignoring a checkmark icon, it would try to pronounce it as a single letter.

UPDATE: Further digging seems to validate that most modern screen readers do ignore pseudo elements. So, there's no doubt that this solution is promising. However, as with anything, your user agent baseline should be considered before using it. Saying that everyone should be using this right now probably isn't a reliable blanket recommendation.



This is the same problem I have with this approach. It seems like a cool idea, but I don't want to break accessibility. I think you can get around this using aria and having it skip over that element.

See aria-hidden:

http://www.w3.org/TR/wai-aria/states_and_properties#aria-hid...

Authors MAY, with caution, use aria-hidden to hide visibly rendered content from assistive technologies only if the act of hiding this content is intended to improve the experience for users of assistive technologies by removing redundant or extraneous content. Authors using aria-hidden to hide visible content from screen readers MUST ensure that identical or equivalent meaning and functionality is exposed to assistive technologies.


I may be misunderstanding the spec, but it looks like you have to be able to set element attributes for this approach to work, which I'm fairly certain you can't set with CSS. And I guess even if you can use JS to set the attributes, there's no way to set them on a pseudo-element anyway.


This particular implementation uses CSS before: rules. These are likely ignored by (current!) screenreaders.


Do screen readers parse CSS in their reading? I would think this would avoid that problem by using the :before pseudo classes rather than injecting it into the dom directly.

edit: fuller thought.


There's a rather large gap between what the accessibility standards say you should do and the way actual screen readers work.


What happens if you use a nonstandard Unicode character, something from the one of the private use areas? Will screen readers ignore it?




Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: