【CSS】おさえておきたいフォントの話【font-family】

ウェブサイトのイメージについて

ウェブサイトのイメージは色々な要素から導き出されます。
例えば使用する画像やバナー一つ、使用するカラー一つとってもサイトの印象はガラッと変わります。ただ、こういうのって色彩感覚やバランス感覚が要求される、いわゆるセンスというものがモノを言う世界でもあるので、ある程度の法則はあるにしても、なかなか一朝一夕で改善されるものでもないのも事実。
じゃあどうしようもないじゃん…とあきらめるのはまだ早い。あなたのサイトをグッと洗練させる方法が一つだけあるのです。

サイトのイメージを簡単に変えられるたった一つの方法

その方法こそがフォントの調整。これ、案外やっていないサイトがあるんですよね。そして、そういうサイトってパッと見たときになんだか微妙な印象を与えるサイトになりがちなのです。
ほんとかよ(フォントだけに)!?と疑う気持ちもわかりますので、まずは論より証拠ということで下記をご覧ください。

いろはにほへとちりぬるを / This is a pen.

いろはにほへとちりぬるを / This is a pen.

どうでしょうか?個人差はあると思いますが、なんとなく下のほうが今風な感じがしませんか?(ちなみにスマホ閲覧だとほとんど変わらないので気にしなくていいかもです)
ちなみに下のフォントは弊社サイトで採用しているフォントです。下記に公開していますので、もしビビッときたようであれば、ぜひお使いくださいませ。

まとめ

画像や色合いを一つ一つ直していくのは大変な作業になりますが、フォントについてはCSSでbodyのfont-familyを指定してあげるだけで、サイト全体のフォントをがらっと変えることが出来るので、もし自作のサイトや制作中のサイトがなんとなくダサいな、なんて感じるときは一度お試しいただく価値はあるかと思います。
フォントはとても奥深く、またちょっとだけ手間をかけてあげるだけでサイトのイメージを劇的に改善できる場合もありますので、Webデザインをされる方はぜひ早い段階で自分なりの必殺フォントを編み出すとよいかなと思います。

他にもPCやスマホに備わっている標準フォント以外の外部フォントを引っ張ってくるやり方もありますが、それはまた次回ということで。