Here’s the situation: You’ve just finished a website design and got it looking perfect. You want to show everyone you know, so you bring it up on every computer you can get your hands on. But for some reason the font is different on those computers. You might be have been caught without the font. It happens to a lot of people.  You find the prefect font for the job, but most people won’t have it. How do we get our visions to display the way we want, instead of throwing up Arial or Times?

Luckily, many people are frustrated by this problem; enough to have multiple solutions out there to choose from. We’ll be looking at using basic image replacement, SiFR, and Cufon to solve this issue.

Using basic image replacement, we can generate text as an image using server-side scripts. This technique has a lot of different implementations, including a Javascript piece to replace the existing text as to not completely mess up your SEO. While this option ensures the greatest compatibility, it can also greatly decrease some functionality of  certain actions, such as copy and paste, and text zoom. That’s right, use this and your text will become chiseled to your website.

SiFR follows a very similar approach as the image replacement, except this method uses Flash to render the fonts. This is a plus if you don’t have server-side scripting capabilities, but a downfall to all of you non-Flash users. This method also keeps links, copy and paste and text zooming intact. With SiFR, your SEO still remains intact as it’s implemented through Javascript, which adds the extra requirement.

On to our next contender, Cufon. This one is strong: it supports text zoom, SEO compatibility, and doesn’t require Flash. There’s still no copy and paste availability (may be remedied by the time of reading this) and requires Javascript, but nonetheless, it is a strong start. The fonts are completely stored and rendered using a proprietary Javascript engine.

So we still haven’t found a perfect way of using embedded fonts in our websites. If only there was some standard CSS support for it, something like @font-face. For those of you who don’t know, there is standard support which covers absolutely everything, looks great, and is not reliant on anything except the browser. Just link to the font file and poof, it works. Unfortunately, if you want to use any decent fonts, this will most likely be against your licensing for the font.

So until we get some licensed fonts available, we’ll have to remain with these alternatives.