KumiFont

フォントガイド

このページでは、日本語Webフォントを選ぶときの基本的な考え方をまとめています。フォントは単なる装飾ではなく、読みやすさ、ブランドイメージ、情報の伝わり方に影響する重要な設計要素です。

ゴシック体と明朝体の違い

ゴシック体は線の太さが比較的均一で、画面上で読みやすく、UIや本文、ナビゲーションに向いています。Noto Sans JPやZen Kaku Gothic Newのようなフォントは、情報をすばやく正確に伝えたいサイトに適しています。

明朝体は線に強弱があり、上品さや知的な印象を出しやすい書体です。Noto Serif JPやShippori Minchoのようなフォントは、コラム、ブランドストーリー、読み物系のコンテンツに向いています。ただし、小さすぎるサイズでは細い線が読みにくくなるため注意が必要です。

見出しと本文の役割を分ける

Webページでは、見出しは内容を素早く理解させる役割、本文はストレスなく読み進めてもらう役割を持ちます。見出しに個性のあるフォントを使い、本文には読みやすいフォントを使うと、デザイン性と可読性のバランスを取りやすくなります。

行間と字間の考え方

日本語の本文では、行間を少し広めに設定すると読みやすくなります。短いUIテキストでは line-height 1.5 前後、通常の本文では 1.7 から 1.9 程度、長文記事では 2.0 前後が検討しやすい目安です。字間は広げすぎると読みにくくなるため、本文では 0 から 0.05em 程度に収めると自然です。

サイトの目的に合わせて選ぶ

コーポレートサイトでは信頼感と読みやすさ、メディアサイトでは長文の読み心地、ECサイトでは商品情報の見やすさが重要です。フォント選びでは、自分の好みだけでなく、訪問者がどのような情報をどのような気持ちで読むのかを考えることが大切です。

KumiFontで確認できること

KumiFontでは、フォント名だけを見て選ぶのではなく、実際の見出しと本文の組み合わせとして表示を確認できます。フォント、太さ、サイズ、色、行間、字間を変えながら、サイトの目的に合う組み合わせを探してください。

関連コラム