Re: How do assistive technologies handle icon fonts?

When reading one character at a time, symbols even in the private use area
(PUA) do get announced in Firefox + NVDA. I'm told the Alex voice in
VoiceOver (Mac OS) also by design attempts to announce the symbol. In each
case, it announces the hex code of the symbol. I don't know what they do in
Braille displays (testing needed). For these reasons, I recommend authors
wrap custom icons with aria-hidden="true", and add hidden accessible text
adjacent to the symbol.

An additional challenge is how to make the experience work for sighted
users who customize their fonts, such as with "ignore fonts" settings in
the browser or with custom style sheets. As far as I know, this can only be
fixed in the browser. Example:
https://bugzilla.mozilla.org/show_bug.cgi?id=789788

Cheers,
Mitchell

On Mon, Nov 30, 2015 at 2:05 PM Elizabeth J. Pyatt <ejp10@psu.edu> wrote:

> Hello:
>
> If your icon font is displaying something different from the intended
> Unicode value, you will almost certainly need a workaround for screen
> readers. I have experimented with ARIA and found that assigning the role of
> image to a character not otherwise recognized in a screen reader and adding
> a description in “aria-label” works.
>
>
> http://sites.psu.edu/gotunicode/2014/11/18/aria-for-screen-readers-not-able-to-read-symbols/
>
> I would be interested to find if this works for an icon font as well.
>
> Elizabeth
>
> P.S. I have some other notes about icon fonts at
> http://sites.psu.edu/gotunicode/2013/06/26/icon_fonts_unicode_and_accessi/.
> If you assign the glyphs to the Private Use Area in Unicode, you would
> probably get consistent results - they might be visible on a browser, but
> skipped by JAWS (and possibly VoiceOver). That could be handy for
> decorative icons which don’t need ALT tags.
>
>
>
> > On Nov 30, 2015, at 4:37 PM, Michiel Bijl <michiel@agosto.nl> wrote:
> >
> > Jemma and I are doing some accessibility testing on icon
> fonts—especially Font Awesome—and how assistive technologies handle them.
> I’ve setup a GitHub repository called Font Awesome (because we initially
> targeted that specific library; should rename it). I’ve already added one
> test example and some test results, but suggestions for more examples (ways
> to fix the issue of icon fonts being announced weird), or test results for
> existing tests, or even tips on how to display test results properly; it’s
> all welcome!
> >
> > —Michiel
> >
>
> =-=-=-=-=-=-=-=-=-=-=-=-=
> Elizabeth J. Pyatt, Ph.D.
> Instructional Designer
> Teaching and Learning with Technology
> Penn State University
> ejp10@psu.edu, (814) 865-0805 or (814) 865-2030 (Main Office)
>
> 210 Rider Building  (formerly Rider II)
> 227 W. Beaver Avenue
> State College, PA   16801-4819
> http://www.personal.psu.edu/ejp10/psu
> http://tlt.psu.edu
>
>
> --

Mitchell Evan
mtchllvn@gmail.com
+1 (510) 375-6104