WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Font Icons and Pseudo-elements

for

From: Bim Egan
Date: Apr 11, 2016 10:50AM

Hi Joseph,

There's a lot to do to make font icons accessible. The most obvious issues
are for people who need to use personal stylesheets, you'll probably find
that there's no content at all or the dreaded white squares displayed when
your own stylesheet isn't being used.

Here's a good resource:
https://www.filamentgroup.com/lab/bulletproof_icon_fonts.html

In short, icon fonts need a text alternative, one that will replace it when
it isn't displayed on the page.

Sorry, can't help with the pseudo elements, I just know that using them for
information is one of WCAG's failure techniques: F87 Failure of Success
Criterion 1.3.1 due to inserting non-decorative content by using :before and
:after pseudo-elements -
http://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20160317/F87

HTH

Bim