2 2 Votes

Fonts for Windows, Linux and Mac on the Web

Article by Stefan Trost | 27/11/2011 at 23:43

The fonts installed on Windows, Linux and Mac OS X are not identical, although there are certain similarities and congruencies. However, in the development of websites, you want to ensure a consistent typeface for each system.

Font equivalents for different systems 

Fortunately, there are on each system fonts that look similar to a font on a different system. The following table shows some of the equivalents. Nevertheless, of course, any computer and each system have different requirements. Some users may have installed additional fonts, some have outdated systems or there are missing specific fonts for other reasons.

TypeWindowsLinuxMac
sans-serifArialGaruda, Jamrul, FreeSansHelvetica, Arial
sans-serifArial BlackGadgetArial Black
serifBook Antiqua, Palation LinotypeFreeSerifPalatino
cursiveComic SansTSCu ComicComic Sans
monospaceCourier NewFreeMono, Nimbus Mono LCourier, Courier New
serifGeorgiaNimbus Roman No 9 L, NorasiGeorgia
sans-serifLucida Sans UnicodeGaruda, Gardi, Mukti NarrowLucida Grande
sans-serif Tahoma Kalimati Geneva
serif Times New Roman FreeSerif, Times Times, Times New Roman
sans-serif Verdana Bitstream Vera Sans, Deja Vu Verdana, Geneva

Each name of a font in the table is formatted in the appropriate font. Thus, it is easy to look up, whether the fonts are supported by your own system and how they look. If a font is not installed on your system, your browser's default font is used instead.

CSS Notation

In the CSS file, you can use the following line to write down font alternatives:

h1, h2, h3, p {
   font-family: Helvetica, Arial, FreeSans, Garuda, sans-serif;
}

For all elements, that should get the font (here headings and paragraphs), we are defining a "font-family" with a list of relevant fonts for Windows, Linux and Mac. The browser looks now, what fonts are installed on the system and takes the first installed font of the list.

For example, if Helvetica is not installed, Arial is taken. If Arial is not available, FreeSans is taken, then  Garuda and then the default sans serif font ("sans-serif"). As it is always possible that no font of the list is installed (we assume, for example, smart phones, etc), we should write the type (here without serifs) as the last element of the font list, so that the browser can show the default font of this type.

ReplyPositiveNegative

About the Author

Avatar AuthorYou can find Software by Stefan Trost on sttmedia.com. Do you need an individual software solution according to your needs? - sttmedia.com/contact
Show Profile | Message

 

Related Topics

Important Note

Please note: The contributions published on askingbox.com are contributions of users and should not substitute professional advice. They are not verified by independents and do not necessarily reflect the opinion of askingbox.com. Learn more.

Participate

Ask your own question or write your own articles on askingbox.com. How to do.