Now in Helvetica Neue Light

October 6th, 2009

Articles and links in the sidebar have been upgraded to my official favourite font, Helvetica Neue Light. It’s pretty easy to do, but hard to figure out on your own. After searching for a while and experimenting on my own, I came up with the following CSS.

font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight: 300;

Some browsers (IE + the older ones) use fonts based on their family name and their style, that is “Helvetica Neue Light”. Others use the PostScript name, under the Adobe spec, e.g. “HelveticaNeue-Light”. Others still, such as the latest versions of Safari, Firefox, and Chrome, conform to the W3C specification when it comes to fonts and their styles, and take only the Family Name. The W3C dictates that you must use other CSS directives to get “light” or “bold” fonts. In this case the “Helvetica Neue”, along with the “font-weight: 300;”, will display Helvetica Neue Light to the user.

Arial is included for the sake of the poor Windows users out there, who have to use the font Microsoft put on their computer because they were to cheap to pay for Helvetica, despite it being one of the oldest and most widely used fonts in the world. As any typography nerd would know, Arial was a total rip off of Helvetica and should never be used.

There you have it. MacĀ users get to look at Helvetica Neue Light, while Windows users still get crappy old Arial.