Skip to content

Why You Should Consider A Ligature Icon Font For Your Next Project

Updated: at 05:06 PM

Taking advantage of ligatures allows you to create an icon font where the text “Cart” renders a shopping cart

From the article by Dudley Storey

However, there are three fundamental disadvantages to icon fonts, two of which are also shared by image sprites:

  1. Most icon fonts are not accessible: typing “L” to produce a Like button means that visitors who use a text-to-speech service to read your site will only hear “L” as a description of the icon. While there are solutions to this issue, they use CSS tricks that are, in this author’s humble opinion, somewhat convoluted and better left behind.

  2. Search engines are confronted with the same issue, as they read text, not icons, and “L” makes little sense to Google.

  3. Looking up codes for icons and typing in HTML entities to produce them is a pain: as an example, see the character map for Entypo.

Ligature icon fonts eliminate both of these issues. As I’ve explained previously, ligatures are joined or merged letter forms that are generated to produce smoother type with better spacing: a single glyph to replace the otherwise ungainly “fi” letter pairing, for example.

Read more from the source: