The short answer to this question is there is no real defined answer. There are many factors that need to be considered such as the market you will be working in, what kind of systems you have in place and of course, what is your budget.

A recent publication by FontShop.de (yes, its in German – but you can still see the font names and list easily) listed the following as the Top 10 fonts of all time

1. Helvetica
2. Garamond
3. Frutiger
4. Bodoni
5. Futura
6. Times
7. Akzidenz Grotesk
8. ITC Officiana
9. Gill Sans
10. Univers

My personal recommendation

If I was starting out a career in design today I would start out with 6 complete font sets and gradually build a collection over time. I would make sure that the 6 font sets I selected were usable for both print and web work and we fonts that can have a wide scope of usage. I would also purchase OpenType fonts where possible. When selecting your essential font sets, remember you can always get special ‘one-off’ use fonts from free sites like dafont.com when you need them, so make sure you have a solid collection of these essential workhorse fonts. I recommend getting 2 serif, 3 sans-serif and 1 calligraphic (scripted) font set to ensure you have some variety.

My Essential 6 Font Sets

1. Helvetica Neue (sans-serif)
2. Adobe Garamond Pro (serif)
3. ITC Cheltenham Std (serif)
4. Eurostyle LT Std (sans-serif)
5. Futura (sans-serif)
6. Snell Roundhand (calligraphic)

Your personal preferences to fonts may be different, and you might prefer FF Din over Eurostyle LT or Warnock Pro over Adobe Garamond Pro, but that is the beauty of design.

Fonts For Students

We all know life as a student can lead you to cutting corners financially just to get by. So, if your on a tight budget, here are some free fonts that you can use to get your collection started.

1. Fontin Sans (sans-serif) http://www.josbuivenga.demon.nl/
2. Bitstream Vera Sans (sans-serif) http://www.dafont.com/bitstream-vera-sans.font
3. Gentium (serif) http://www.dafont.com/gentium.font
4. Pigiarniq (sans-serif) http://www.tiro.com/syllabics/resources/index.html
5. Lido STF (serif) http://www.myfonts.com/fonts/storm/lido-stf/
6. Exmouth (calligraphic) http://www.dafont.com/exmouth.font

I hope this helps you start off or add to your font collection.

This made me think a little bit about font choices and that perhaps sIFR which I wrote about previously has a much greater importance than any other typography method currently used on the web. So, let’s have a quick look at the font survey results for PCs and Macs:

On Windows based systems, the top 5 installed fonts were:

1. Arial Black (95.40%)
2. Verdana (94.10%)
3. Comic Sans MS (93.80% – ‘cringe’)
4. Arial (93.76%)
5. Courier New (93.54%)

On Mac systems they were:

1. Monaco (96.15%)
2. Arial Black (95.61%)
3. Arial (95.48%)
4. Courier (95.48%)
5. Helvetica (95.31%)

My favourite three fonts are Trebuchet MS, Georgia and Times New Roman. This is how they ranked:

• Trebuchet MS – Win (90.72%) – Mac (91.29%)
• Georgia – Win (83.78%) – Mac (90.79%)
• Times New Roman – Win (78.19%) – Mac(88.27%)

What really surprised me is that Times New Roman was only installed on 78.19% of Windows systems but on 88.27% of Mac systems. I also expected Georgia to rank a bit higher on Windows based systems than what it has in this survey.

So what does all this mean? Well, basically it is not safe to assume that a user will have the font you are intending to display on your website. Even with modern computers, CSS and rich websites, something as simple as knowing a user has a font is still not 100% certain, in fact, no single font rated 100% installation. Based on these findings though, it seems fairly safe to make the following assumptions:

1. Arial and Arial Black are extremely popular on Windows and Mac systems.
2. Times New Roman is not as a safe font as most would think, being installed on less than 8 out of 10 Windows systems that participated in this survey
3. The default fonts included with the operating system and with office suites seem to be the ones that have the highest install rates
4. When dealing with CSS, it is ESSENTIAL to offer at least a secondary font name when defining your styles. eg: [Tahoma, Arial, Helvetica] or [Georgia, Monaco, "Times New Roman"]

The above heading is in fact a H2 HTML element. It is created using sIFR (Scalable Inman Flash Replacement) which essentially is a JavaScript and CSS file that uses DHTML to replace HTML elements on the fly. It was initially created by Shaun Inman but it has been taken and developed further by Mike Davidson and Mark Wubben.

The developments of sIFR are quite exciting and I have managed to use it on a few of my projects, including GTCasino.com. I think that this technique is just the start for exciting, rich typography on the web. Good bye Arial!

To read more about sIFR, visit the sIFR page on MikeIndustries.com.

Fontin

Delicious

Kaffeesatz

Lido STF

Piginarqi

Silkscreen type family

Proggy Squared