Fonts have long been the bane of web design. For years, web designers were stuck with Arial, Verdana, Georgia, and a few others if they wanted a design that looked consistent for most users. If you wanted to get around the font issue and use something more visually appealing, your options were limited and often unreliable.
One option was a site completely designed in Flash, which allows you complete control over fonts. While Flash sites look cool and have fancy things that blink and move and make noise, they are terrible for search engine optimization (SEO). For the most part, SEO is what it’s all about. After all, the point of having a website is to get people to visit it, learn more about your product or service and maybe even make a purchase. If the search engines can’t find your fancy Flash site, then neither will your customer. So, Flash is out as a means of controlling what fonts users see.
A second option is using a method known as Flash replacement (sIFR). This method allows designers to select whatever fonts they desire. However, this too comes with it’s own limitations including large file sizes, difficulty controlling multiple lines of text, and unreliability when used as hyperlinks. So while this method has it’s place, it’s just not a viable, large scale solution.
Enter @font-face and CSS3! Indeed, the future of web fonts is here! … well, sort of. The @font-face CSS declaration allows designers to specify any font for use anywhere on the site and have it look perfect 67% of the time. Yup, there’s the rub. You may have guessed already, but Internet Explorer 6,7, and 8 are the 33% (the current percent of internet users on IE) where this new font method will not work. There is good news however. Internet Explorer 9, which is slated for release in 2011, will indeed support @font-face. By that time IE 6 & 7 will be barely breathing with IE 8 close to it’s grave as well! And with that, web designers can reliably create stunning web typography.
So what does this all mean for web designers today? Simple, start using @font-face today and feed old-school web fonts as back up for all flavors of Internet Explorer. There’s a reason why Firefox, Chrome, Safari, and Opera continue to grow in popularity while all versions of IE decline. Designs just look better in these “modern” browsers. My suggestion? Download Firefox (or Chrome, Safari, or Opera) today and see the improved look over IE with most of our recent designs. We’ve been using @font-face (and other CSS3 trickery) for months and find it to be the best way to an improved design while still keeping the site relevant with search engines.
