Best Fonts for Linux Browsers?

BladeMelbourne asks: "As a web developer with a healthy love of Linux, I was wondering which fonts look great in Linux web browsers (particularly Mozilla/Netscape). Using 'Arial,Helvetica,sans-serif' just doesn't look nice. Do different distro's have different fonts? Which fonts resemble Arial/Helvetica? Which fonts are anti-aliased? Speaking of anti-aliased, does anyone know concisely how to get AA fonts with Mozilla on RedHat 8.0? I have my TTFs working, but don't seem to display correcly and look rather ugly on my display."

Comments

Use georgia ...

[kousik]

... and courier. After 2 yrs of experiments I found them to make the best combination.

Please do just one thing

[Anonymous Coward]

You say you are a web developer, so please pick those fonts out for yourself and just for yourself. Don't pick fonts for me, I like the ones I already have thanks.

Re:Please do just one thing

[Mark Pitman]

OK, here's a few references. I don't know if any of these sources are considered "experts" on the subject, but they seem to make sense.

• http://www.grc.nasa.gov/WWW/usability/textfontcss. html
• http://www.wilsonweb.com/wmt6/html-email-fonts.htm
• http://www.hfe.org/resource/articles/fonts.htm

personal preference

[Satai]

I always use Konqueror with Bitstream Charter, Bitstream Courier, Adobe Times and Adobe Helvetica.

In addition, I've found that my eyes are accustomed to having fonts with smaller spaces and no hinting, so with Xft1 I compiled with the xft-quality patch from Keith Packard, and for Xft2 I compile with the spacing part applied and then manually set /etc/fonts/fonts.conf to turn off hinting on the Bitstream fonts.

Disabling Arial

[Brian Hatch]

In a recent slashdot post (I forget where) there was a reference to a Customizing Mozilla page that has a bunch of cool tricks to add to your user.prefs, etc. One of the things they noted was the problem with bad Arial fonts being installed on your machine. Here are the relevant snippets:

Various Linux distributions have problems with fonts; in particular, Arial, used in many web pages, may map to a font that looks blocky and is smaller than the requested size. A full discussion is in bug 46415, but an easy solution for Redhat users is this:

mv /usr/share/fonts/ISO8859-2 /usr/share/fonts.ISO8859-2 and then log out of X and log back in again.

You can always undo this, if necessary, with the command:

mv /usr/share/fonts.ISO8859-2 /usr/share/fonts/ISO8859-2

It's also worth reading this excellent discussion on fuzzy Linux fonts.

Or, add things like this to user.js in your .mozilla/.... directory:

// X font banning: see bug 104075.
// Ban all arial fonts, because abiword installs an ugly one
// and there doesn't seem to be a good one available:
user_pref("font.x11.rejectfontpattern", "fname=.*arial.*");

// Some alternate forms for rejectfontpattern:
//"fname=.*arial.*;scalable=.*;outline_scaled=.*;\
// xdisplay=.*;xdpy=.*;ydpy=.*;xdevice=.*");
// "fname=-zz-abiword.*;scalable=false;outline_scaled =false;");
// Alternately, reject font if accept pattern does not match it:
//user_pref("font.x11.acceptfontpattern", ".*");

Oddly Enough...

[ruineraz]

Microsoft Verdana & Tahoma fonts. They common fonts for MS systems, and work under linux if you install the fonts. It's really hard to tell the difference between sites using IE on Windows and Mozilla on Linux with these fonts installed.

I typically use "Verdana, Arial, Helvetica" or "Tahoma, Arial, Helvetica"

Re:Oddly Enough...

[mr3038]

I typically use "Verdana, Arial, Helvetica" or "Tahoma, Arial, Helvetica"

I hope you don't touch the font-size. Or at least specify it as "100%" or "1em". This is important because otherwise correctly configured browsers display the characters too small.

Way too many websites use styles like p {font-family: verdana, sans-serif; font-size: 85%;}. This rule is saying that the author of the page thinks that the page looks best when viewed with font face called "verdana" with a font size of 85% of the size the user has selected she is comfortable with. I'm ok with suggesting a font face but no way normal text should be made smaller than I've set in the preferences. This situation is caused by two reasons:

• Microsoft decided to not provide an UI to define default font size in the Internet Explorer. Consider this being equivalent to a TV set without an option to adjust volume. Some web "designers" feel that they have to compensate the fact that the MS engineer decided to specify "too large" default font size. (MSIE does have view-text size menu but it has only 5 choices and in addition the feature has many bugs.)
• Verdana looks better with small font sizes. The problem is, verdana looks bigger than most other fonts so the font-size "has to" be modified to be much smaller for verdana to look good. This results to really small fonts if user's system cannot provide font face called "verdana" or it's different from the one distributed by Microsoft

The above issues, joined with the fact that MSIE is the most common browser and verdana is distributed alongside MSIE practically guarantee that change to the better isn't going to happen unless majority of web "designers" get a clue. I've already lost faith that majority of the users would have some clue (MSIE with all the latest patches applied: still 11 security holes with publicly available exploits. Scary, eh?).

Fortunately, Mozilla does have minimum font-size setting. Unfortunately, some web sites define such a small font sizes that my minimum of 9px is hit with H1 level headers--so all headers look the same and paragraph text is the same size as all the headers.

Use the XFT RPM

[linuxkrn]

The easist way to get Mozilla to use rpms that had support for XFT (AA Fonts). for 1.2.1 http://ftp.mozilla.org/pub/mozilla/releases/mozill a1.2.1/Red_Hat_8x_RPMS/xft/ Of course, you could always download the source and compile it with --enable-xft. :) As for my own pref, I like Luxi Sans. AA support looks great on mine, and even the menus use the default font. Nice when you are running 1600x1200+!

Best Fonts for Linux Browsers

[jsse]

Utopia

Mozilla with XFT and GTK theme support

[Reality_X]

mkdir moz1.3
cd moz1.3
lftp ftp.mozilla.org:/pub/mozilla/releases/mozilla1.3a/ Red_Hat_8x_RPMS/xft/RPMS/i386
mget *
[close mozilla]
rpm -Uvh *

You now have a beautiful browser.

Re:Mozilla with XFT and GTK theme support

[HRbnjR]

Heh, lftp, that's a new one for me, thanks! It looks like we all go with what we know, that is, heres the little Makefile I use:
---
RSYNC_RHOST := archive.progeny.com
RSYNC_RDIR := mozilla/releases/mozilla1.3a/Red_Hat_8x_RPMS/xft/R PMS/i386/
RSYNC := rsync -v
RPM := rpm
rsync:
$(RSYNC) -r $(RSYNC_RHOST)::$(RSYNC_RDIR) .
RPMS := $(wildcard ./*.rpm)
upgrade:
$(RPM) -U $(RPMS)
---

Use MS core fonts with Mozilla-ttf

[wotevah]

This has been on ./ very recently. In addition to downloading the ttf mozilla rpm for RH8.0, you also need to "build" and install the MS core font set for the web from corefonts.sourceforge.net.

Antialiased Fonts in Mozilla

[JimR]

I did the following to enable antialiased fonts in Mozilla - I didn't compile my own Mozilla, but I do tend to use recent nightlies:

// for anti-aliased fonts
pref("font.FreeType2.enable", true);
pref("font.freetype2.shared-library", "libfreetype.so.6");
pref("font.directory.truetype.1", "/home/jim/apps/mozilla-fonts");
// if libfreetype was built without hinting compiled in
// it is best to leave hinting off
pref("font.FreeType2.autohinted", false);
pref("font.FreeType2.unhinted", false);
// below a certian pixel size anti-aliased fonts produce poor results
pref("font.antialias.min", 6);
pref("font.embedded_bitmaps.max", 1000000);
pref("font.scale.tt_bitmap.dark_text.min", "64");
pref("font.scale.tt_bitmap.dark_text.gain", "0.1");

I had the libfreetype6 Debian package installed.

I made made my own font directory and copied the *.ttf files that I needed to it, because one of my more esoteric fonts would cause Mozilla to crash.

In the end I gave up on anti-aliased fonts because they gave me a headache unless I made them much bigger than I'm used to with my normal "crisp" X11 fonts.

Verdana,Arial,Helvetica size=-1

[Tom7]

I've been using face="Verdana,Arial,Helvetica" size=-1 for a few years, and that seems to work right in the default install of all the computers I use. (My school's sun lab included.) Arial looks really bad in Mozilla on linux.

Also, do yourself a favor and use CSS. I use this, which also displays text at the right size on Macs (which like to make fonts smaller when browsing the web):

P { font: 11px Verdana,Arial,Helvetica }

I can't say much for what the "right way" to do this is without offending those folks who believe the web should not have any markup for design.