◎　コラム　◎　━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
Webフォントってなに？
—————————————————————————-

近ごろ、お客様からWebサイトのフォントについて、「書籍のフォントに合わせてほしい」、
また「書籍や著者のイメージに合うフォントにしたい」というお話が出てきます。

確かに、書籍や著者のイメージに合うフォントって存在するのだと思います。
例えば書籍のタイトル周りのフォントは、内容を熟慮して作られているため、
書籍に合うフォントの代表例だと考えられます。

自社に合うフォントを表示させたい。
そんなときには、「Webフォント」が活用できます。

■Webフォントとは
あらかじめサーバ上に置かれたフォントやインターネット上で提供されている
フォントを呼び出し、サイト上に表示ができるフォントです。
（CSS3から策定されました）

難しい説明になってしまいましたが、
通常パソコンなどに搭載されているフォントデータを、インターネット上に配置し、
そのフォントを指定して、サイト上で表示させる、ということ。

この方法を用いれば、パソコンなどの端末に表現が依存せず、
自身が見せたいフォントで、テキストを表示することができるのです。

例えば、画像での処理が多かったところをテキストで表現する際に、
Webフォントが活用できます。
※ただし、すべてに対応できるわけではないので、注意も必要です。

以前はWebページのフォントは、
OSにそれぞれ搭載された「システムフォント」でしか表現することができませんでした。

表示させたいフォントについては
事前に設定することはできますが、
すべてのパソコンに同じフォントが搭載されているわけではありません。

昔は明朝・ゴシックといったシンプルなものしかなかったし、
現在でもmacOSやWindows、Android、iOSそれぞれで標準のフォントが違っています。

そのような背景もあり、Webフォントの活用が、ここ最近になって増えてきました。


—————————————————————-
□Webフォントについて
—————————————————————-

Webフォントサービスが誕生した当初は、
表示が遅い、またデザインが綺麗ではないと、不評な部分もありました。

Webフォントを読み込むまでに色々なものを読み込み、
時間がかかってしまうと、
システムフォントを先に読んでからWebフォントが表示されるようになるため、
そのように思われてしまっていたのです。

ネットワーク環境にもよると思いますが、
最近では、表示方法など改善できる部分もありますので
遅い印象はあまりありません。

日本語対応しているWebフォントには下記のようなサービスがあります。

FONTPLUS
https://fontplus.jp/
Adobe Fonts
https://fonts.adobe.com/
DynaFont Online
https://dfo.dynacw.co.jp/
FontStream
https://www.font-stream.com/
Google Fonts + 日本語
https://googlefonts.github.io/japanese/
REALTYPE
https://www.realtype.jp/
TypeSquare
https://typesquare.com/ja/
Webフォントを使うと表現自体も、画像だけではなくテキストで行えるので
スタイリッシュに見えたり、画像で表現する必要がなくなるところが
良い点です。

ただ、Webフォントはやはり日本語対応しているものが少なく
まだまだ選べるものが少ないというところが、
これからの改善点なのだと思います。

—————————————————————-
□SEO対策としては？
—————————————————————-

Webフォントは、SEO対策を考慮しても問題ないツールだと思います。

大事なところは画像ではなくテキストで表現するべき、という考えがありますが、
その場合、デザイン性を持ってテキストで表現できるWebフォントは
SEOの観点からもメリットがあり、
ブランディングの向上や世界観の発信も、テキストで行うことができます。

先ほどお伝えしたように、日本語に対応しているフォントが少ないため、
すべての世界観を伝えられないこともあります。
ニアリーなフォントやぴったりなものがあっても、有料フォントだと予算も必要です。

Webフォントの活用は様々な点でメリットが大きいですが、
各ページやサイトによって、考えながら取り入れていくのが良いのではないでしょうか。

弊社クロスメディア部もお役に立てますので、お気軽にご連絡・ご相談ください。



▼参考
Webフォントってなに？ 遅くないの？ SEOにはどうなの？
「フォントおじさん」こと関口さんに聞いた。|Web担当者Forum
https://webtan.impress.co.jp/e/2019/04/04/32138
Webフォントとは？Webフォントを利用してWebサイトのデザイン性を高めよう
https://www.asobou.co.jp/blog/web/webfont