Japanese fonts in Windows, Mac, and Linux
Japanese Font Sample
I just found a useful Japanese fonts sample page so post this to share.
Pre-installed Japanese fonts sample of
- Mac OS X Snow Leopard
- Windows 7
- Ubunto Desktop Japanese Remix CD/Ubuntu10.10)
- Fedora 14 Desktop (CD)
- KNOPPIX6.4.4 DVD Japanese
- Vine Linux 5.2
http://rinrin.saiin.net/~aor/fonts/fonts
The samples are all screenshot images, but you can also see on HTML/CSS pages, links are at the very last of this page.
font-familyで日本語フォントを使用するとき(主にメイリオ、ヒラギノ)の注意などまとめ
英語圏のウェブデザイナーに、日本語サイトを構築する際のフォントまわりについて質問されたので、さくっと調べた内容を取り急ぎまとめておく。
メイリオとヒラギノを使ったときに出てくるいくつかの問題点について
MacにMS Officeがインストールされている場合、メイリオや他のマイクロソフトのフォントがインストールされます。
font-familyプロパティでメイリオの優先順位を高くしている場合、メイリオがインストールされているMacでは、当然ヒラギノではなくメイリオが表示されてしまいます。Mac上でマイクロソフトフォントを表示した場合、Windows環境の同じフォントでも見え方が違うので、注意が必要です。(Macのほうが文字が若干大きめになる???文字間がWindowsのほうが詰まって見える???)
また、Windowsにヒラギノがインストールされている環境では、ヒラギノのレンダリングがあまりきれいでないと言う事らしい。(参照:windowsにヒラギノフォントを入れたら表示がエライことになってしまった件)
なので、ヒラギノの優先順位を高くする場合にも注意が必要。
試しに、メイリオの優先順位が高いサイトのスクリーンショットを比較してみました。(3年前に勉強しながら作ったサイトだから、細かいところはあまり突っ込まないでください笑)
拡大表示するとわかると思いますが、IE8の表示のとき、異様に文字サイズがデカイ(笑)。
これらをコントロールするには、環境ごとに個別指定するという方法があるようです。
ところで、皆さんはフォント指定ってどうしてるんでしょう?
と思って調べたら出てきました。
ここに「CSS Nite LP9 連動 第2回コーディングコンテスト」の入賞者の指定方法をまとめた「資料:日本のコーダーのfont-family指定」が載ってました。
なるほど、皆さん試行錯誤しているようです。
その他参考サイト
- CSSのfont-family:ヒラギノとMS Pゴシックとメイリオの悩ましい関係
- Chrome18とヒラギノで起こるアンチエイリアス問題について
- これってIE8の不具合なんじゃね・・・?文字の大きさが勝手に変化するよ?
この問題は過去にぶち当たった経験有り。マウス操作で文字のサイズがぴくぴく動いたりして、めちゃくちゃ気持ち悪い。
私の場合
特別な理由が無い限り日本語フォントは指定せず、ラテン系のフォントと”serif”又は”sans-serif”の指定のみの場合がほとんどです。(そうするとデバイスフォントの優先順位が高いものから適用されるはずなので)だがしかし・・・・
日本語フォントを指定しない場合の表示サイズ問題
今回色々調べてみると、文字コードがUTF-8の場合日本語フォントを指定しないと、IEでは11px指定のフォントが12pxで表示されるという情報を発見!
なんてことだ・・・。
webfontを日本語サイトで使う:WordPressなど動的ページの場合まとめ(2012年7月)
1) fonts.com
2012年7月現在、日本語フォントを提供しているフォントメーカーはDynacomware(フォント見本 http://www.fonts.com/font/dynacomware)のみ。
※去年はタイプバンクなども使えたのですが、撤退したようです。撤退前に使用設定したサイトでは現在も表示可能ですが、新規のセットが作れない模様。
2) FONT+
日本語、中国語を提供。ラテン系フォントは無し。
扱っているフォントメーカーは
フォント見本 http://webfont.fontplus.jp/service/fontlist
WordPressなど動的ページを使用する場合には「スマートライセンス」以上のプラン契約が必要。http://webfont.fontplus.jp/service/plan
フォント表示demo http://webfont.fontplus.jp/data_sample/smart_ex.html
3) Typesquare
モリサワが行っているサービスに付き、モリサワフォントのみ提供。将来的には子会社のタイプバンクとリョウビフォントを扱う可能性ありか?
プランは基本的にPV数によってプランを選ぶ、、、事になっている。
新規サイトでアクセス数が見積もれない場合には、ミニマムプランを選んで、PV使い果たしたら追加購入・・・という方法が一番ムダがなさそう。だが、PV数を使い果たしたあと、自動更新機能が無いため、知らないうちに使い果たしてしまうと再購入するまでデフォルトフォントになっちゃうってのがつらい。PV数毎日監視してなくちゃならんし・・・面倒だし非現実的な気がする。
料金体系の改善を求む。。。
4) デコもじ
日本語、ラテン、中国語、韓国語が使用可能。メジャーなフォントメーカーとしては
が含まれます。法人/月間30万PV以上の場合は、自動的にプレミアムプランとなり、料金はお問合わせ・・・となってます。
webfontを日本語サイトで使う
ということで、いろいろ覚え書き
日本語が使えるwebfontサービス
デコもじ
fonts.com
FONT+(フォントプラス)
サービス内容比較表
— | fonts.com | デコもじ | FONT+ |
---|---|---|---|
フォント数 | 7710 | 323 | 328 |
無料トライアル | ○ | ○ | ○ |
支払い方法 | 月額 $10.00〜 | 月額 ¥1,575〜 | 月額 ¥1,050〜、 プリペイド ¥12,600(120万PV) |
その他参考サイト
日本でも、大手のフォント会社がwebfontのサービスしてくれたら一気に普及すること間違いなし!だと思う。なのでタイプバンクがデコもじ、fonts.com両方で提供してるのはちょっと感動しました。
実際「デコもじ」のトライアルアカウントでテストサイトに日本語を適用してみた所、覚悟していたほど遅延は感じられず。
さすがに1サイトで数書体を同時使用するとやっぱり重くなるので現実的ではないにしろ、1書体ぐらいなら何とかなるんじゃないかという感触。
【2011/8/2追記】
新しいサービスが増えた模様。今度はフォントワークスです。でも少し高い・・・・
【2011/9/29追記】
遂にモリサワも参入!2011年内にサービス開始予定だそうです。typesquare.jpのドメインをモリサワが既に取得済みでした〜。
月額1000円ぐらいで、フォントプラスみたいに年間縛りとかないといいのだが。。。きっとお高いのだろうなぁ。。。(涙)