One, two, many

When your foundry has a relatively small catalogue of typefaces, it’s reasonable to decide to put each one in the primary navigation of your website.

These are often listed out under a small “fonts” submenu, in the typeface name itself.

This UI pattern might back you into a corner later, though, as you move from a couple of typefaces into a larger collection.

What can foundries with medium and large-sized catalogues do to show their typeface, within the global navigation?

There are a few options here, including:

• Show the typeface name using a pre-made image
• Show the typeface name using an automatically generated in an image
• Load the base style of every typeface in the catalogue, and use the web fonts to show the typeface name
• Show all the typeface names in the UI font, and require the person to interface with the link to see what the typeface looks like
• Don’t actually show all a list of names of the typefaces as part of the global navigation and avoid the issue entirely—link to the fonts catalogue page instead

At a certain scale, especially for large catalogues and font distributors, the final option becomes the only practical one. There will be some kind of fonts index, and probably category indexes too.

What needs to be balanced here—as is often the case—is what is best to show the visitor (the typeface), what is best for the visitor to load (probably not every typeface), and what is best for the foundry when managing content (no manual work).

This is one of those cases where the “manual work” (if you can even call it that) is probably the right choice. Uploading a pre-made SVG of the primary font in its own name, looking exactly as you want, is almost certainly going to be easier and require less effort than changing the UI before the scale of your catalogue requires it, or having a developer automate generating them for your entire catalogue.

At a certain point, a workflow like this goes from a very minor inconvenience, to being entirely impractical. When I speak to type designers looking to automate something away, or script something for themselves, I find that’s when they know exactly how it should work. They have done it manually one too many times.

Until next time,
Kenneth