今日の学習はフォント概論について。
フォントの役割やWebフォントを使うメリットなどを学習しました。
フォントの役割
日常生活でフォントが使われる場面はたくさんあります。
書籍・ゲーム・電子書籍・パッケージ・カタログ・Web・電子機器
文字は情報を与えてくれるだけでなく、方向性を持たせることができます。
同じ文字でも書体が違うだけで私たちが受け取る印象も変わります。
つまり文字はデザインにもなるということ。
- 書体だけでもデザインは成り立つ
- 書体はニュアンスを表現できる
- 書体は統一感を持たせることができる
Webデザインのフォント
Webサイトをデザインする際に、フォントはサイトの雰囲気を決める重要な要素の1つ。
これまでWebサイト上のフォントは、あらかじめ制作側が使用するフォントを指定し、Webブラウザが各端末に搭載されているフォントを表示される方法がとられていました。
しかし、家庭用PCの場合、標準搭載されているフォントが少なく、また各端末のOSによって搭載されているフォントは異なるため、使用できるフォントの選択肢は限られていました。
また、指定されたフォントが各端末にない場合、別のフォントが代用されてしまい意図したフォントで表示されない、という課題が・・・。
その課題を解決するために登場したのがWebフォント。
Webフォントはあらかじめサーバ上に置かれたフォントやインターネット上で提供されているフォントを呼び出し表示することができます。
Webページの読み込みと同時に、ネットワーク上にあるフォントデータをダウンロードすることができるため、どのデバイスで見ても制作サイドが意図したフォントで表示することが可能になります。
Webフォントを使うメリット
どのデバイスで見ても制作サイドが意図したフォントで表示することが可能、というメリット以外にもwebフォントを使うメリットはたくさんあります！
- メディアを越えてデザインに統一感を持たせることができる
雑誌などの紙媒体やパッケージデザインなどで使っているフォントと同じフォントをWebでも使用することで、メディアを超えて統一感を持たせることができる。
- 拡大してもクリアで美しい文字
画像上の文字だと拡大することでアウトラインがあいまいになったり、がたついたりするがWebフォントなら拡大しでも綺麗に表示できる。
- Webサイトの検索性向上
サイトタイトルなどのテキストが画像だと、検索されてもヒットしないが、Webフォントを使っていれば検索でヒットする。→SEO的にも有利！
- 音声読み上げ機能との連携
- 自動翻訳機能との連携
- 更新・修正作業の軽減
例えばブログの「新着記事」の文言を「NEW ARRIVAL」に変更したいときに、画像として作成していると、テキスト画像の作り直しが必要になる。
しかしWebフォントを使っていれば、テキスト部分の修正のみで更新が完了するので、作業の軽減になる。
デザイン性を持たせる以外にも様々なメリットがあることを学びました。