font-familyに指定する英語フォント

　コジャレなサイトのためのフォント選択を小ネタのつもりで書いたら、意外と反応があったので、ちょっとまとめてみます。
はてなダイアリー - おまえにハートブレイク☆オーバードライブ : コジャレ vs ヤンキー
はてなダイアリー - アクティブにいきたいねと思いつつ日記 : コジャレサイトにな（略）そのさん（フォントの話）

　ウチのサイトでは、「Verdana」を基本に、「Arial Black」（1バイト文字のみで強調したい場合）、「Century Gothic」（メニュー部分）、「Times New Roman」（日付表示）（※名前に空白が入るフォントをスタイルシートで指定する時は""で囲む。ただし、一つのみの場合はいらない）を使い分けているんですが、Century Gothicはファンシーですか!　Futuraみたいに曲線が少ないから、かっこいい方になると今まで思ってました…。

全標準フォント一覧 / もうパンツはかない
　こちらでOS XとWindows XPで標準搭載されているフォントがわかります。

　Windows、Macintosh、どちらでもオッケーな英語フォントをちょっとならべてみました。上が普通、下はfont-size:largeです。ただし、もともと本文はfont-size:95%になっています。文字サイズ標準でfont-size:largeになると、どのフォントも太めになり、見た目がかなり変わるので、その辺を意識して使うとデザインしやすいです。

■Verdana
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
　「Verdana」がよく使われる理由は下のページを参照のこと。文字サイズが小さい時にVerdanaは利点が出てきます。
HotWired Japan : Webmonkey : graphics_fonts : ウェブ・タイポグラフィー・チュートリアル――第2日(第1回)

■Arial
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
　「Verdana」に似ているけど詰まり気味。

■Arial Black
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
　これにBold指定をかけるとちょっとうるさい。

■Century Gothic
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
　細くてちょっと頼りないのでBold指定をかけてみました。Bold指定かけた方が幅が狭いというのが不思議。

■Times New Roman
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
　Operaだと日本語が明朝に。

■Comic Sans MS
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
　これこそファンシーなのではないかと!

■Lucida Sans Unicode
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
　これはWindowsのみのもの。IEだと日本語本文が強制的にMS UI Gothicに。

■Trebuchet MS
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
1234567890 ABCDEFabcdef あいうえお
　これもWindowsのみのもの。TypePadのデフォルトスタイルで指定されているフォントです。

　CSSはソリッドなデザインに強いから、どうしてもコジャレ系になっちゃって、栗原さんの言うようなヤンキー臭いデザインは難しそうです。とりあえず紫色を多用すると、ヤンキー（というか族臭い）のではないでしょうか。あと文字は太めの明朝とか。