デザイン会社が発信するLP制作情報メディア

LPのフォントサイズはどれくらいにする?デザインのコツを解説します!

2022.11.21
LPのフォントサイズはどれくらいにする?デザインのコツを解説します!
LPやホームページを作成する場合は、文字の大きさをどれくらいにすればいいのでしょうか。
画面の文字は、大きすぎても小さすぎても見づらくなります。ユーザーに離脱されないためには、文字の大きさを考慮して、コンテンツを見やすくすることも大切です。本記事では、なぜホームページの文字の大きさが重要なのか、スマホ向けLPを制作する際の、チェックポイントなどについても解説します。

目次

なぜホームページの文字の大きさが重要なのか

なぜホームページの文字の大きさが重要なのか
ホームページの文字の大きさが重要なのは、以下のような理由によります。

見やすくするため

ホームページには、画像やイラストなども含まれますが、大部分はテキストが使われています。
そのため、ユーザーから見て、読みやすいフォントサイズにすることは、非常に重要です。文字サイズが適切でないと、読みづらいためにユーザーはすぐ離脱してしまいます。せっかく訪問してくれたユーザーに、ろくにホームページを見ないうちに離脱されては、苦労してページを作った意味がありません。

そこで、ユーザーに快適な状態でホームページを閲覧してもらうためにも、適切なサイズの文字を使用する必要があります。ホームページを作成する際は、ユーザビリティを意識することが大切です。

しかし、通常ホームページのユーザビリティでは、ページのデザインやクリックボタンをわかりやすくするなどが、重要視されていますが、文字の大きさまでは考慮されていません。見やすいホームページを作るには、文字の大きさを適正にすることも、忘れないようにしたいものです。

スマホの画面対応を意識する

ホームページはパソコンで作成するため、できたホームページのチェックも、パソコンで行うことが多いものです。しかし、最近ではパソコンよりも、スマホでネット検索するケースが増えているので、スマホで見やすいホームページを作ることが大切です。

また、スマホで見やすいサイトにすることは、Googleで検索上位に入るための重要な要素となっています。そのため、スマホで見やすいページを作ることが、SEO対策としても欠かせないことを知っておきましょう。

最適なフォントサイズは?

最適なフォントサイズは?
読みやすいホームページを作成するには、テキストコンテンツの文字サイズを統一し、それをもとに見出しのサイズを決めることが大切です。
では、文字サイズはどのように決めればいいのでしょうか。

フォントサイズは16pxが基本

テキストコンテンツの文字サイズは、16px(ピクセル)を基本と考えましょう。
読みやすさを考慮したホームページのほとんどが、16pxで作られています。ただし、子供向けや中高年層を対象としたホームページは、もう少し文字サイズを大きくしたほうが見やすくなります。この場合でも、文字サイズは17pxか18pxにして、それ以上のサイズは使わないようにしましょう。

タイトルや見出しとのバランス

見出しは、テキストコンテンツの文字サイズより少し大きくして、タイトルはさらに大きくします。
テキストの文字サイズと比べて、見出しやタイトルの文字サイズを大きくすると、インパクトのあるページ作りができます。そのため、インパクトを重視してページ作りをしたい場合は、見出しやタイトルを大きめにするといいでしょう。 しかし、学術関係や法律関係、医療関係のページの場合は、落ち着いた感じのページにしたほうがいいので、テキストの文字に比べて、見出しやタイトルをあまり大きくしないのがポイントです。コンテンツの内容をじっくり読んでもらいたい場合は、文字サイズをあまり大きくしないようにしましょう。

スマホで見ることを意識する

最近では、スマホでネット検索する機会が多くなっているので、スマホで見た場合にどう見えるかも考える必要があります。
基本的に、パソコンの画面で見やすければ、スマホでも見やすくなりますが、念のためスマホで表示して、どのように見えるかチェックすることが大切です。

適切な行間・文字間隔・余白をつける

適切な行間・文字間隔・余白をつける
LPやホームページでは、文字サイズだけでなく行間や文字間隔、余白の取り方も、見やすさを左右する大切な要素となります。LPやホームページでは、文字の行間を1.5〜2.0に設定するのが基本です。行間が狭いと読みにくくなり、行間が広すぎると目の移動距離が長くなるので、長時間読んでいると目に負担がかかります。

また、文字と文字の間隔が狭いと、メリハリのあるコンテンツになりますが、狭すぎると文字がくっつきすぎて読みにくくなり、文字間隔が広いと間延びしたものになってしまいます。WEB上で最適な文字間隔は、文字サイズの5%〜10%くらいにしましょう。余白も、文字を見やすくするためには重要です。

余白はデザイン上も大切ですが、テキストを読みやすくするためにも、余白の取り方を意識する必要があります。余白の取り方はいろいろで、1行ごとに余白を取る場合もありますが、3~4行ごとに余白を取るのが一般的です。また、重要な部分を目立たせるために、余白を多めに取ることもあります。

同様に、目立たせたい部分を太字にしたり、一部分だけ文字の色を変えるなど、読みやすくインパクトを与えるための工夫も考えましょう。テキストを読みやすくするには、文字の色を考慮する必要があります。書籍の場合は、基本的に文字は黒ですが、これは紙が白だからです。

WEBではいろんなサイトカラーを使うので、背景の色によって、文字の色も変えることも大切です。読みやすいLPやホームページを作るには、上記のさまざまな要素を、バランスよく取り入れるようにしましょう。

スマホ向けLPを制作する際のチェックポイント

スマホ向けLPを制作する際のチェックポイント
スマホ向けLPを制作する際に、注意すべきポイントをご紹介します。

スマホで見やすくする

パソコンでは見やすくても、必ずしもスマホでも見やすいとは限りません。
スマホでネット検索する人は急拡大しているので、必ずスマホで見やすいかどうか、チェックする必要があります。また、スマホの縦横のサイズは機種によって違うので、いろんなスマホを使ってチェックするようにしましょう。

文字のフォントサイズを調整する

パソコンで閲覧するのに比べて、スマホは画面が小さいので、見た目の感じが違います。
そのため、パソコンではバランスよく見えても、スマホでは違和感がある場合もあります。そこで、コンバージョンを上げるためには、実機のスマホで見やすいページ作りを、心掛けることが大切です。

デザインをシンプルにする

スマホ向けのLPやホームページは、シンプルなデザインにする必要があります。スマホは、ちょっとした空き時間に閲覧することが多いので、じっくり見る人はあまりいません。そのため、いわゆる「斜め読み」でも、内容がわかるような作りにするのがベストです。

斜め読みでも理解できるようにするには、テキスト部分を減らして画像やイラストを増やし、「見てすぐにわかる」ページにすることが大切です。いわゆる、「直観的にわかる」ページ構成にすることが、重要なのです。

まとめ

LPやホームページを作成するには、文字の大きさを考慮する必要があります。しかも、スマホで閲覧した場合でも、違和感なく読むことができるページにしなければなりません。ページを見やすくするには、テキストの文字サイズと、見出しやタイトルの文字サイズを調整する必要があります。

タイトルや見出しが大きいと、インパクトのあるページになりますが、学術関係や法律、医療関係などの場合は、あまり大きくしないほうが、落ち着いた上品なページになります。また、見やすいページ作りのためには、文字サイズだけでなく、行間・文字間隔・余白も考慮しましょう。スマホで見る場合は、シンプルなデザインのほうが、見やすいことも知っておく必要があります。
この記事を書いたライター
LPの制作に特化したデザイン会社(LP制作実績)。累計では数千LPデザインを手掛けております。すべて内製化しており、構成からデザイン、コーディングまですべてご対応可能です。各種サーバーのご対応はもちろん、楽天市場、ヤフーショッピングなどのモール系などへの反映もご対応可能です。
この記事の画像を作成したデザイナー
所属:株式会社Ryuki Design / 部署:デザイン部
※デザイナー一覧

印刷系出身、社内でも数少ない男性デザイナー。メンズ系商材はもちろん、バナーやメルマガまで幅広い案件をこなしながらも作業スピードも◎で時間内に終わらせ、ほぼ残業なく定時退社を実現している、出来るデザイナー!

LP制作.jpへのお問い合わせはこちらから

お電話でも承ります
050-3541-5719

    ※アンケートモニター提供元:ゼネラルリサーチ 
    調査期間:2020年8月7日~12日
    調査方法:インターネット調査 
    調査概要:デザイン制作会社10社を対象にしたサイト比較イメージ調査
    調査対象:全国の20代~50代の男女 1052名

    LPアーカイブ
    ハイパーソニック