【センスのいらないWebデザイン】フォントサイズの簡単な決め方

僕はデザインの経験がなかったので、デザインを初めた頃はフォントサイズのバランスが難しく、何が正解かわかりませんでした。

同じ思いをされる人が減りますように、初心者の方でもそれっぽくフォントサイズが決まる方法を記しておきます。

１．本文のフォントサイズを決める

本文のフォントサイズから決めると大規模サイトでも破綻しにくいです。最近は14-16pxが主流。ターゲットとサイトの雰囲気によって変えます。

２．奥義フィボナッチ数列を使う

フィボナッチは黄金比（いい感じ見える比率）のもとになってるやつです。詳しくはググってください。

先程の本文サイズにフィボナッチ数列を足します。19pxはあんま見ないので20pxにしときましょう←

実際以下の様な感じになります。それっぽいですね。

見出し　45px
見出し　32px
見出し　24px
見出し　20px
見出し　16px
本文　　15px
本文　　14px

もっとガチガチに決めたい人はマテリアルデザインを

materialdesignのタイポグラフィがあるのでこちらベースにすると良いと思います。英語圏のガイドラインなので日本語はフォントサイズを少し大きくする必要があるかもしれません。

さいごに

わざとフォントサイズに差を少なくして落ち着いた感じを出すこともあるので、あくまで目安です。フォントサイズと合わせてウェイトも変更するとメリハリがでて良い感じになります。