こんにちは！明石・神戸市西区のデザイン会社クロコデザインでデザイナー兼ディレクターをしていますカジさんです。

今回は、SEOが強いサイトにするために、デザインで気を付けるべきポイントを簡単にまとめてみました。

ビジュアルが美しいWebサイトを作っても、検索結果で引っかからなければ見られることもないですし、ユーザーがすぐに離脱してしまうようなサイトだと「求めていた情報がなかったから離脱した」とGoogleが判断してしまいSEOにも影響がでます。
では、Webデザイナーはどういった点でSEOに気をつければいいのでしょうか。

　

SEOに強いWebデザインの5つのポイント

　❶モバイルフレンドリーなサイトを意識する

　❷レスポンシブデザインにする

　❸ページの表示速度を意識する

　❹ファーストビューは目につくものにする

　❺パンくずリストを使用する

1.モバイルフレンドリーなサイトを意識する

モバイルフレンドリーとは、モバイル（スマートフォン）でも使いやすいサイトのことです。

Googleは「モバイルフレンドリー」であるかどうかを、サイトを評価する判断材料にしています。
その為ちゃんとモバイルフレンドリーになるよう対策することで、Googleから高く評価され、検索結果に上位表示させれる可能性も高くなるのです。

対策法としては、スマートフォンの画面サイズでも見やすい文字サイズ又はフォントにしたり、ボタンがタップしやすいようにレイアウトを意識するといったことが挙げられます。

2.レスポンシブデザイン

レスポンシブデザインとは、どのデバイスからでも使いやすいように意識して作られたサイトのことです。
パソコンやスマートフォン、タブレットなど、デバイスによって画面のサイズや比率はバラバラですが、レスポンシブデザインが施されていると各デバイスの画面に適したレイアウトに自動で切り替わるため、どのデバイスからアクセスしても快適に閲覧できるのです。

レスポンシブデザインのサイトは、HTML1つに対して各デバイスごとのCSSを使用します。そうすることで、デバイスごとにレイアウトは変わっても同じ内容を表示することができ、管理の手間も減ります。

3.ページの表示速度を意識する

検索エンジン(Google、Yahoo！など)の評価基準で最も重視されているのはページの表示速度です。
どんなに魅力的な内容のサイトでも、ページの表示速度が遅いと待ち時間を不快に感じたユーザーが離脱してしまいます。
すると検索エンジンは、ユーザーにとって“使いづらい”サイトと認識し、更にはSEOの評価も下がってしまいます。

表示速度を落とさないためには、デザインに使用する素材を圧縮、画像や動画のサイズはなるべく小さくするのが有効です。
きれいなサイトを作ろうと高解像度の画像ばかり使うことで、その分画像の読み込みに時間がかかり表示スピードも遅くなってしまうので注意してください。

4.ファーストビューは目につくものにする

ファーストビューは、サイトにアクセスしたユーザーの目に最初に入るエリアです。サイトの印象がここで決まるのでとても重要な役割です。

ファーストビューに「興味を引く内容ような情報が無い」「デザインが見づらい」など悪い印象付けてしまうと、スクロールする前に離脱するユーザーが増えてしまいます。

それを防ぐためにも、ページの内容が分かりやすくユーザーの興味を引く内容が配置されたファーストビューにすることが大切です。

5.パンくずリストを使用する

パンくずリストは、サイトを観覧しているユーザーが、サイト上でどの位置にいるのかを示したテキストの表示です。

どのページにいるのか視覚的に分かりやすく、目的のページまでの道しるべにもなります。ユーザーにとって“使いやすい”サイトとして評価されるのでSEOにも良い効果をもたらしてくれます。

さらに、パンくずリストが設定されていると検索エンジンがサイトを読み込みやすくもなります。

パンくずリストを設置する際、まずはサイトの階層(ページ)構造を整理しておきましょう。
階層があまりに多いと、たとえパンくずがあっても目的のページにたどり着く前にユーザーが迷子になってしまう可能性があるので、分かりやすく適切なページ構成にすることをオススメします。

今回のまとめ

WEBデザインとSEOは直接関係性があるわけではありません。
しかし、ユーザーが使いやすいと感じるWEBデザインは離脱率や直帰率が下がり、SEOへ良い影響を与えることにも繋がります。

“どんなデバイスでも読みやすいテキストサイズ”
“快適な表示速度”
“興味を引くページデザイン”

など対策は様々…！

ユーザーが見やすく使いやすいサイト＝SEOに強いサイトです。

サイトを制作する機会があれば、快適に観覧してもらえるようなWEBデザインを是非意識してみてください。