ぴったり、を選ぼう。PITTALAB

「見やすい」ホームページ.png

「見やすい」ホームページとは?基準や見やすくするポイントを解説

twitterでシェア
facebookでシェア
はてぶ
公開日: 2022.05.16
更新日: 2022.06.17

満足のゆくホームページを作る上で、もっとも重要なポイントは「ユーザー目線に立った見やすいホームページを作ること」。

見やすいホームページを作るにはいくつかコツがあります。具体的には、「ホームページがスマホ最適化されている」「テキストの量が適切」「画像やグラフなどで見飽きない工夫がされている」「文字カラーが見やすい」「デザインの統一性がある」「導線が意識されている」ということが挙げられます。

ではそれらの要素を押さえる上での判断基準、注意すべきことは何なのか?また、ホームページ制作会社を選定する際のポイントについて、詳しく解説します!

後悔しないホームページづくりのために、ぜひご一読ください!

目次
目次

1.ホームページの見やすさのポイントとは?判断基準も解説

スマホ閲覧を意識する

ユーザビリティを高める上で、スマホでも見やすいホームページ制作を心がけることは非常に重要なポイントです。ホームページの制作事例を調べる際、多くの方はPCを利用してフル画面でホームページの事例を閲覧するかと思います。

しかし、実際にインターネットを利用する多くのユーザーは、スマホと言われています。2021年時点、PCのみ利用するユーザーが”2%”に対して、スマホのみ利用するユーザーは”53%”もいるのです!

『ホームページはPC経由・スマホ経由のどちらが多く閲覧されるのか?』という問いでは、圧倒的にスマホなのです。

そのため、PC・スマホそれぞれに対応したホームページの制作はマスト要件として捉えましょう。スマホ閲覧で見やすい大きな判断基準として、「縦スクロール型で閲覧できるか」「メニューバーは開きやすいか、分かりやすいか」「文字や画像は小さすぎないか」この三点が挙げられます。

情報量が適切か意識する

ホームページの情報量は、「多ければ多いほど良い」というわけではありません。

伝えられる情報を出来るだけ多く伝えたい、という考えになりがちですが、載せる情報が多ければ多いほど、ユーザーは「どの情報を見れば良いか分からない」状態となり、ホームページ中で迷子の状態となってしまいます。どのような情報をどれだけ伝えれば良いか、はホームページの用途・目的によって異なります。用途・目的に応じて、どんな情報を目の前にいるユーザーへ一番伝えたいのか?を明確にし、適切な情報量で収めるように心がけましょう。具体的な判断基準として、押さえていただきたいポイントは以下の三点となります。

(1)1つのページにつき、テーマや商品を1つに絞る

1ページにつき、伝えたいことは「1つだけ」に絞りましょう。

ここでは具体例として、採用ホームページを例に挙げさせて頂きます。たとえば、採用ホームページ上で”社長の想いを伝えるページ”があるとしましょう。

そこで伝えたいのは、採用に対する考え方、今後のビジョンといった、会社の顔である社長しか話せないメッセージです。求職者にとって、社長の想いは非常に強い影響力が強いメッセージなので、その会社に対する理解が深まります。

しかし、このページ内に募集要項のページが並んでいたら、どうでしょうか?社長メッセージ、というインパクトが一気に薄れてしまい、求職者にとっても、「あれ、このページは社長メッセージ?それとも募集要項を伝えたいの?」という風に頭の上にハテナマークが浮かぶかと思います。これは極端な例ですが、ここで言いたいのは、どのような用途・目的を持ったホームページでも、各ページごとのコンセプトに沿った情報発信が重要なポイントとなる、ということです。

(2)密度が高い場合は「情報の固まり」を作る

情報量が多くなってしまう際は、ユーザーを疲れさせないように工夫すること―これを、「情報の固まりを作る」と表現しました。

載せる情報量がそこまで多くなければ問題ないのですが、たとえばニューストピックス、ブログなどのテキスト量が確実に多くなるページは、読み慣れていないユーザーにとっては、非常に読みづらさを感じ、途中でページ自体を離脱してしまう、といったことも起こり得ます。

それらを回避するために、文章内で箇条書きを入れて要点を簡潔に整理する、改行を細かく入れる、強調したい箇所を太文字で強調するなど、情報の見せ方に工夫を入れましょう。多くの情報が淡々と記された記事はユーザーが見飽きてしまうことを念頭に入れ、情報の固まりを意図的に作りましょう。

(3)デバイスごとに適切な情報量に調整をする

PC・スマホ・iPadといった各デバイスにとって、適切な情報量は異なります。デバイスによって画面のサイズが違うため、PCで見た時はちょうど良い情報量が、スマホで見た時はパンパンに感じる・・・といったことも十分にあり得ます。

それを防ぐために、デバイスの画面サイズに合った情報量で留めるようにしましょう。ホームページ制作業者は、制作開始前に『ワイヤーフレーム』という、大枠のサイト構成・デザインイメージを提示してくれます。

デバイスの画面サイズに考慮した構成案もその段階で確認できますので、あらかじめ細かく調整をしながら、適切な情報量に調整しましょう。

配色やデザインを意識する

ユーザーがパッとホームページを見た瞬間、一番最初に目に飛び込んでくるのは、ホームページを彩る配色やデザインです。なんとなくホームページが寂しいから、とにかく色をつけたり、デザインをふんだんに取り入れてしまうと、ホームページの分かりやすさは失われてしまいます。カラーを取り入れたり、デザインを加える際は、下記いずれかの目的を必ず持つようにしましょう。

・特にPRしたい、目立たせたい箇所がある

・ページごとの関連性を配色、デザインを用いて表現したい

・配色、デザインを通して、ホームページ全体の印象を付けたい

ユーザーは、ホームページが表現する配色やデザインから、「このホームページは、何を伝えたいのか」という意図を感覚的に読み取ります。配色やデザインは、そのホームページ自体の印象・ブランディングを決定する重要な要素ですので、ホームページ制作業者に依頼する際も、ホームページデザイナーと方向性をしっかり摺り合わせをして、進めていきましょう。

視線の流れ・導線を意識する

ホームページの運用にあたって意識したいポイントは、ユーザーがホームページ内で辿る足跡が、作り手のホームページを制作した意図・目的というレールをしっかり踏んでくれることです。

ここで、前述した採用ホームページを例として挙げましょう。『求職者に採用情報を発信し、会社への理解を深めてほしい』のが採用ホームページの目的だとします。ここで大前提となるのは、「ホームページを閲覧してほしいターゲットは、とある会社の採用情報を調べる求職者」です。更に言うと、ホームページを深く閲覧してもらうためには、「求職者が一番知りたい情報を押さえた採用ホームページの制作」が必要です。

逆を言うと、一番知りたい情報が載っていない、分かりにくい場合、求職者が離脱してしまうため、ホームページの作り手が意図していた「会社への理解を深めてもらうこと」が叶わなくなります。『視線の流れ・導線を意識する』というのは、ターゲットとなるペルソナを固め、対象が求める情報を明確化させること―ユーザー目線に立ったホームページの構成を図ること、と言い換えることができます。

2.見やすいホームページにするためにするべきこと

上記では、見やすいホームページの特徴と判断基準についてまとめさせていただきました。続いて、より具体的に、見やすいホームページを制作する上で工夫したいポイントをご紹介いたします。

テキスト

見やすい文字のサイズ、色合いの選択を心がけましょう。見やすい文字サイズは、15px~18px程度が主流です。

しかし、「このフォントサイズが100%正解」というものはありません。各ホームページのデザイン・コンテンツ次第で、サイトの見栄え・印象は大きく変わります。

一度、適切と思われるフォントサイズに設定した後、スマホでも見え方をチェックし、デバイスにかからわず、フォントサイズが適切か否かを確認するようにしましょう。また、文字の色合いですが、薄いグレーなどは避けた方がベターです。基本的には、ハッキリとした黒を基調とし、特に強調したい箇所などは太文字やアンダーラインなどで表現して、見やすくかつメリハリのあるテキスト構成を心がけましょう。

メニューやボタン

ホームページにおけるメニュー・ボタンの見やすさは、クリックする対象であることを明確にする上で重要な要素です。

カッコいいメニュー・ボタンは魅力的かもしれませんが、見栄え重視で色合いや位置、サイズを決めてしまうのは避けましょう。デザインはなるべく明快な色でシンプルに、目立つ大きさのボタンを関連情報の近くに配置するようにしましょう。

表やグラフ、画像

テキストで表現せずに、誰が見ても分かりやすく情報発信できることが、表やグラフ、画像の強みです。まず、表やグラフの活用に適した情報は、売上率、統計データといった数字が絡む情報です。数字が羅列されたテキストは読みづらく感じるユーザーが多いので、表やグラフを使ってシンプルかつ簡潔に要点を押さえましょう。

続いて画像の活用に適した用途は、画像を通してホームページの雰囲気を表現したい時、ダイレクトに画像が持つメッセージを伝えたい時などが挙げられます。これらの強みを活用して、ユーザーにとって分かりやすく、簡潔に、印象的に情報を発信しましょう。

一度に表示される画面が文字ばかりになっていないか

一画面あたりの情報が文字ばかりになっていないか、バランス調整を必ず行いましょう。前述にもありましたように、一画面あたりの情報が文字ばかりだと、ユーザーは疲弊してしまい、「見るのやめた」という心理でホームページを離脱してしまいます。それを防ぐために、テキストの間に画像がグラフを取り入れたり、段落を上手く使って、ユーザーを疲れさせない、飽きさせない構成を心がけることが重要です。

広告ばかりになっていないか

広告の意図として、ユーザーの印象に残ることで、後のちのサービス・購買へ繋げることが挙げられます。

しかし、ユーザーにとって、広告が多すぎるのは、非常にストレスを感じます。

広告が適度にあるレベルなら、ユーザーも違和感をそこまで違和感を感じないですが、あまりに多すぎると、ホームページ全体がゴチャゴチャしていると感じたり、広告をスルーする度にストレスを感じて離脱してしまったり、ほぼ良いことがありません。広告を入れるメリット、デメリットを上手く取り入れて、ユーザーにとってなるべくストレスの少ないホームページづくりを行いましょう。

3.ホームページの見やすさを決めるデザインの要素とは

見やすさを決める要素(その1)配色・色の強弱

配色は種類が多ければ多いほど見づらく、デザインのバランス調整が難しいと言えます。一般的には、一つのページ内でも”ベースカラー・メインカラー・アクセントカラー”の3色でまとめるのが良いとされています。

デザインのバランス次第で色数を増やすデザインもありますが、その場合は、濃い青~薄い青までのグラデーションを表現するなどの、ベースカラーとの統一性を含んだカラーバランスが良いとされています。


見やすさを決める要素(その2)リンク

ユーザーを特定のページへ移行させるにあたって、リンクの張り方も工夫する必要がある要素の一つです。ユーザーがパッと目にした時、「リンク」と捉えることができるようなデザインにしましょう。

具体的には、目立つリンクバナーを利用したり、テキストリンクであれば、矢印やアンダーラインを使って強調したりすることがポイントです。

テキスト内にリンクが埋もれてしまわぬよう、リンクとして捉えてもらうための工夫を図ることがポイントです。


見やすさを決める要素(その3)テキスト

フォントサイズ・行間・文字間などのテキストデザインは、見やすさを決定する重要な要素です。たとえば、フォントサイズを小さくすれば、おしゃれな雰囲気を表現できますが、あまりに小さいと文字が読めなくなります。

また、SEOの観点から見てもフォントサイズは重要です。検索エンジン最大手のGoogleはユーザビリティを重要視しており、フォントサイズが小さく読みにくいホームページは、検索順位にネガティブな影響を与える可能性があります。そのため、最低でもGoogleが提唱する16pxのフォントサイズを守ることが必要です。

4.ホームページ制作業者選定にあたって注意すべきこととは?

対面で打ち合わせが可能か

ホームページ制作にむけた打ち合わせを、対面型で対応してくれる業者を選ぶのがベターです。最近はリモートワークの人も増え、オンライン上で業者とコミュニケーションを取る方も増えているかと思います。

オンラインでのやり取りは便利ですが、対面でのコミュニケーションと比べて、意思疎通がしにくい部分もあるかと思います。

たとえば、ホームページで使いづらい点や強調したい点を説明する際、メール・口頭だけでは十分に伝えきるのは難しいかと思います。メールや口頭のみでやり取りを進め、プロジェクトが出来上がってきた時に「こんな筈じゃなかった!」というコミュニケーションの齟齬が生まれてしまう可能性も十二分にあります。それを防ぐための方法の一つとして、「対面でのコミュニケーション」を選択できる業者を選ぶようにしましょう。

円滑なコミュニケーションを図れるか

上記にも関連しますが、「円滑なコミュニケーションを取れるか」も重要なポイントです。クライアントとのコミュニケーションの取り方、スタンスはホームページ制作業者によって大きく異なり、クライアントに傾聴して考えを尊重した提案をしてくれる業者もあれば、クライアントの意図を汲み取らない提案をしてくれる業者もあります。特に注意したいのは、よく分からない専門用語を羅列してくる業者です。

相手目線に立っていない、とも言えますので、発注後もコミュニケーションの摩擦が起こる可能性もあります。

担当者との相性などももちろんありますので、一度見積もりをとる段階で、業者とのコミュニケーションをしっかりと図り、円滑なコミュニケーションを図れるかをチェックしましょう。

プロ目線で提案をしてくれるのか

クライアントの要望・オーダーを聞き、プロの目から見た提案をしてくれるのかも重要な判断基準です。

中には、制作スピードや低コストである代わりに、クライアントの要望・オーダーをそのまま聞き入れて即制作に入る業者もありますが、ホームページが持つ用途・目的を叶えるためには、プロの目線から見たアドバイス・提案が必要です。そのため、こちらの意図・オーダーをそのまま鵜呑みにするのではなく、より良い提案を熱心に持ってきてくれる業者の方が、ホームページ制作のプロとして信頼できる存在であると言えます。

同業他社の実績があるか

同業種の制作経験があることで、より具体的な制作イメージを持って検討することができます。業界自体の説明をイチから行う必要もないですし、セオリーなども踏まえて制作してくれるので、スムーズに進められる可能性がグンと上がります。

業界特有のポイントなどがある場合は、同業他社の実績がある制作会社に依頼することがおすすめです。また、単純に同業種の制作経験が多ければ多い程、様々なパターンの事例を見ることができるので、検討するホームページのデザイン構成の選択肢も増やすことができます。

制作会社の規模が希望の制作とマッチしていそうか

もちろん一概には言えませんが、大規模な企業と小さすぎる制作会社、小規模な企業と大きすぎる制作会社の相性はあまり良くないことが多いです。

100名を超える大きな制作会社の場合、単価が高いため、コストに見合わない可能性があります。

一方、10名以下の制作会社に数百ページにも渡るホームページ制作を依頼した場合、荷が重く、プロジェクトが難航してしまう状況に陥ることも予想されます。

中には、小規模な制作会社であっても、ハイクオリティなホームページを制作してくれる会社もありますので、必ずしも言い切れることはありません。あくまで全体として、そのような傾向があることを頭の片隅に入れていただければと思います。

体制がしっかりしているか

上記と似通っていますが、制作会社の大半は50名以下の小規模なものです。その少ない人数の中で複数のホームページを日々制作しています。

数多くのプロジェクトを事故なく納品するうえで、体制づくりは重要です。1つの職種に偏らず、プロデューサー、アートディレクター、システムエンジニアなど、各工程の指揮を執るポジションがしっかり組まれている体制の制作会社は品質の高いものを納品してくれることが期待できます。

ツールなどを使用してプロジェクト管理しているか

ほとんどの場合、制作に関わるのは、1人のスタッフだけではありません。一つのホームページを制作するにあたって、製品ページ担当、企業情報ページ担当、採用ページ担当・・・といったように、複数のスタッフがジョインし、プロジェクトを進めるスタイルを取り入れている制作会社もあります。

そこで重要になってくるのが、プロジェクト管理です。

せっかく進んでいたデータがいつの間にか上書きされたり、最新の情報が分からなくなってしまうことも起こり得ます。そのようなトラブルを防ぐためのプロジェクトツールが、様々開発されています。中には、「slack」や「チャットワーク」などを代表とした、一つのツール上で各社同士でやりとりできるツールもありますので、プロジェクト関係者に一斉に連絡することができ、コミュニケーションも円滑に取ることができます。

運用のフォローもしっかりしているか

ホームページは、制作して終わりではありません。

情報を定期的にブラッシュアップすることで、「常にフレッシュな情報がアップされているホームページ」としてユーザーへPRすることで、集客力は上がっていきます。

その上で、公開後もサーバー保守・運用をサポートしてくれる制作会社を選ぶことがおすすめです。運用を制作会社とは別の会社に頼む場合、ホームページの用途・目的をゼロから説明しなければならない時間的コストもかかりますし、運用サポートの代行依頼という金銭コストも別途かかってしまいます。そのため、なるべく全体のコストを抑えるために、制作~運用までワンストップで対応してくれる制作会社を選び、ホームページ関連の窓口を一本化してしまいましょう。

Web集客の知識や経験があるか

ホームページを公開した後は、対象ユーザーに訪問してもらう必要があります。そのためには、ホームページの流入数を増やすための窓口をつくったり、対象ユーザーがホームページへ行きつくためのSEO対策を打つなど、具体的な施策が必要です。

ホームページを制作したら、ハイ終了、ではなく、マーケティングの観点から運用ノウハウ・アドバイスをしてくれる業者を選ぶようにしましょう。

制作会社自身のホームページが分かりやすいか

掲載されている制作実績を確認される方は多いと思います。でもそれでは不十分です。

制作実績として掲載できる案件はごくわずかで、表に出していないだけで誰もが知っている大手企業の制作も多く手掛けているということはよくあります。そこで見て欲しいのが、ホームページ全体です。

5. 最後に

以上、本記事では見やすいホームページを作る上で押さえたいポイント・注意点などについて詳しくまとめさせていただきました。

最後に、ホームページの見やすさとは何か?についてまとめさせていただきます。ズバリ、見やすいホームページとは、『用途・目的が明確であり、分かりやすく情報が整理されており、どのようなデバイスにも最適化された、ユーザーにとって思いやりのあるホームページ』と言えます。

これら全てのポイントを押さえるためには、ホームページ制作会社が本記事でまとめた重要ポイントをしっかり押さえているか?を慎重に見極めるようにしましょう。

納品スピードや低コストばかりを追求してしまうと、制作してから「もっと時間とお金がかかっても、良いホームページを作るべきだった・・・」と、安物買いの銭失い状態となってしまう恐れもあります。

せっかく作るなら、後悔しない、満足のいくホームページ作りを目指しましょう!ぜひ、今後のホームページ作りにむけて参考になさってみてくださいね。


無料のご相談窓口はこちら!あなたに最適な業社選定致します
\最短1分!/今すぐ相談