cufonの使いどころは、CSS3の@font-faceが使えない場合。ただし、日本語は非対応だよ。

ChromeやSafari、firefoxではCSS3の@font-faceが使用できる。

そのため、cufonを使わずとも、先日のエントリーで書いたように、適用したいフォントがPCにインストールされていなくても、@font-facesを利用してWebFontを使うことで、特定のタグに特定のフォントを適用することができる。

■htmlファイル

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<title>cufonの使いどころ。結局、IE対策なのね。</title>
	<link rel="stylesheet" type="text/css" href="style.css"/>
</head>

<body>
<h1>◆cufonの使いどころ。結局、IE対策なのね。◆</h1>
Let's use @font-face!<br/>

<div id="fontFace">
Transformed div area By WebFont and font-Face.
</div>

<!-- javascript-->
<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="lib/cufon-yui.js"></script>
<script type="text/javascript" src="font.js"></script>
<script type="text/javascript" src="ChunkFive_400.font.js"></script>

<script type="text/javascript">
//@font-faceで定義したTestFontsが使える
$('#fontFace').css('font-family', 'TestFonts');
</script>
</body>
</html>

■CSSファイル

@font-face {
	font-family:TestFonts;
	src:url(Chunkfive.otf) format("OpenType");
}
/*
body {
	font-family:TestFonts;
}

しかし、IEの場合、@font-faceを使うことができない。
そこで、cufonの出番となる。その場合、@font-faceによってフォントがインストールされているかどうかを判断して処理を分ける必要があるので、font.jsを利用した。

htmlソースは下記（CSSは上記と同じ）。

<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<title>cufonの使いどころ。結局、IE対策なのね。</title>
	<link rel="stylesheet" type="text/css" href="style.css"/>
</head>

<body>
<h1>◆cufonの使いどころ。結局、IE対策なのね。◆</h1>
Let's use @font-face!<br/>

<div id="fontFace">
Transformed div area By WebFont and font-Face.
</div>

<!-- javascript-->
<script type="text/javascript" src="jquery-1.5.2.min.js"></script>
<script type="text/javascript" src="lib/cufon-yui.js"></script>
<script type="text/javascript" src="font.js"></script>
<script type="text/javascript" src="ChunkFive_400.font.js"></script>

<script type="text/javascript">
$(document).ready(function() {
font.setup(); // run setup when the DOM is ready
	if(!font.isInstalled('TestFonts')){
		//fontがインストールされていない場合はcufonを使う
		Cufon.replace('#fontFace', {fontFamily: 'ChunkFive'});
	}else{
		//それ以外の場合は、@font-faceがフォントを適用してくれる
		$('#fontFace').css('font-family', 'TestFonts');
	}
});
</script>
</body>
</html>

結局、IEが@font-faceに対応してくれれば良いのにという結論。
cufonは日本語には非対応なので、上記コードは完全なるIE対応にはなっていない。日本語が含まれている文字列の場合、ChromeやFirefoxでは日本語も含めて全て表示されるが、IEの場合は日本語だけが表示されないので。