デバイスフォントには何を使う？ 〜理由をきちんと理解する〜
デザインカンプを作成する際に、デバイスフォントには何を使えばいいのか？ということについて今回は考えていこうかと思います。
その前にまずはデバイスフォントの説明から。デザイナーなりたての頃「そこはデバイスフォントなので」みたいに言われて、なんだそれ？となった覚えがあります（笑）
このブログはウェブデザイン初心者による初心者のためのブログですよ、はい。
デバイスフォントとはコンピューターに予めインストールされているフォントのことです。
デバイスフォントの設定はCSSで行うことができ、複数のフォントを指定するとコンピューターにインストールされているフォントを使用して表示します。
画像の中に含まれるフォントではなく、各デバイスに搭載されているフォントということですね。ドラッグした時に選択できるフォントということです。
↓こんな風に。
さて、使用するデバイスフォントを単純に羅列してもいいのですが、まずは「なぜそのフォントなのか？」を理解しなくてはなりません。
「先輩のpsdを見たらこのフォントだったし、これでいいか」ではだめなんです。ディレクターやクライアントから「なぜそのフォントなんですか？こっちの方がよくないですか？」と言われて「あ、いや、その、先輩のpsdに…」では言い訳になりません。
それが既存ページの細かな修正だけだったとしても、ディレクターやクライアントからしてみればあなたがデザイナーで、デザインに関わる責任はあなたにあるのです。
なんてカッコつけて言ってますが、最近デバイスフォントの指定を間違えてしまった自分へのさ自戒込めて書いているだけです（笑）
それでは「なぜそのデバイスフォントを使用するのか？」を考えていきましょう。
【目次】
そのデバイスに搭載されてなければ意味がない
当たり前ですね。ですが、ウェブデザイナーになりたてだったり、ウェブ業界自体に入りたてだったりすると、当たり前のことを当たり前だと知らないものです。どの業界でも同じことが言えるかと思いますが、そんな初心者の方のためにこのブログはあるんですよ。
デバイスフォントは、閲覧するデバイスに搭載されているフォントを使うので、そもそも搭載されていなければ意味がありません。搭載されていないフォントを使ってデザインカンプを作成してしまうと、実際にテストアップされた時と見た目が変わってしまい「このフォント、違くありませんか？」なんて言われかねません（基本的にはそうなる前にデザイナーの先輩やディレクターが気づいてはくれますが）。
搭載されているフォントは予め調べて、その中から選ぶようにしましょう。
↓こんな感じでリストになっていたりします。
PCならWIndows？Mac？スマホならIPhone？Android？
あとはそれがPC用なのかスマホ用なのかを踏まえ、フォントを決めるだけです。
ちなみに私が勤務する制作会社ではPCであればWindows、スマホであればIPhoneを想定してデザインカンプを作成します。
PCの場合はシェアの多いWindowsに合わせているということになります。
スマホはOSシェアがiOS、Androidでほぼ半々（若干Androidが多い）といったところで、iOS想定でデザインカンプを作成します。
理由としては、
・Android端末でデザインカンプを作ろうとすると、画面サイズが多種多様になってしまう(iPhoneも新旧で画面サイズが異なりますが、それ以上に多くの場合分けが必要になります)。
・Androidのデバイスフォントはあまり綺麗でなかったり、以前は太文字(Bold)が使えなかったりと、積極的にAndroidに合わせる理由がない
という感じで、私が勤務する会社を例として挙げましたが、結局は事前にディレクターやクライアントと擦り合わせることが最も重要です。
また、デザインカンプでフォントにアンチエイリアスを設定するか否かということも考えておきます。
結論、私は設定します。
そこはデバイスフォントです、ということを伝えるよりも見た目としての綺麗さを優先しています。またこれは私の肌感覚ですが、アンチエイリアスのかかっていないフォントほど実際はジャギジャギしない、と思っているというのもあります。最近はデバイスフォントでも綺麗に見えますよね。
また、コーディングをおこなうエンジニアさんが、アンチエイリアスがかかっていたとしても「あ、ここはデバイスだな」と理解してくれるから、という理由もあります。要するに私の会社ではデザインカンプに指定しているフォントでデバイスか否かを判断してくれている、ということです。
少し長くなってしまいましたが、手っ取り早く周りの先輩などに聞いてしまうのがいいと思います。一番だめなのは「みんな使ってるから」という理由でフォントを選んでしまうことです。
常に理由を理解してから、日々のデザインに取り組んでいきたいものです。
