Using Cufon for Text Replacement

Up until a few days ago I didn't realize that you could use canvas tags for text-replacment, but then I read this article.

http://kilianvalkhof.com/2009/javascript/cufon-vs-typefacejs-which-one-is-better/

Since reading about this article I've want to play with Cufón to see how it stacks up. Here's a little example for you.

Using Cufón for Text Replacement, an Example

and the source (SF_Foxboro_Script_400.font.js generated at http://cufon.shoqolate.com/generate/ ):

<script src="http://cufon.shoqolate.com/js/cufon-yui.js"
    type="text/javascript"></script>
<script src="/code/cufon/SF_Foxboro_Script_400.font.js"
    type="text/javascript"></script>

<script type="text/javascript"><!--
    Cufon.replace('h1');
// --></script>

Not the greatest example, but it works.

In conclusion, I like this approach in theory. I'm still not sure if it is a "too fast to notice", so I think I'll stick to the ugly web-fonts—but I love the fact that people are stepping outside of the box and being unconventional. Props for that!

Related Posts