Font conformity: cross-browser, cross-platform?

Tweaking your CSS and your code so your pages render nicely regardless of the user’s browser is, we all know that, a very time-consuming hassle. But there’s more into it than just cross-browser consistency. Fonts might not display the same way on a mac and on a PC — in fact, that nice font you used for your headings might not even exist on the other platform. Now what? Hopefully, there’s Typechart.

Typechart is a very simple website, with one simple purpose: allow you to compare how fonts render across different platforms. To ensure maximum compatibility and consistency, it focuses on the standard faces (Arial, Georgia, Verdana), while giving an insight on platform-specific typefaces (like Cambria on windows or Lucida Grande on mac).

The way the site works is pretty straightforward: select a typeface, an emphasis or a type size, and see the how the fonts render based on your selection. Switch between platforms with the built-in preview system so you can control how the output looks when handled by Cleartype on windows or AppleFont on mac, then simply grab and paste the corresponding CSS.

In addition, Typechart provides a set of useful resources around typography, with links to articles, books, and additional tools.

» Visit Typechart


Leave a Reply