Archives

Standing on their own, icons can be misinterpreted […]. The most important issue though: they lack text. Text is the most accessible format for information on the web. Screen readers understand text best and the same applies to most assistive technology, such as translation apps and Braille displays. So, if we have anything on our web page that’s not text — like icons — we must add text that gives our users the same information. Otherwise we could exclude people from understanding our interfaces.

So we get reduced data cost, with no extra connection from the browser, and what appears to be pretty negligible cost at the CDN (the difference in response time for the final proxied images versus loading them without Cloudinary in place is barely noticeable in my tests)—and it all took just a few minutes to put into place.

A good alt text can conjure up wonderfully stimulating mental images. A friendly smile is the same in print, photo or wax crayon. Whether you listen to an image or see it, the emotional response is the key factor, so why should we recommend that these emotion rich images should be given a null alt text and hidden from screen reader users?

Not having to use a JavaScript framework also meant that HTML, not JSX or Vue components, is now front and center in the code you write. This helped me avoid the usual traps when writing React: the infamous div soup, inaccessible components, or non-semantic tags.