This is my third test of font-replacement tools for the web. This time it’s time for the oldie Sifr. After Shaun Inman left the sifr project it was taken over by Mark Wubben. I won’t talk to much about sifr, because I guess you all are really familiar with it by now. So let’s look at the result.

Please pull up new tabs/windows of the Cufon and Flir also to compare how the font is being rendered. It’s quite interesting that it could be presented in so many different ways. Hopefully when @font-face is fully supported in different browsers and when those browsers has hit a critical mass in usage we can start using the CSS3 font-face.

Time to try out a other custom font web intergration, this time it’s Flir.

“Facelift Image Replacement (or FLIR, pronounced fleer) is an image replacement script that dynamically generates image representations of text on your web page in fonts that otherwise might not be visible to your visitors. The generated image will be automatically inserted into your web page via Javascript and visible to all modern browsers. Any element with text can be replaced: from headers (<h1>, <h2>, etc.) to <span> elements and everything in between!”

My implementation can you find here. You can compare it to the Cufón test I made earlier, you will find that one here.

So what’s the main difference between these? Flir is using PHP and the GD library in PHP to read ttf/dfont/opt files to generate images of these, while Cufón is using VML to generate text based on font files converted to JavaScript.

So far I think Cufón is doing a better job.

Trying out the new, and hopefully the future of custom text replacment on the web. Cufon is a JS replacement only, not relying on any third party like Sifr3. It works by creating VML in the HTML5 canvas element.

If you want to see my test results go here. This just took a easy 20 min to setup, compared to sifr3 it’s FAST to get going with Cufón.