こんにちは。7月にデジクリデビューした、もじもじトークの関口浩之です。
前回の「Webフォント基本講座（1）」では、日本語Webフォントって何？ 日本語ってデータ重くないの？ 画像文字じゃだめなの？ 閲覧者視点で何がうれしいの？ などのお話をしました。
今回は、日本語WebフォントってWeb制作会社やサイトオーナーにとって何がおいしいの？ についてお話します。
前回の「Webフォント基本講座（1）」では、日本語Webフォントって何？ 日本語ってデータ重くないの？ 画像文字じゃだめなの？ 閲覧者視点で何がうれしいの？ などのお話をしました。
今回は、日本語WebフォントってWeb制作会社やサイトオーナーにとって何がおいしいの？ についてお話します。
●Webアクセシビリティ・多言語対応
まず、日本語Webフォントをうまく活用しているなぁと感じるサイトを紹介します。優しさと身近を感じさせつつも上品さを感じる「ハミング」という書体を採用しています。
・小田原市公式ホームページ
<http://www.city.odawara.kanagawa.jp/>
サイトオーナーのコメントをご紹介しますね。
『2013年12月、小田原市公式ホームページのサイトリニューアルに際し、市町村公式ホームページとして日本で初めて日本語Webフォントを導入しました。
Webアクセシビリティ向上のための［文字色変更］や［文字サイズ変更］機能の実現において、画像文字ではなくテキスト（Webフォント）を採用したことで格段に使いやすくなりました。
また、Google翻訳APIを活用し多言語対応しました。画像テキストだった箇所を限りなくWebフォントに置き換えたことで、ブランディングを向上しつつ、テキスト読上げ（スクリーンリーダ）や翻訳への対応が短期間で実現できました。』
日本広報協会の2014年全国広報コンクールにて、ウェブサイト（市部）部門で入選しました。応募が100件以上ある中での入賞は見事ですね。おめでとうございます！
2014年全国広報コンクールの講評コメントも掲載します。
『トップページのデザインが斬新でありながら、災害情報は目立つようにしていて好感度が高い。技術的にはウェブフォントの採用が目を引く。シンプルな背景色と、シンボリックなアイコン／写真の組み合わせはウェブのトレンドが反映され、洗練された印象を与えている。』
●メンテンナンスビリティ、SEO対策、ブランディング
サイトリニューアルの際に、グローバルナビゲーション/見出しなどに極力、画像文字を使用しないテンプレートが最近増えていると思います。また、メインビジュルのキャプション文字も、テキストにするケースも増えてますよね。レスポンシィブデザイン、フラットデザインにも対応しやすいからかもしれません。
画像文字バリバリのページの場合、Webフォントに置き換えには、それなりの作業が発生しますが、テンプレートが変更されたあとは、修正作業は格段にラクチンになりますね。いくつかユーザ事例を紹介しますね。
・日本ケロッグ
<http://www.kelloggs.jp/>
・大江戸温泉物語
<http://www.ooedoonsen.jp/>
・よしもとクリエイティブエージェンシー
<http://ynn.jp/>
・ドラマチック四街道プロジェクト
<http://www.dramaticyotsukaido.com/>
どのサイトも、日本語Webフォントをうまく活用していますね〜。どの部分がWebフォントなのかは、コピペできるかどうかドラッグしてみればすぐにわかります。
また、何の書体を使っているか知りたい際は、ブラウザ上で右クリック（Macならコントロールキーを押しながらクリック）し［要素を検証／要素の調査／要素の詳細を表示］でfont-familyを調べてみてください。書体（font-family名）を予測するのも結構楽しいですよ！
3年前、各社から日本語Webフォントサービスが開始されましたが、Webフォントの表示速度が遅かったので、正直、使う気にはなれませんでしたね…。
でも、これらのユーザ事例のページを閲覧してみると、すいぶん進化したなぁと思うはずです。日本語Webフォントを使用しているサイトなのかどうかも気にならないと思います。
最近、日本語Webフォントが市民権を得つつあるのは、まさにその点だと思います。
それから、Webフォント導入後に、良く耳にするユーザコメントは、SEO対策の効果が出ているってことです。alt属性で画像文字の代替テキストを記述するよりも、Webフォント、つまり、テキスト（hタグやpタグ）で直接表現したほうがSEO対策に効果が出るのは言うまでもありませんね。
だって、Webフォントは文字だもん。
●でも、お高いんでしょう？
FONTPLUSの料金でいうと、入会金が1万円、ランニング費用は1年間有効のプリペイド方式のPVチケットが120万PV分で1万2千円です。※スマートライセンスの場合
たしかに個人で購入することを考えたら高いかもです…。個人でお金をかけずに日本語Webフォントを使いたいのであれば、Webフォント使用許諾OKなフリーフォントを探してくるしかありません。でも、フォントサブセット（そのページで必要なグリフだけ）を配信する仕組みを、自分で実装するのはかなり大変だと思います。
●1契約で複数ドメイン登録可能
FONTPLUSのスマートライセンスは有効期限1年間のPVチケットですが、使用できるサイトは無制限に登録できます。つまり、PV数は分け合えます。PV数が1万PVクラスのサイトなら10ドメイン登録しても月間10万PVです。このケースでは10サイトでランニング費用は月1千円相当です。
FONPLUSのライセンス許諾は企業に対してですので、その企業が管理しているサイトであれば問題ありません。また、購入する企業がWeb制作会社であれば、自分の会社のサイト、業務委託運用している複数サイト、社員のブログサイトで利用しても問題ありません。
なお、管理画面で各ドメインのPV数は確認できますので、クライアントに対しては業務委託費の中の費用項目の中に、それに相当する分を請求するのもいいと思います。
それから、書体は何種類使用しても料金は同じです。でも1ページに何書体も使用するとデザイン性が低下することもあるので、そのあたりはデザイナーの腕の見せ所ですね。
FONTPLUSでは日本の有名フォントメーカであるモリサワやフォントワークス、イワタ、モトヤ、大日本スクリーン製造など、プロフェショナルデザイナー向けの700書体以上のWebフォントがクラウドサービスとして使用できます！ そういうわけで、企業サイトがメインユーザなんです。
企業サイトのWeb担当者の方には「サイトブランディングやSEO対策のためになるんだったら、月1万円は高くないですね〜」と説明しています。でも、「うちのサイトは月数万PVだよ」と言ってくるケースが多いので「だったら、実質1千円/月のランニングコストですよ！」ということになります。入会金1万円はかかりますけど（汗）
以前、こんな質問がありました。「Google Webフォントは無料なのに、日本語Webフォントって無料がないの？」と…。
文字数が100字ぐらいで済んでしまう欧文フォントと異なり、日本語ってPro仕様（Adobe-Japan 1-4）でも15,000字以上あります。漢字、ひながな、カタカナ、アルファベット、記号など。
さらに、プロフェッショナル向けの質の高い日本語書体は、かなりの開発期間を要しています。1書体開発するのに数年掛かる場合もあるそうです。そんな背景を知ると、ライセンス料をちゃんと払おうと思ってもらえるようです。
あっ、フォントメーカさんの声を代弁してみました（笑）
●Webフォントは新しい絵の具
Webフォントは新しい絵の具かもしれません。従来の絵の具は、画像編集ソフトで文字を組んで画像データを作成するタイプ。一方、Webフォントは、マークアップに直接対応した新しいタイプの絵の具。
使用できる書体は筑紫明朝、ニューロダン、スーラ等に限定されますが、無料トライアル版があるので、新しい絵の具を使用したことがない方は、ぜひ、この機会にトライしてみてください。
・Webフォントお役立ち情報、無料トライアル版導入ガイド
<http://goo.gl/xpLnOv>
今回は、自分がFONTPLUSというWebフォントサービスの製品担当なのでFONTPLUSのケースでのお話になりました。他の日本語WebフォントサービスであるTypeSquare、デコもじ、アマナイメージズ WEBフォント、もじでぱ各社、それぞれ特徴があるので細かく調べて比較してみると面白いと思います。
さて、話は変わりますが、秋葉秀樹さんと秋葉ちひろさんが制作した「Webデザイン・コミュニケーションの教科書」が9月15日に発売されます。見出しをみれば今までのWebデザイン本とは一線を画すのがよくわかります。「ツクロアのオモイってヤツが一冊の本になりました」のキャッチもいいですね。
そうそう、なんでそんな話をしたかというと、秋葉さんのインタビュー記事の第1回に、わたくし、掲載されておりました。ぜひ、ご一読ください！
・ツクロア Webデザイン・コミュニケーションの教科書 インタビュー
<http://tuqulore.com/webdesign-communication/sekiguchi.html>
お二人とも見た目も素敵なんですが、仕事に取り組む考え方やデザインやコンテンツに対するアプローチも素敵なんです。あっ、一緒に仕事はしたことないんですけどね（笑） でも、飲んだり、雑談を通じて直感で感じたことは間違ってないですね。
さて、次回は……
僕の大好きな書体のひとつ「丸明オールド」を開発した書体設計家、カタオカデザインワークスの片岡朗さんのインタビューをお届けします。「丸明オールド」はポスターや製品ロゴの文字などでバンバン使われています。誰でもかならず見たことのある書体です。
「丸明」って、もしかして「丸い明朝」のこと？ えっ、丸明朝ってあったっけ？ ゴシックには各ゴシックがあるんだから、明朝にも丸明朝があってもいいよね〜、といことですね。
片岡朗さんの書体設計事務所と書庫アトリエ訪問記って感じになると思います。お楽しみに。
【せきぐち・ひろゆき】sekiguchi115@gmail.com
ソフトバンク・テクノロジー株式会社 Webフォント エバンジェリスト
< http://fontplus.jp/
>
1960年生まれ。群馬県桐生市出身。電子機器メーカーにて日本語DTPシステムやプリンタ、プロッタの仕事に10年間従事した後、1995年にソフトバンクへ転じる。1996年、大手インターネット検索サービスの立ち上げプロジェクトのコンテンツプロデューサを担当。
その後、ECサイトのシステム構築やコンサルタント、インターネット決済事業の立ち上げプロジェクトなどに従事。現在は、日本語Webフォントサービス「FONTPLUS（フォントプラス）」の普及のため、日本全国を飛び回っている。
小さい頃から電子機器やオーディオの組み立て（真空管やトランジスタの時代から）や天体観測などが大好き。パソコンは漢字トークやMS-DOS、パソコン通信の時代から勤しむ。家電オタク。テニスフリーク。
まず、日本語Webフォントをうまく活用しているなぁと感じるサイトを紹介します。優しさと身近を感じさせつつも上品さを感じる「ハミング」という書体を採用しています。
・小田原市公式ホームページ
<http://www.city.odawara.kanagawa.jp/>
サイトオーナーのコメントをご紹介しますね。
『2013年12月、小田原市公式ホームページのサイトリニューアルに際し、市町村公式ホームページとして日本で初めて日本語Webフォントを導入しました。
Webアクセシビリティ向上のための［文字色変更］や［文字サイズ変更］機能の実現において、画像文字ではなくテキスト（Webフォント）を採用したことで格段に使いやすくなりました。
また、Google翻訳APIを活用し多言語対応しました。画像テキストだった箇所を限りなくWebフォントに置き換えたことで、ブランディングを向上しつつ、テキスト読上げ（スクリーンリーダ）や翻訳への対応が短期間で実現できました。』
日本広報協会の2014年全国広報コンクールにて、ウェブサイト（市部）部門で入選しました。応募が100件以上ある中での入賞は見事ですね。おめでとうございます！
2014年全国広報コンクールの講評コメントも掲載します。
『トップページのデザインが斬新でありながら、災害情報は目立つようにしていて好感度が高い。技術的にはウェブフォントの採用が目を引く。シンプルな背景色と、シンボリックなアイコン／写真の組み合わせはウェブのトレンドが反映され、洗練された印象を与えている。』
●メンテンナンスビリティ、SEO対策、ブランディング
サイトリニューアルの際に、グローバルナビゲーション/見出しなどに極力、画像文字を使用しないテンプレートが最近増えていると思います。また、メインビジュルのキャプション文字も、テキストにするケースも増えてますよね。レスポンシィブデザイン、フラットデザインにも対応しやすいからかもしれません。
画像文字バリバリのページの場合、Webフォントに置き換えには、それなりの作業が発生しますが、テンプレートが変更されたあとは、修正作業は格段にラクチンになりますね。いくつかユーザ事例を紹介しますね。
・日本ケロッグ
<http://www.kelloggs.jp/>
・大江戸温泉物語
<http://www.ooedoonsen.jp/>
・よしもとクリエイティブエージェンシー
<http://ynn.jp/>
・ドラマチック四街道プロジェクト
<http://www.dramaticyotsukaido.com/>
どのサイトも、日本語Webフォントをうまく活用していますね〜。どの部分がWebフォントなのかは、コピペできるかどうかドラッグしてみればすぐにわかります。
また、何の書体を使っているか知りたい際は、ブラウザ上で右クリック（Macならコントロールキーを押しながらクリック）し［要素を検証／要素の調査／要素の詳細を表示］でfont-familyを調べてみてください。書体（font-family名）を予測するのも結構楽しいですよ！
3年前、各社から日本語Webフォントサービスが開始されましたが、Webフォントの表示速度が遅かったので、正直、使う気にはなれませんでしたね…。
でも、これらのユーザ事例のページを閲覧してみると、すいぶん進化したなぁと思うはずです。日本語Webフォントを使用しているサイトなのかどうかも気にならないと思います。
最近、日本語Webフォントが市民権を得つつあるのは、まさにその点だと思います。
それから、Webフォント導入後に、良く耳にするユーザコメントは、SEO対策の効果が出ているってことです。alt属性で画像文字の代替テキストを記述するよりも、Webフォント、つまり、テキスト（hタグやpタグ）で直接表現したほうがSEO対策に効果が出るのは言うまでもありませんね。
だって、Webフォントは文字だもん。
●でも、お高いんでしょう？
FONTPLUSの料金でいうと、入会金が1万円、ランニング費用は1年間有効のプリペイド方式のPVチケットが120万PV分で1万2千円です。※スマートライセンスの場合
たしかに個人で購入することを考えたら高いかもです…。個人でお金をかけずに日本語Webフォントを使いたいのであれば、Webフォント使用許諾OKなフリーフォントを探してくるしかありません。でも、フォントサブセット（そのページで必要なグリフだけ）を配信する仕組みを、自分で実装するのはかなり大変だと思います。
●1契約で複数ドメイン登録可能
FONTPLUSのスマートライセンスは有効期限1年間のPVチケットですが、使用できるサイトは無制限に登録できます。つまり、PV数は分け合えます。PV数が1万PVクラスのサイトなら10ドメイン登録しても月間10万PVです。このケースでは10サイトでランニング費用は月1千円相当です。
FONPLUSのライセンス許諾は企業に対してですので、その企業が管理しているサイトであれば問題ありません。また、購入する企業がWeb制作会社であれば、自分の会社のサイト、業務委託運用している複数サイト、社員のブログサイトで利用しても問題ありません。
なお、管理画面で各ドメインのPV数は確認できますので、クライアントに対しては業務委託費の中の費用項目の中に、それに相当する分を請求するのもいいと思います。
それから、書体は何種類使用しても料金は同じです。でも1ページに何書体も使用するとデザイン性が低下することもあるので、そのあたりはデザイナーの腕の見せ所ですね。
FONTPLUSでは日本の有名フォントメーカであるモリサワやフォントワークス、イワタ、モトヤ、大日本スクリーン製造など、プロフェショナルデザイナー向けの700書体以上のWebフォントがクラウドサービスとして使用できます！ そういうわけで、企業サイトがメインユーザなんです。
企業サイトのWeb担当者の方には「サイトブランディングやSEO対策のためになるんだったら、月1万円は高くないですね〜」と説明しています。でも、「うちのサイトは月数万PVだよ」と言ってくるケースが多いので「だったら、実質1千円/月のランニングコストですよ！」ということになります。入会金1万円はかかりますけど（汗）
以前、こんな質問がありました。「Google Webフォントは無料なのに、日本語Webフォントって無料がないの？」と…。
文字数が100字ぐらいで済んでしまう欧文フォントと異なり、日本語ってPro仕様（Adobe-Japan 1-4）でも15,000字以上あります。漢字、ひながな、カタカナ、アルファベット、記号など。
さらに、プロフェッショナル向けの質の高い日本語書体は、かなりの開発期間を要しています。1書体開発するのに数年掛かる場合もあるそうです。そんな背景を知ると、ライセンス料をちゃんと払おうと思ってもらえるようです。
あっ、フォントメーカさんの声を代弁してみました（笑）
●Webフォントは新しい絵の具
Webフォントは新しい絵の具かもしれません。従来の絵の具は、画像編集ソフトで文字を組んで画像データを作成するタイプ。一方、Webフォントは、マークアップに直接対応した新しいタイプの絵の具。
使用できる書体は筑紫明朝、ニューロダン、スーラ等に限定されますが、無料トライアル版があるので、新しい絵の具を使用したことがない方は、ぜひ、この機会にトライしてみてください。
・Webフォントお役立ち情報、無料トライアル版導入ガイド
<http://goo.gl/xpLnOv>
今回は、自分がFONTPLUSというWebフォントサービスの製品担当なのでFONTPLUSのケースでのお話になりました。他の日本語WebフォントサービスであるTypeSquare、デコもじ、アマナイメージズ WEBフォント、もじでぱ各社、それぞれ特徴があるので細かく調べて比較してみると面白いと思います。
さて、話は変わりますが、秋葉秀樹さんと秋葉ちひろさんが制作した「Webデザイン・コミュニケーションの教科書」が9月15日に発売されます。見出しをみれば今までのWebデザイン本とは一線を画すのがよくわかります。「ツクロアのオモイってヤツが一冊の本になりました」のキャッチもいいですね。
そうそう、なんでそんな話をしたかというと、秋葉さんのインタビュー記事の第1回に、わたくし、掲載されておりました。ぜひ、ご一読ください！
・ツクロア Webデザイン・コミュニケーションの教科書 インタビュー
<http://tuqulore.com/webdesign-communication/sekiguchi.html>
お二人とも見た目も素敵なんですが、仕事に取り組む考え方やデザインやコンテンツに対するアプローチも素敵なんです。あっ、一緒に仕事はしたことないんですけどね（笑） でも、飲んだり、雑談を通じて直感で感じたことは間違ってないですね。
さて、次回は……
僕の大好きな書体のひとつ「丸明オールド」を開発した書体設計家、カタオカデザインワークスの片岡朗さんのインタビューをお届けします。「丸明オールド」はポスターや製品ロゴの文字などでバンバン使われています。誰でもかならず見たことのある書体です。
「丸明」って、もしかして「丸い明朝」のこと？ えっ、丸明朝ってあったっけ？ ゴシックには各ゴシックがあるんだから、明朝にも丸明朝があってもいいよね〜、といことですね。
片岡朗さんの書体設計事務所と書庫アトリエ訪問記って感じになると思います。お楽しみに。
【せきぐち・ひろゆき】sekiguchi115@gmail.com
ソフトバンク・テクノロジー株式会社 Webフォント エバンジェリスト
< http://fontplus.jp/
>
1960年生まれ。群馬県桐生市出身。電子機器メーカーにて日本語DTPシステムやプリンタ、プロッタの仕事に10年間従事した後、1995年にソフトバンクへ転じる。1996年、大手インターネット検索サービスの立ち上げプロジェクトのコンテンツプロデューサを担当。
その後、ECサイトのシステム構築やコンサルタント、インターネット決済事業の立ち上げプロジェクトなどに従事。現在は、日本語Webフォントサービス「FONTPLUS（フォントプラス）」の普及のため、日本全国を飛び回っている。
小さい頃から電子機器やオーディオの組み立て（真空管やトランジスタの時代から）や天体観測などが大好き。パソコンは漢字トークやMS-DOS、パソコン通信の時代から勤しむ。家電オタク。テニスフリーク。