Brands, marketers and designers have long struggled with maintaining brand standards on the Web. For years there were two main challenges: colors and fonts. Because a designer cannot know what fonts an end user will have installed on her machine, the designer has had to utilize primarily system fonts like Arial or Verdana – unless they were creating graphics. But even in a world of high-speed Internet connections, it’s still not a good idea to create an entire webpage that uses only graphical text. Since about a year ago Web designers’ dream of the concept “Web-safe fonts” has become as anachronistic as the concept of “Web-safe colors.” Monitors have long been able to display more than 256 colors, and now the font barriers have begun to break down too.

With the release of the Firefox 3.5 Web browser in June 2009, the Web was introduced to @fontface. This feature allowed designers to display fonts hosted on their own servers to any site visitor who is using Firefox 3.5 or higher. As of July 2010, Firefox has 23% of the global market share – but that still leaves almost 80% of the audience seeing Arial, Verdana or other Web-safe fonts. In addition to the lower market share, there were also licensing issues that limited which fonts could be used. Most current font license agreements don’t allow you to redistribute the fonts to others, which is an aspect of how this feature works, as even its creators acknowledged.

Now there are newer and more reliable options for website typography. Three key programs that have come to the forefront are TypeKit, Google Font Directory and Fontdeck. All allow designers a wider selection of fonts to choose from when designing HTML pages without having to resort to using bandwidth-clogging and search engine–unfriendly graphics or Flash. Since TypeKit announced a partnership with Adobe in mid-August, some of the licensing challenges may be clearing up.

As sites undergo major redesigns in Q4 2010 and all of 2011, we should begin to see this technology become more mainstream. Already we are seeing use of these font technologies on sites like http://media.twitter.com and smaller websites created mostly by developers and designers. According to TypeKit, the New York Times and Harvard Business Review (HBR) websites utilize this technology, but it’s not obvious when looking at the websites. If you dig into HBR.com you might notice that they are using TypeKit to enhance the H1 headline on internal pages, but it’s pretty subtle right now. Oddly, on the post promoting the new Google Font Directory, they are using a graphic to display the pretty font, not their own engine. There are also some tips which you should keep in mind while developing your site.

Implications and Action Items

As promising as these technologies are for enhancing the visual experience of websites, there are limitations to consider. We recommend you:

Evaluate the service, including pricing, fonts available, cross-browser compatibility, load times and service stability—both technically and financially.

Ensure the service you choose will be around as long as your website uses the fonts.

Plan for what happens when the service either fails temporarily or has a catastrophic failure.

Allow for ample time to bug-test the site across multiple browsers and bandwidth speeds.

Test on landing pages and small micro-sites before engaging in a full website redesign that incorporates the technology.

Communicate with your client or agency well in advance to ensure that all parties understand the options.

For More Contact A-1 Internet Design