The web is getting creative and beautiful. You can find a variety of new font’s being used across the web making the site look beautiful and creative. There are various font replacement techniques available online now. One of them is SIFR but it needs flash to be working and also the set up isn’t that easy. That’s where Cufon comes into picture claiming to be better and easier than most of the previous font replacement techniques.
Cufon is one of the latest font replacement techniques which claims to be easy and faster, and does not depend on Flash too.
Steps to implement Cufon Fonts
As the developers of Cufon claim, implementing Cufon is much easier than SiFR. You can follow the below listed steps to implement Cufon on your site.
Secondly, you’ll have to convert your font file. You can do that on Cufon’s website. Select and upload the files that you want to convert.
Step 3. (optional)
Thirdly, fill in the “Security”, “Performance and file size” section if required (Optional step). Default values are more than enough in most of the cases. Do not alter these sections if you are not sure about what you are doing.
If you notice, we have passed ‘h1’ as parameter to the replace function. This will replace all the ‘h1’ tags in the page with custom font. You can also pass multiple elements as a comma seperated value as given below
Cufon.replace('h1,h2,#main-nav li'); // A css selector like "#main-nav li" can be used if jQuery is used.
Cufon Problem in IE
Few versions of IE usually have bugs with Cufon. You can fix that by adding the following code.
Cufon IE9 Issue
Cufon has an issue of not showing up with certain versions of IE 9. You can fix it by using the following code before the Cufon.replace() calls.
Using multiple fonts in Cufon
The above code would add font “Frutiger LT Std” to all ‘h1’ tags on page and font “Myriad Pro” to all the ‘h2’ tags.
I must say that Cufon has really made including custom fonts on the webpage an easy task. It is mush easier when compared to other few font replacement techniques. But the only issue I find is that you we can not copy the text implemented through Cufon, which I guess is fine in case your users are not keen on copying content.