ホームページデザインでよく使う日本語フォント-webaby【エンジニアお父さんの育児・子育て】

ホームページデザインでよく使う日本語フォント

ホームページデザインでよく使う日本語フォント

ホームページを制作する時に、パソコンに入っているデフォルトのフォントだと味気なくなります。
また、ホームページ制作で初心者の方や副業・在宅ワーク・リモートワークを考えている人はフォント自体どれがいいのかわからないと思います。

フォントは無料から有料までいろいろとあり、どんなフォントを使うかでバナーの雰囲気やクリック率・インパクトがかわります。また、ホームページ自体の雰囲気もフォント一つで激変します!

そんな方に、私が現場で実際に良く使うフォントをご紹介します。

  1. ゴシック体
  2. 明朝体
  3. 丸文字・手書き
  4. 他にあれば役に立つフォントや使いどころ

ゴシック体

ホームページデザインをする時に必ず日本語フォントを使います。またゴシック体は明朝よりは柔らかく丸文字よりは固いイメージを出すときによく使います。その中でも現場でよく使うゴシック体はこちらです。

  • ヒラギノ角ゴ
  • 游ゴシック
  • 新ゴ
  • 源ノ角ゴシック

上記4つがあればゴシック体はなんとかなります(笑)
もちろん、他にもたくさんありますが、デザインをする方の好みやクライアントのイメージに合ったものを使うのが一番いいです。

ただ、デザインを何度もしていく内にどのゴシック体がいいのか迷ってしまうことも多いです。そんな時は、「ヒラギノ角ゴ」か「新ゴ」を使います。

明朝体

明朝体はゴシック体より使う頻度は少なくなります。理由としては、ホームページ上のテキスト(デフォルト)が明朝体でないため明朝体でないテキストの間に急に明朝体が出てくるとバランスが悪くなることが多いからです。

ただ、バランスが悪くなり違和感を感じるということを逆手に取りインパクトを与えることもできるため、パソコンに入れておくのは必須になります。

  • ヒラギノ明朝
  • 游明朝
  • リュウミン
  • はんなり明朝

上記の明朝体はどれもクセがあります。あまりクセもなく使いやすいのは「ヒラギノ明朝」です。私の個人的な感覚では、ゴシック体(文字細目)と良く合うのは「リュウミン」だと感じています。使いやすいイメージがあり、ワンポイントでカチッとさせたいときはよく使います。

また、ホームページのデザインによって明朝体のみで制作することもあるため、こちらもパソコンにインストールしておくことをオススメします。

丸文字・手書き・その他

ゴシック体や明朝体と違って使う頻度は極端に少ないですが、あるとバナーなどのデザインがワンランク上がるようになります。

  • じゅん
  • 新丸ゴ
  • 丸フォーク
  • フォーク
  • ふい字
  • みかちゃんフォント

「じゅん」「新丸ゴ」「丸フォーク」は丸文字でゴシック体に似ていますが、角がカクカクしていなくて丸みがあります。優しいイメージのサイトや子供向けサイトなどでよく使います。

「フォーク」に関して、私のイメージではゴシック体と明朝体を使ってもしっくりとこない時に使用したりします。使いどころが違うとまったくイメージに合わないですが、一度試しに「フォーク」にしてみることが多いです。

「ふい字」「みかちゃんフォント」は、ほとんど使わないです。ただ、バナー作成時に吹き出しの文字として使います。ユーザーに一番近くで伝える言葉の時に使用すると少しポップさがでます。

他にあれば役に立つフォントや使いどころ

どのフォントをインストールした方がいいというのはないですが、あれば使う場面が出てくるというフォントがあります。

筆やペンで書いたようなフォントはインストールしておいてもいいと思います。使用場面では取締役社長のあいさつ文で最後の役職・名前を記載するときなどです。

ほかにもいろいろなフォントがありますが、自分に合った・クライアントに合ったフォントを使う事でデザインをワンランクアップさせることができます。

また、初心者の方々が勉強のためにバナーをコピー制作することがあると思います。そういう時に完成形が、「少し違う」「何か足らない」と思う時はフォントを変えてみてください。フォントや文字の太さを変えるだけでイメージしてるデザインにグッと近づきます。

フォントには有料から無料までありますが、まずは無料をインストールしてみてください。
ただし、あまりフォントをインストールしすぎると使いたいフォントを探すのが面倒になったり、ごちゃごちゃしたりするのでその辺は注意してください。