What a professional typesetter knows is the importance of a good font. For centuries typesetters have evolved fonts to provide ease of reading that we know today. Having the text look good in the web browser is a nice bonus; choosing the right type and size can make a big difference to how well we read, especially if used quite a bit.
To make a web page feel right — as the designer had in mind — the fonts should be on your system that a page requires. On some Linux systems, only the basic fonts are installed. Installing missing fonts usually adds nice touches that may have not been realized before. To help discover missing fonts, the Context Font add-on will display font type and size of a selected font. Many sites define their fonts as Arial, or sometimes, Verdana, or Georgia; these fonts can be added by installing Microsoft’s core fonts; a few define theirs with Apple fonts, and a few less with others. These font packages contain the most popular fonts (for Arch Linux):
arpa -i otf-bitter otf-exo ttf-bitstream-vera ttf-dejavu ttf-inconsolata ttf-lato ttf-liberation ttf-mac-fonts ttf-opensans ttf-win7-fonts
To get a good idea on good font size to use, look at a book. The size there that feels comfortable will likely feel comfortable on the monitor too. When choosing font size also think about making the various typefaces the same size (i.e. serif, sans-serif, and monospace).
Being able to define one’s own font can help readability quite a bit; however,keep in mind, tastes differ. In Firefox, the settings that can be defined are generic typefaces of: serif, sans-serif, and monospace (additionaly, the minimum font size can be set). It should be known though, that many sites still force a specific font type and size; however, gradually, a greater number of sites are using generic typeface definitions. In the future this means that personalizing fonts will be of greater availability. When choosing a font type, keep in mind to pick one that helps improve readability rather than one that grabs ones attention.
Here is a basic test of what Firefox’s base-defined font types and sizes look like (click to view):
Here are what a few of the common font groups look like (click to view):
What did I choose?
After adding all the new fonts and testing them, I found out I like a varied group; they read beautifully and scale good. Ultimately I came up with these:
|Monospace||DejaVu Sans Mono||12|
DejaVu Sans Mono and Open Sans are good fonts and, for me, hard to beat. Rather than just define them in Firefox, I prefer to define my serif, sans-serif, and monospace fonts system-wide. This allows me to have a consistent overall look to me desktop. Here is my Fontconfig configuration (note: fonts are listed preferential/available first): fonts.conf.
For GNOME the fonts sizes are:
|Window Titles||Cantarell Bold 11|
What they look like: