【PR】Udemyならスマホでもタブレットでも、いつでも気軽に学べます。
おっ久しぶりです。
デザイナーのきなこです。
みなさんフォントをダウンロードしたことありますか？
PCに元から入っているフォントだけでなく新しくフォントを入れる機会って結構あるかと思います。
フォントをダウンロードする際、様々な種類がありどれをダウンロードしたらいいのか、悩んだことがありませんか？
なんなんだこの形式は？
フリーフォントと書いてあるけど、ほんとに使っていいの？
オープンタイプってなんだ？
、、、ええい、とりあえずダウンロードだーーー！
なんてことがないように、
本日はフォントの種類や選び方についての基礎知識を書こうと思います。
データの形式などの話になりますので、
フォントの歴史や選び方については弊社さとおの
「日本語フォントの役割と分類を知って、適切なフォント選びをしよう！」
にとっても分かりやすくまとめてありますのでご覧いただければと思います！！
拡張子の種類について
フォントのデータを見ると様々な拡張子があると思います。
これらは何が違うのでしょうか、よく使われるものを簡単にご説明いたします。
.otf
一般的にPCにインストールして使用するフォントファイル
.ttf
otfと同様一般的にPCにインストールして使用するフォントファイル
.woff
TrueType（ttf）やOpenType（otf）の圧縮版。ファイルサイズが軽く読み込み時間が早い
.woff2
「woff」の進化版。woffと比べて圧縮率が高い
OpenTypeとTrueType
フォントを見る際に「OpenType」「TrueType」ってよく聞きませんか？
またフォントを選ぶとき、『O』や『T』というマークがついているのをみたことがあると思います。
こちらは拡張子の話ではなく「形式」のことを指します。（うぅぅ、分かりにくい、、、）
拡張子は同じでも、フォントの形式が違う、ということがあります。
フォント形式による違いをご説明いたします。
OpenType
OpenType（読み：オープンタイプ）
アドビシステムズとマイクロソフトが共同開発したフォントファイル形式です。
特徴
・MacとWindowsの両方で利用できる
・文字数の違うStd仕様とPro仕様とがある
・文字セットが多い
・比較的高価格
・制御や字詰めが柔軟にできる
OpenTypeフォントのうち、TrueTypeフォントの形式を継承したOpenTypeフォントの拡張子は「.ttf」「.ttc」
Postscriptフォント形式を継承したOpenTypeフォントの拡張子は「.otf」となります。
TrueType
TrueType（読み：トゥルータイプ）
アップルとマイクロソフトが共同開発したフォントファイル形式です。
特徴
・Macとwindowsそれぞれにインストールできるが互換性がない
・比較的安価
・使用環境を気にする必要がない
・最高解像度が600dpiしかない
フリー（無料）フォントの多くはTrueTypeです。
歴史が長く、広く普及済みのフォント形式になります。
どっちがいいの？
で、結局どっちがいいのかな？
特徴を見て分かる通り、
解像度の関係で荒くなってしまったり（大きい文字を印刷する場合）、
特殊な文字が表現できなかったりすることがあるため、
デザイン業界（DTP業界）では高性能なOpenTypeフォントを使う事が多いです。
（文字詰めが柔軟にでき、綺麗さ、読みやすさを求めるDTPでは大活躍♪）
しかしWindowsの一般向けソフトはOpenTypeに対応してない事が多いので注意しなければなりません。
Windowsを使っており、フォントを使う目的がプレゼン資料の作成や年賀状の作成などの場合は、
TrueTypeフォントを使用する方がいいと思います。
しかしWindowsとMac間での互換性がないため、両方のパソコンで使用する場合は
それぞれWindows用、Mac用フォントを準備する必要があります。
それぞれメリットデメリットをきちんと理解し、
作業環境や目的に合わせて、ダウンロードするフォントを選んでみてくださいね！
Webフォントについて
さてさてWebフォントって一体なんだ？
ずばり、Webページ上のテキストを好きなフォントで表現できるステキな仕組みのことです。
デザイン性とSEOの効果を両立できる！すげー！
Webページのテキストを表現する時に、今まではユーザ側を考慮した限られたフォントしか使えなかったのですが、
Webフォントが登場し、フォントファイルさえあれば、どんなフォントでも使用できるようになりました！
Webフォントには、TrueTypeフォントやOpenTypeフォントも使えるのですが、
Web専用のフォント形式を使う方が、メリットがたくさんあります。
・ストレージの節約
・読み込み時間の短縮
・第三者による二次利用を防ぐ など
オススメWebフォント
Google Fonts
Googleが提供するWebフォントのサービスです。
無料で使用可能！
フリーフォントについて
フリーフォントを使うことは多いかと思います。
フリーフォントは「無料」で使えるフォントを指します。
しかし無料だからといって自っ由〜に使えるというわけではありません！
下記の内容に注意しましょう！
商用利用なのか個人利用なのか
商用利用とは営利目的で利用することです。
企業サイトでの利用する場合や成果物の作成を目的とした場合などを指します。
個人利用とは商用利用とは逆の、営利を目的とせずに個人で使うことを言います。
フリーフォントを使った作品を個人のサイト・ブログで紹介する場合
フリーフォントを使った作品の売買取引をしない場合など
「商用利用可」でも注意
「商用利用可」でも注意しなければならないことがあります。
・フォントの変形・加工をしてはいけない
フォントの形をそのままに、ロゴやグラフィックを作成するのは構わないが、
既存のフォントを加工してはいけないという意味です。
・クレジットに示さなくてはならない
著作権表示をすることによってそのフォントの作者を分かるようにしなければいけないという意味です。
フリーフォントといっても作成者がいます。
作成者を尊重し、使用許諾や利用規約をきちんと読むことが大切です！
フォントのインストール方法
当然の如くご存知の方ばかりかと思いますが
こちらに簡単にダウンロードしたフォントの使い方をまとめておきます。
Windows
①フォントファイル（拡張子.ttf, otfのファイル）をダブルクリック。
②Windows フォント ビューアーでフォントが開く。
③「インストール」をクリックすると、フォントがインストールされる。
Mac
①フォントファイル（拡張子.ttf, otfのファイル）をダブルクリック。
②Font Bookでフォントが開く。
③「フォントをインストール」をクリックすると、フォントがインストールされる。
いやいやほんとに簡単だな。
最後に
普段当たり前に使っているフォント。
なんとなーくダウンロードしてなんとなーくインストールすれば使えてしまいます。
しかし、しっかりと理解して正しい使い方をしていきたいですね。
今回いろいろ調べてみてモヤモヤしていた部分も少し解消されました。
読んでいただきありがとうございました！
以上フォント作りをそろそろやってみたいきなこでした〜！
【PR】Udemyならスマホでもタブレットでも、いつでも気軽に学べます。
Udemyを実際に体験した方の感想記事もぜひご覧ください♪
- 【体験談】主婦が「自宅で働きたい」を叶えるために、広告バナー制作を学んでみた
- 【体験談】全くの初心者がUdemyでモーショングラフィックスを学んでみた
- 【体験談】Udemy「みんなのAI講座 ゼロからPythonで学ぶ人工知能と機械学習」を実際にやってみた感想
- 【体験談】無料！？Udemyで学ぶはじめてのAI（ディープラーニング、機械学習）
- 【体験談】UdemyでWeb開発を学びました【コスパ最強】
