Webデザインに欠かせないフォントですが、使い方によって見た人に与える印象に違いがあります。
Webデザインでは、Webサイトのイメージに合わせたフォントを選ぶことが重要です。
フォントにはさまざまな種類があり、どのフォントを使えばよいのか迷ってしまうほどです。
そこで今回は、フォントのオススメの使い分けについてご紹介しましょう。
目次
フォントと書体
書体＝フォントと認識している方が意外に多いようです。
書体は特定のデザインで統一されている文字のことで、フォントは書体データを差す言葉です。
本来の意味をたどると、厳密には書体とフォントは違うものだといえます。
しかしWebデザインにおいては、同一の意味で使われることが一般的になっています。
ここでは、書体を含めたフォントについてご紹介します。
和文フォントの分類
和文フォントは、明朝体とゴシック体に分類されます。いわば、和文フォントの基礎ともいえる書体です。
明朝体は縦線が太く横線が細い動きのある書体ですが、ゴシック体は全体が同じ太さで統一されている書体です。
また、どちらも正方形に収まる形で表されていることも特徴のひとつといえます。
欧文フォントの分類
欧文フォントは、セリフ体とサンセリフ体に分類されます。
セリフ体は、文字の終点にセリフと呼ばれる飾りのある書体です。
サンセリフ体は、セリフがなく同じ線で表される書体のことです。
和文フォントは明朝体とゴシック体の分類と似ています。
ちなみに、Webデザインではサンセリフ体が多用されるケースが多いとのこと。
サンセリフ体のほうが文字のサイズが小さく表示されても見やすいからです。
ほかにも細かく分類すると多彩な種類のフォントがあります。
なかには、高額な使用料が必要なフォントも…。
洗練されたWebデザインを作成するには、フォントは欠かせない要素といえるでしょう。
Webデザインにおすすめのフォント
フォントの分類でご紹介した和文フォントと欧文フォントのなかに、Webデザインで使用する定番のフォントがあります。
ここからは、Webデザインによく使われているフォントについてご紹介しましょう。
ヒラギノ角ゴシック体
フォントの開発では業界大手のモリサワが提供しているフォントのなかで、最もよく使われているフォントです。
くせのない美しい書体と読みやすさでは群を抜いているフォントとして広く知られています。
游ゴシック体
Windows8以降・Macにはデフォルトで装備されているフォントです。
メイリオに変わるフォントとしてWebデザインでは多用されています。
新ゴ
モリサワフォントのなかでは特に洗練されたイメージが特徴のフォントです。
拡大するとインパクトがあるため、広告などでよく使われています。
ヒラギノ明朝
字体の美しい流れが特徴のフォントです。
華やかさがありながら現代的なフォントとして知られています。
游明朝
Windows8以降・Macにはデフォルトで装備されているフォントです。
可読性が高く現代的なイメージが特長といえます。
リュウミン
誰にでも親しまれる明朝体のひとつであるリュウミンは、バランスのとれた字体が特長です。
Webデザインでフォントを使い分けるポイントとは
紙媒体のデザインとは異なりWebデザインでは、フォントの使い方に制限があります。
動作環境の異なるWebサイト上では、同じように表示することが難しいからです。
Webデザインでフォントを使用する際に、画像データとテキストデータの2種類の方法があげられます。
画像データ
画像データは、JPEGやPNGなどのファイル形式で文字を表現します。
フォントの選択は自由ですが、修正や変更はできません。
テキストデータ
テキストデータとは、その名の通り文字だけのデータのことです
。Webデザインでは文章の入稿に使われます。テキストデータで使用できるフォントには、デバイスフォントとWebフォントがあります。
デバイスフォント
デバイスフォントとは、Webブラウザを閲覧する端末に実装されているフォントを使用することです。
Webデザインでイメージに合わせたフォントを使っていても、閲覧する端末によって表示が異なります。
WindowsやMacなどで標準に搭載されているフォントを選ぶとよいでしょう。
Webフォント
Webサイトを表示する際にWebサーバー上にあるフォントデータを呼び出して使用することです。
Webデザインで使用したイメージ通りのフォントが表示されます。
デバイスフォントとは異なり、閲覧する端末の種類にかかわらず同じフォントで表現することが可能です。
Webフォントは有料で提供されているサービスですが、Googl Fontsなど無料で利用できるサービスも登場しています。
Webデザインにオススメのフォントと使い分けるポイントとは？ まとめ
Webデザインではフォントが重要な役割を担っています。
フォントの使い方によって、Webサイトの印象が大きく違ってくるものです。
多彩な種類があるフォントをうまく使い分けることで、Webサイトをイメージアップしてみてはいかがでしょう。
