NOANAVI

BLOG

SEOに効果的なWEBデザインとは?

この記事では、WEB制作におけるWEBデザインの重要性についてご説明いたします。

SEOに配慮したサイトの制作を考えている方や、WEBデザイナーになりたいと考えている方に読んで欲しい記事になります。

WEB制作においてデザインはSEOにとって重要な要因であり、
サイトの目的を達成するためにも重要ですのでWEBデザインは通常のデザインと異なるという意識を持ちましょう。

SEOにデザインは関係あるのか?

WEBデザインは検索エンジン最適化(SEO)において重要な要因になります。
そのため、SEOを意識したWEBデザインを行う必要があります。

検索エンジン最適化(SEO)スターターガイドによると

実際にGoogleのSEOマニュアルである、
検索エンジン最適化(SEO)スターター ガイドではこのように記載されています。

ユーザーが快適に利用できないモバイルページは、モバイル検索結果で掲載順位が下がったり警告が表示されたりします。

検索エンジン最適化(SEO)スターター ガイド

このようにGoogle SEO のマニュアルに当たる検索エンジン最適化(SEO) スターターガイドでは掲載順位が下がると記載されています。

Google Search Consoleでエラーになる

Google Search Consoleでもサイトのデザインにおいてエラーとして
お知らせがくるケースがあるのでその際はエラー内容を確認し改善することがおすすめです。

実際にあるエラーとしては

貴サイトでは、以下の問題が検出されました。
クリック可能な要素同士が近すぎます
テキストが小さすぎて読めません

Google Search Console

またこちらに関しては実際にデザインとして譲れない部分もあると思います。
その際は個性とのバランスになってくるかと思いますが、基本的にはGoogleの規約に基づいたデザインにしましょう。

SEOに効果的なデザインとは?

SEOに効果的なデザインは、「ユーザーの利便性」を最優先すること。

こちらがGoogleにおけるSEOの一指標になります。
つまり、SEOを意識するには第一にユーザーが使いやすいデザインにすることが大切です。

例えば、ファーストビュー(ページを開いた際にスクロールしなくても見える範囲)に大事な情報を記載すること、ファーストビューで見にくいサイトはブログの記事や商品・サービス内容を見てくれません。

では、順番に確認していきましょう。

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

レスポンシブデザインとは、スマートフォンやタブレット、PCどの端末で閲覧してもそれぞれで見やすいデザインにすることです。

近年ではスマートフォンの普及からWEB制作において、
モバイルファーストという言葉があるようにPCだけのデザインだけでなく
WEBデザインはレスポンシブで行うようにしましょう。

投稿日・更新日の記述

投稿ページ(ブログページ)のファーストビューに必要になるのが、「投稿日・更新日」の記述です。

調べたいことがある場合、投稿日・更新日が明確で新しい記事がより参考になりますし、信用も出来ますので必ず記載しましょう。

こちらはWordPressのテンプレートタグを使うことで投稿、更新するたびに自動で変更してくれます。

目次を記述する

次にファーストビューで見せるべき内容は「目次」です。
目次はユーザーが見たい情報が書いてあるかひと目で分かるため是非記載しましょう。

目次はfunctions.phpで見出しを並べて表示するようにしましょう。
もしくはプラグインで表示もできますので使用用途に合わせてプラグインの導入も検討してみましょう。

SEOに効果的な文章デザイン

文章のデザインに関してはユーザーが見やすい文字サイズなど意識する必要があります。

見やすい文章デザインにすることで、ページ滞在時間のアップにも繋がります。

文字サイズ

文字サイズは、先程ご説明したレスポンシブデザインと関係しています。

ブラウザの画面幅により見やすいサイズに設定しましょう。

改行幅

改行幅も文字サイズと同様にレスポンシブで読みやすい改行幅の設定が必要です。

隣のリンクとの幅

隣のリンクとの幅に関しては、間違ったリンクをクリックしてしまう可能性があるため、ユーザビリティーを損なうため注意しましょう。

文字色

文字色は背景色とかぶらないように見やすいようにしましょう。

まとめ

この記事でご説明したとおり、ブログやサイト内のキーワードだけでなく、デザインにおいてもSEOに関係していることがわかります。

要約すると、WEBデザインにおいて最優先で考えるべきことは、
ユーザーが使いやすいサイトになっているかです。

自分自身がこのサイトで情報を知りたいと思えるか、購入するならこのサイトかを客観的に確認しながら制作しましょう。