WebデザインとSEOの関係性とサーチランキングUPの3つのポイント

ナレッジ・ノウハウ

Webサイトをデザインする際、ビジュアル的な完成度のほかに意識すべきことがいくつもあるのは、みなさんご存じの通り。ユーザビリティ、レスポンシブデザイン、サーチエンジン対策…等々、考慮すべき要素がいろいろとあります。どれか1つでも欠けてしまうと、Webマーケティングの目的である「集客」に影響が出てくることも。

今回はこのなかの１つ、「サーチエンジン」について考えてみたいと思います。WebサイトのデザインがどうSEO（Search Engine Optimization：検索エンジン最適化）に影響するのかをみながら、サーチランキングUPのためのポイントをご紹介します。

1. ロード時間を短く

Webサイトでは、コンテンツのボリュームが多い場合、それらを表示するためのロード時間が長くなってしまうことがありますね。これは、SEOの観点からみると好ましくないため、避けていきたい問題です。そのためには、たとえば次のような要素を効果的に取り入れるとよいでしょう。

無限スクロール（Infinit Scroll)

TwitterやFacebookで導入されていることでお馴染みの、「無限スクロール(Infinite Scroll)」。画面をスクロールしてページの下部まで移動すると、次のページを自動的に読み込んで延々と表示してくれる機能です。ユーザーは、1ページの中でいろいろなコンテンツをササッと見ることができ、ロード時間が短くて済みます。

Googleも、サーチエンジンとの相性を考慮した無限スクロールの推奨構成を公式ブログで発表しています。そちらも参考にするとよいでしょう。
＊Google ウェブマスター向け公式ブログ（日本語版）

HTML5

HTMLの最新バージョンとしてお馴染みのHTML5。サイトに埋め込まれた動画やアニメーションのロード時間を短くすることができ、ユーザーにもサーチエンジンにも好まれます。HTML4との違いをチェックしながら、有効に活用していきましょう。

2. 図表を使うときは、サーチエンジンにも分かりやすく

イラストやアニメーションをサイトに取り入れる際には、注意が必要です。テキスト等で補足情報を付けないと、サーチエンジンにとっては、「それがどんな内容のコンテンツかが分からない」ということが起こります。

インフォグラフィックス

見栄えが良く、ユーザーに知ってほしい情報を分かりやすく表示できるインフォグラフィックス。上手く取り入れることで、Webマーケティングの効果アップを狙うことができます。ところが、図表を表示するだけでは、Googleのサーチエンジンにとってはコンテンツの意味が分からないので、文字やaltタグで補完する必要があります。

Flash

インフォグラフィックスと同じ理由で、Flashを用いて表示する要素の中だけに文字のメッセージを入れることは避けたいものです。サイト内のほかの部分にも文字情報を入れるなど、「このサイトで何が起こっているか」をサーチエンジンに分かりやすくする工夫が求められます。

3. ユーザーを混乱させないデザインに

SEOの観点からWebサイトの設計を考えると、デザインに凝りすぎてユーザーを混乱させることがないように、気を付ける必要があります。

リンクは分かりやすく！

リンク部分をカモフラージュして、ユーザーがどこをクリックすればよいのかを分かりにくくしてしまうのは、NG。ユーザーも混乱しますが、サーチエンジンも混乱してしまいます。凝ったデザインにするつもりでも、SEO的には得策とはいえないので注意しましょう。

色使い

基本的なことではありますが、字が読みやすい色使いになるよう、背景色とフォント色をチェックしましょう。また、サイトの趣旨と色のイメージが合っている必要があります。「海」に関するサイトなのに、イメージカラーが黄色…などのように、ユーザーが混乱するようなデザインは、サーチエンジンに評価されにくくなるでしょう。