ブログ

fonts.comの日本語Webフォント「AXISフォント」を導入してみた

fonts.comの日本語Webフォント「AXISフォント」を導入してみたら、学生さんから「どんなフォントを使っているのですか?」と質問が来たのでブログ記事にしてみます。

fonts.comとは

海外のWebフォントサービスです。海外のベンダーさんには珍しく日本語Webフォントを扱っています。ちなみに、日本語にローカライズされていますが、翻訳がものすごく変です。
取り扱っている主な日本語フォントは次の通りです。

変わったフォントとして、なぜか「MS ゴシック」「MS 明朝」シリーズも取り扱っています。

fonts.comを使ってみるときに知っておく点

  • 無料で使えますが、バナーが表示されます。そして、日本語Webフォントは使えません。
  • 有料プランにするときに入会金などは必要ありません(他のサービスでは入会金が必要なものもあります)。
  • 有料プランにアップグレードすると月額10ドルで導入できます。1年契約・3年契約にするとおトクに使えます。
  • 有料プランにアップグレードすると日本語フォントが利用できます。
  • たまに3年契約しませんか?というオファーメールも来たりします。そのときは通常の3年契約よりおトクに使えます。
  • 1年契約・3年契約にするとセルフホスティングサービスが使えます。利用しているサーバーにWebフォントをアップロードして利用できます。しかし日本語フォントは容量が重いので全然無意味です。

fonts.comの日本語Webフォントのパフォーマンスは?

1年契約・3年契約にするとセルフホスティングサービスが使えます。しかしCSSファイルでのインポートは現実的ではありません。ファイル容量が大きくなります。JavaScriptファイルでの読み込みが現実的でしょう。

fonts.comでは、CDNサーバーを東京にも用意しているようですので、パフォーマンスがすごく遅いということはありません。

日本語のWebフォントは、どのサービスでも文字数の関係からパフォーマンスがよくないです。見出しだけ、など必要な部分のみ導入しましょう。

fonts.comをWebサイトに導入するときに知っておくこと

  • fonts.comでは、Webサイト1つを1つの「プロジェクト」として扱います。
    このとき日本語と英語で別のプロジェクトとして扱ったほうが便利です。
    日本語ではJavaScriptのみでの導入となりますが、英語だとCSSでの導入ができるからです。
  • 最初に読み込んだときは、サーバー側でおそらく文字解析をしているので、ページロードまでに時間がかかります。ユーザーに負担を与えないためにも、ページを追加したらクライアント側で最初にページを確認しましょう。

このサイトで使っているWebフォント

  • 【日本語Webフォント】- Axisフォント(Axis ExtraLight / Axis Light)
  • 【欧文Webフォント】- Freight Sansフォント(FreightSans Light / FreightSans Book)

最近使われることが多い細身のフォントを利用しています。

まとめ

fonts.comの月額10ドルは結構な負担です。お金がないときは面倒ですがM+ Web FONTS Subsetterを使えばいい感じに日本語フォントが使えるのではないでしょうか?
ブログとかだと記事更新の時とかに毎回Webフォント入れ替えをしないと行けないという面倒がありますが、コストと手間を考えて導入するかどうかを考えるのもありだと思います。

フォントのことをもっと勉強したいなら、フォントブログさんの記事がすごく分かりやすいです。

ゆめいろデザインへのお問い合わせやお見積もり依頼はこちらから。
お客さまのニーズにあった提案を行い、パートナーとして共に成長することを目指しています。