2014.04.02
モリサワ「TypeSquare」を使ってみました
Permalink : http://blog.mabataki.jp/logue/1371
モリサワが提供しているウェブフォントサービス「TypeSquare」が、MORISAWA PASSPORTのメンバーであれば年間1,000万PVまで無料で使えるということを知って、試験的にこのブログに導入してみました。英語などのアルファベット圏ではすでに定着しつつあるウェブフォントですが、日本語は字数が膨大なので欧米と同じ方式で普及しづらいのが現状。しかし注目べき技術のひとつではあるので、現状バージョン（2014年4月）のTypeSquareの使い勝手など雑感を書いてみたいと思います。
– – – –
1. 導入までの煩雑さ
気軽に使えるGoogle Fontと違って、なかなか面倒です。まずはMORISAWA PASSPORTのアカウントにCD-ROMから（！）アクセスして、TypeSquareの利用を申請、利用開始のメールが届くと実際にモリサワフォントがウェブ上で使用できるようになります。
使用するドメインをいちいち管理画面から登録する必要があるのがネックで、この仕様が影響してローカル環境にあるHTMLからは書体の見え方がチェックできません。実務では一旦書体を無視してコーディング→テストサーバへ上げてから見え方を検証というフローになると思います。
（また、太字は太字で別途font-familyを指定する必要がある点にも注意）
– – – –
2. 年間1,000万PVという制約
この1,000万という数字は「スタンダードプラン」「セルフホスティングプラン」それぞれ500万ずつの合計という意味らしく、後述のようにセルフホスティングプランは実質的に役立たずなので、実際の有効上限PVは500万ということになります。これを超えてもウェブフォントが配信停止になるだけでサイトの閲覧そのものには支障がないですが、1日約13,000PVと考えると複数サイトでの使用は躊躇われるパターンが出てきそうです。
– – – –
3. セルフホスティングプランは使い物にならない模様
「セルフホスティングプラン」は専用のアップローダーからHTMLとCSSを上げる→返ってきたファイルをFTPで上げるという仕組みで、動的生成のコンテンツには使用できないようです。つまりWordPressのようなCMSでは使えず、includeを使っているようなサイトでもいまいち導入しづらいかもしれません。もちろんHTMLを更新する度にこの手順を繰り返す必要があるので、実質的には「スタンダードプラン」一択のサービスですね。
– – – –
4. 書体のバリエーションと表示
メジャーな書体はだいたい揃っています。本明朝や秀英明朝、A1明朝など明朝体のキャラクターが多様なのが嬉しい。「スタンダードプラン」の場合はどうしてもページが表示されてからウェブフォントが適用されるまでのタイムラグがあって、ちらついて見えてしまうのが玉にキズ。
– – – –
5. ウェブフォントの可読性
僕が日本語ウェブフォントを入れる上で一番心配していたのが可読性です。モリサワの書体の多くは印刷媒体用に生まれたもので、級数を詰めるとスクリーン上で潰れてしまう場合があるのです。
ウェブフォントのメリットが一番活きるのはやはり見出しや本文あたりで、級数が大きく文字詰めをしっかりしたい箇所は、CSSよりもIllustrator上で調整して画像化してしまったほうが手っ取り早く美しくできます。そうなるとやはり可読性が気になり。。。
結論からいうと、Retinaディスプレイでは非常に美しく表示され全く問題ありませんが、非Retinaでは潰れやすい文字が数割あります。そういう意味では画像を多用しづらく、キャラクターの差を出しにくいスマホサイトの方が現状では日本語ウェブフォントの使用に向いているのかもしれません。
– – – –
6. 最後に
現状ではどうしても発展途上という感じが否めないですが、やはり日本語でも書体が自由に選べるというのはいろいろな表情が出せておもしろいです。
モリサワの古めの書体では半角英数字が痩せてて美しくないものが多いですが、これはfont-familyの指定で先に他の欧文書体を指定することでIllustratorの合成フォントのような使い方をすることもできます。このブログではメインを本明朝+Times、太字は前述の非Retina環境での可読性を考慮して秀英丸ゴシックにしました。
※2015年にブログのデザインをリニューアル、秀英角ゴシック銀とHelveticaの混植としました。
今後もっと気軽に、ウェブ媒体でもいろいろな書体が使えるようになるとよいですね。
