Beware of Helvetica and Times
5 comments so far | Add yours
If you (like me) are using helvetica or times as preferred font-family in your web designs, you should be aware of one important thing: Firefox/mac renders the fonts incorrectly.
It seems that firefox/mac removes the top padding that is necessary to correctly render special characters like Ã…, making the entire field more narrow than if you would use arial or times instead. This could result in background-images being placed incorrectly etc.
Here is an example to illustrate this:
As you can see, I have added a grey background color to the span that wraps around the text. The screenshot is from FF/mac where the problem is most obvious; the wrapping box is actually narrower than the ring above the ‘A’. Safari/mac tries to correct this, but it’s still not perfect. Here is a link to the test page.
In windows, the browsers seem to render the fonts more correctly. On a side note, helvetica and times where originally made for the print medium. Arial and georgia was made for the screen, so one could argue that using arial instead of helvetica in web design would be considered more “correct”.
Has anyone else noticed the same thing?
5 Responses so far. Add yours.
-
At 3:41 pm on July 5th, 2007 , Jacob Nelson wrote:
I have noticed the same thing on previous projects…it’s quite annoying if you ask me. Why can’t BROWSERS JUST GET ALONG AND BE FRIENDS!! sigh
-
At 6:39 pm on July 5th, 2007 , Jimmy Nordlund wrote:
Yup, I’ve noticed this as well and it’s very annoying.
I’ve stopped using Helvetica altogether in my style sheets because of this, but lately I’ve started using Helvetica Neue quite a lot and that seems to work fine. I definitely prefer it over Arial. It’s a shame it’s only available to Mac users.
-
At 9:29 pm on October 30th, 2007 , Olof Lönnroth wrote:
Ok, I’m rather late in the discussion, but I just ran into this problem as well. Another really annoying thing is that Firefox/mac starts rendering Helvetica without anti-aliasing/smoothing at a relatively large font size. Looks horrible. I haven’t seen it happen with any other font.
-
At 6:14 pm on August 19th, 2008 , Jon wrote:
Also, having Safari installed on Windows (which Quicktime pulls down by default) installs a Helvetica font onto the Windows box that has NO decent hinting whatsoever for any browser other than Safari … (examples: http://jb.org/journal/2008-08/font-hell/ )
1 Trackbacks & Pings:
-
Trackback at 4:39 pm on February 9th, 2009 by Chat-Thread - Seite 787 - XHTMLforum:
[…] von Helvetica angeht, die Schrift sieht da sehr unschön aus, deshalb > an zweiter Stelle. Beware of Helvetica andTimes|David’s kitchen Angehängte […]