0120-746-555お電話での無料体験レッスンのご予約・ご質問は
無料体験レッスン
IT業界まるわかりガイド

有料?無料?Webフォントとは?Webサイト制作に関するフォントの基本

Webサイト制作に関するフォント

Webサイト制作の際はコンテンツの質だけでなく、サイトの印象を大きく左右するフォントの選択にも気を配る必要があります。フォントの指定方法にはさまざまな種類がありますが、Webサイトのデザインを決める最新ルール「CSS3」で新たに導入されたフォントが「Webフォント」です。Webフォントを利用することで、テキストで使用できるフォントの幅が広がり、サイトのデザインの自由度を高めることができます。そこで今回はWebサイト制作に関するフォントの基本とWebフォントについてご紹介します。

Webサイト制作に関するフォントの基本

フリーフォント

フォントには無料フォントと有料フォントがあります。無料フォントは「フリーフォント」と呼ばれていますが、フォント利用料が無料であるだけで、著作権をフリーにしているわけではありません。


例えば、趣味のブログなど個人的なWebサイト制作に利用する場合は無料ですが、商用利用の場合は有料になるフォントや、ロゴマークや印刷に利用することはできないと規約に明記されているフリーフォントなどがあります。

フォントを利用する際は、必ずライセンス確認を行い、利用規約を守って使用しましょう。利用規約には、「利用後は著作者に連絡をしてください」「クレジット表記が必要です」と記載されているケースもあるため、利用前の確認が必須です。

Webフォントとは

Webフォント

Webフォントとは、Webサーバー上にあるフォントデータを参照して表示する仕組みです。ユーザーがWebフォントを利用するWebページにアクセスすると、そのWebフォントがダウンロードされ、ブラウザに表示されるようになります。Webフォントにも無料フォントと有料フォントの2種類があります。


和文のWebフォントは無料フォントの選択肢が少ないため、フォントにこだわるのであれば有料フォントがおすすめです。有料フォントの中からデザイン性が高く、読みやすいフォントが見付かるでしょう。

一方、欧文のWebフォントは無料・有料共にフォントの種類が豊富です。有料フォントを探す前にイメージに合う無料フォントがないか探してみてください。

Webフォントを使うメリット

Webフォントを使うメリット

ユーザーが使用するOSによって標準インストールされているフォントは異なります。CSS2の「font-family」プロパティではローカルデータ(ユーザー側の環境)のフォントを指定していたため、指定したフォントがユーザーのPCにインストールされていない場合、指定のフォントを表示させることができませんでした。

しかし、CSS3から導入されたWebフォントは指定したURLからフォントデータをダウンロードする仕組みであるため、ユーザー環境にかかわらず自由にフォント指定ができます

また、WebフォントはWebページの拡大・縮小表示をしても文字の形が崩れないこともメリットの1つです。

和文Webフォントのサブセット化

日本語は漢字の文字数が多いため、欧文Webフォントと比較して和文Webフォントはデータ容量が大きくなります。そのため和文Webフォントの読み込みに時間が掛かることがあります。

読み込み時間短縮のために有効な方法が、Webサイト内で使用するフォントだけを読み込む「サブセット化」です。読み込むフォントを第1水準漢字・平仮名・カタカナ・記号などに限定することによって、ユーザーにストレスを与えることなくサイトを表示させることができます。

おわりに

フォントによってWebサイトの印象が決まると言っても過言ではありません。Webサイトで使用するフォントにバリエーションを持たせたい場合はWebフォントの使用が効果的です。

ただし、Webフォントを使用する際はフォントの利用規約に目を通すだけでなく、著作権に対する十分な理解が欠かせません。まずは、Webサイト制作に関する著作権や現場でのフォントの活用方法をWebの専門スクールで学ぶことをおすすめします。

Webデザインを学びたい方へまずはお気軽にお問い合わせください

無料体験レッスン

無料体験レッスン実施中

日本初そして唯一のIT・Web専門スクールであるインターネット・アカデミーでは、毎日無料体験レッスンを開催しています。インターネット・アカデミーは日本初そして唯一のIT・Web専門スクールなので、その専門的なノウハウを活かした転身についてのご相談も承っています。ぜひお気軽にご参加ください。

このページの上へ

お電話での無料体験レッスンのお申込み・お問い合わせはこちら(受付時間10時-21時)