Webpage font choice
One thing I was told in design school was that limitations and restrictions are just as critical to good design as creativity and freedom. The first step in the design process is to mold these restrictions into a framework that you will design within. One professor told me that the more stringent the boundary, the easier it would be to design. I may have wrinkled my nose at the time, but logic dictates this to be true.
If someone tells you that you can only use red, rectangular shapes in your design, you may not like it, but it eliminates a lot of decision-making and experimentation. And, it is because of this that many graphic designers don’t like to design for the web. There are too many boundaries that must be respected. I won’t get into anything technical with browsers and color today, but focus on typefaces. This is the limitation that I am least fond of, to put it mildly. Part of my design training was to learn about the history, use and potential of a large number of typefaces in use since the development of the printing press. We, as young designers, discovered a whole new world of typographic communication.
Some typefaces were designed to be easy to read, others to grab attention, and more to convey a certain emotion. I experimented and explored and discovered meaning in their use. Today, as a web designer, I am limited to fewer fonts than I have fingers on both hands. Why? Because behind every typeface is a real person behind it that labored long and hard to design it, and naturally they should be compensated for their work. When it comes time to design something new, part of this process involves finding just the right typeface, and purchasing it for use in my work. When my work is on the web, however, with millions of people viewing it (theoretically), the typeface I choose would have only been purchased once, by me. And so….the only typefaces that are displayed, are the ones that you have installed on your own computer, and what I, as a designer, have to choose from is the fonts that come natively installed on Mac and PC.
In other words, people can only view type in a font that they already have the rights to use. Without starting a discussion as to the pros and cons of this situation, I’m going to accept it and move on to what is possible right now, while remaining hopeful for the future. As things stand as of this writing, the most reliable fonts I have to choose from when designing a website (in alphabetical order) are: Arial, Helvetica, Georgia, Lucida Grande (Mac Native), Lucida Sans Unicode (PC only) Times, Trebuchet MS and Verdana. (You can see them in order of appearance below.)
This is not to say that people don’t have other fonts installed on their computers, it’s just that they won’t all have the same ones installed. Almost everyone has the above list installed. To see what these typefaces look like in depth, visit TypeChart, a handy tool for web designers making these tough decisions! This doesn’t mean that as a designer I cannot specify another font in addition to these, hoping that someone might have it installed and that it will display instead of the more basic ones, but this is a big maybe, isn’t it? Each typeface will display a bit differently, and may affect how you will want to style it on the page. I have found that serif typefaces like Times will need to be about one-half to a full point size larger to have the same readability as a sans-serif font like Helvetica. This is just one example of many situations a designer will come across when trying to design a readable, pleasing page.
Nothing stays the same forever, however, and many intrepid programmer/designers are working behind-the-scenes to remedy this wretched situation. One of them is Shaun Inman, who conceived of a font replacement method called sIFR (scalable Inman Flash Replacement) that has been developed (and is continuing to be developed further) by an dedicated group of people I’m very glad are devoted to this. This method does require Flash and javascript be installed and turned on to work, but causes no adverse affects to your page if your visitor does not have these technologies at hand. The sIFR method allows for text to be selectable (which search engines like) and stylable (which designers like), and degrades gracefully (you see a page normally if the sIFR text can’t display).
For clients that want sIFR text on their page, it costs a bit extra to implement, but the results can be that much more effective. And for those web designers craving one less restriction, it’s like a big blue sky after a day of rain.