voluptas.INCOMPLETE++ホームtipsブラウザ別フォントレンダリングの比較(欧文編)2011.12.12この記事は最終更新日から9年以上経過しています。内容が古い可能性がありますのでご注意ください。APIで遊んでいたら、IE9でのフォントの描画が異様にきれいなことに気付いた。IE9にバージョンアップしたのは結構前だけど、起動することは滅多にないから今まで知らなかった。この際なので主要ブラウザとフォントフォーマット別の表示を比較してみることにした。フォントの描画品質のみをチェック。CSSの解釈がズレる、間違っているといった部分は評価の対象としない。このエントリでは欧文フォントをサンプルにした。日本語フォントの比較は次のエントリで。API)フォントはGaramondと名のつくものを使った。細部は異なるが、大まかなシルエットは同じなので。Premier」を以下のサイトでWOFFに変換したものを使用。Kits検証に使ったHTMLとCSSソースは以下。Garamond';}まずまとめ最初にブラウザごとの結果をまとめて書いてしまう。InternetExplorer現時点では最強かも。どのタイプのフォントを使っても、異様になめらかな描画を実現している。アンチエイリアスのかかり方も、強すぎず弱すぎずでいい感じ。個人的には一番好みの描画。Safariデフォルト設定だと特にOpenTypeが惨憺たるありさまなのだが、オプションで「フォントのなめらかさ」を「Windows標準」以外にすると、さっきの惨状は何だったのかと言いたいぐらいきれいになる。フラットパネルに最適」にして検証した。アンチエイリアスがIEに比べてちょっと強めの印象。Firefox、Chrome、Operaこの3つはほぼいっしょ......というか、多分同じ。こいつらは自分ではフォントのレンダリングを行っておらず、OSに任せてるのだろう。OS任せと言うことで品質はIE、Safariに劣る。OpenTypeとそれ以外のフォーマットでは、描画の差が大きい。3つ共通の傾向として、OpenTypeは他のフォーマットに比べてなめらかだが、アンチエイリアスが効きすぎに思える。なめらかというよりボンヤリ。詳細InternetExplorerフォントのフォーマットを問わず、きれいな描画。中でもWOFFが一番きれいなようだ。Premier」のOpenType版とWOFF版を比較すると、WOFF版の方が字が小さくなってもなめらか。「G」のカーブの部分を見ると分かりやすい。なめらかな分「e」なんかはWOFFだと上の部分がつぶれてしまっている。SafariIE9と同等のなめらかさでフォーマットによる差もほとんどない......というか、差が分からないwしかし、どんなフォントも一回り太くなってしまう。オプションの「フォントのなめらかさ」を「CRTに最適」にすると他のブラウザと同等の太さになるが、今度はアンチエイリアスが効きすぎて、微妙にボンヤリとした印象。いえ気になるほどではないかも。「フォントのなめらかさ」を「CRTに最適」にしたとき「フォントのなめらかさ」を「Windows標準(デフォルト)」にしたとき(OpenTypeがひどいw)Firefox、Chrome、OperaFirefoxChromeOperaこの3つはフォントのレンダリングはOS任せのようなのでまとめて評価する。OpenTypeがいちばんなめらかだが、アンチエイリアスが効きすぎに思える。なめらかというよりボンヤリ。かすれたりつぶれたりしやすい感じ。OpenTypeのものをWOFFに変換するとボケは抑えられるが、ガタつきがでる。長文に使うなら、WOFFの方がまだ読みやすいかも。GoogleFontsAPIで送られてくるデータはIE以外の場合はTrueTypeらしい。確かにTrueTypeとガタつき具合が似ている。TechRacho日本語フォント編に続く。ブラウザ別フォントレンダリングの比較(日本語編)前回のエントリの続き。今回は日本語フォントを比較。比較画像は縮小してあるので、クリックして原寸の画像をチェックしてください。NASAポスター元ネタ探しNASAが作っている映画のパロディポスターの元ネタを調べています。映画好き、洋楽好きの人にご協力いただいけると嬉しいです。コメントをキャンセルメールアドレスが公開されることはありません。河城彰Webやネットワーク、PCのユーザーサポートなどに携わる雑用係。仕事中や身近で遭遇したパソコンやネットのトラブル解決メモ、その他雑多な覚え書きです。基本的に個人用メモなので、掲載している情報の正確性や適切性については保証しません。河城彰Webやネットワーク、PCのユーザーサポートなどに携わる雑用係。仕事中や身近で遭遇したパソコンやネットのトラブル解決メモ、その他雑多な覚え書きです。基本的に個人用メモなので、掲載している情報の正確性や適切性については保証しません。お問い合わせタイトルとURLをコピーしました。