Test: how does the icon render
What is actually presented to the user in various scenarios?
Example
The link in this example has an icon of a bed before the text "Book a hotel" added through CSS.
Book a hotel
<a href="#book-hotel"><i class="fa fa-bed" aria-hidden="true"></i> Book a hotel</a>
Results
| AT | Browser | OS | Result |
|---|---|---|---|
| VoiceOver | Safari 9 | OS X 10.10 | Icon is not spoken (but is displayed in VoiceOver overlay) |
| VoiceOver | Yandex.browser | OS X 10.9 | Icon is not spoken |
| VoiceOver Braille display | Yandex.browser | OS X 10.9 | Icon is rendered: ⣸⣲ |
| VoiceOver | Safari | iOS 9 | Icon is not spoken |