SEOに強いWebデザインとは？デザイナーが意識すべきポイントを解説

メディアを使った集客には欠かせないSEO対策。近年はコンテンツの質を重質する傾向が強いですが、サイトの内部構造を最適化すること欠かせません。デザイン・コーディングをするWebデザイナーにとって無縁のものではないのです。

そこで今回は、Webデザイナーが最低限知っておきたい、SEOの基礎知識やツールについて解説します。なんとなく難しそうだから、今まで勉強するのを避けてきたという方も、この機会にSEOを学び、仕事の幅を広げてはいかがでしょうか。

＜この記事に関連する記事＞

• Webデザイナーにマーケティングの知識は必要！デザインに活かせるTipsも
• Webマーケターの平均年収は？1000万円稼げる？
• Webデザイナーに求められるスキルレベルは？未経験でも最低限必要なのは？

目次

• SEOとは？
• WebデザインはSEOに影響しない？
• これからのSEO対策はモバイルフレンドリーを重視
• Webデザイナー必見！SEO対策に必要な5つのポイント
• SEOに役立つGoogleの無料ツール
• まとめ

SEOとは？

SEOとは、「Search Engine Optimization：検索エンジン最適化」の略。Googleなどの検索サービスにおいて、当該ページを検索結果の上位に表示させるための取り組みをSEO対策と呼びます。

Yahoo!は独自のアルゴリズムを使用していましたが、2010年7月にGoogleと提携し、現在はGoogleのアルゴリズムを使用しています。GoogleもYahoo!も、検索順位を決める仕組みは一緒なので、検索結果にほとんど違いはありません。
 
検索サービスには他にMicrosoftのBingなどもありますが、GoogleとYahoo!を合わせて90%以上のシェアを誇っています。そのため、Google検索への理解を深めることが、SEO対策にとっては重要です。

WebデザインはSEOに影響しない？

デザインとSEOの関係を考える上で大事なのはユーザービリティです。おしゃれなサイトだからSEOに有利ということはありませんが、ユーザービリティの悪いデザインではSEOにとってマイナスになりうる可能性があります。

例えば、情報を得るために訪問したサイトで、要素がごちゃごちゃして分かりづらい、文字が小さくい場合は離脱してしまうことが多いでしょう。諦めて別のサイトを探すようになるかもしれません。

このようなユーザー体験はサイトの評価を下げるものになりかねないため、デザインもSEOにとっては重要な要素です。検索順位を上げる要素にはなりづらいものの、ユーザビリティの悪いデザインはマイナスになる可能性が高いと考えられます。

これからのSEO対策はモバイルフレンドリーを重視

デザイナーがSEO対策を考えるときに気を付けるべき項目のひとつが「モバイルフレンドリー」という概念。2015年にGoogleが実装したアルゴリズムで、モバイルフレンドリーアップデートとも呼ばれています。

スマホやタブレットで読みやすい、使いやすいことを重視し、閲覧に適していないページの検索順位を下げる仕組みのことです。以前まではパソコンで表示されるページを評価して順位に反映していましたが、日本を含めて10カ国でモバイルでの検索がパソコンを上回ったために、大幅な方針変更に踏み切っています。

「Googleウェブマスター向け公式ブログ」で2018年に発表されたこのアルゴリズムは、モバイルファーストインデックス（MFI）といいます。これはどんなにパソコン表示でのデザインがよくても、モバイルで見たときに最適化されておらず、見にくいデザインや配置だった場合は、評価が低くなってしまうのです。

このように、今後のWebデザインとしてモバイルフレンドリーを取り入れることは必須となり、SEO対策として注意せざるを得ない重要な項目といえるでしょう。

Webデザイナー必見！SEO対策に必要な5つのポイント

ここからは、SEOを意識したデザインのポイントを5つ紹介します。

1.モバイルフレンドリーなUI/UXを意識する

Googleが検索順位を決める際に重要と考えているのが、「ユーザーファースト」の視点です。モバイルファーストインデックス以降は、スマートフォンでのユーザビリティが重要であり、以下の項目に注意しましょう。

見やすいフォントとサイズ

スマホで見たときに、フォントが小さいと拡大する必要があるなど、読みづらさが生じます。また、細かく詰まって見えづらい文字ばかりのページにならないよう、文字間を空ける必要があります。フォントサイズについては17px前後がいいでしょう。

再生できないコンテンツを使用しない

Flashなどはモバイルでは再生できないコンテンツですので、パソコンでは問題なくてもモバイル用サイトでは種類を変える必要があります。

タップできる要素と要素の間隔を取る

タップする要素が近すぎるものは間違えて触ってしまい、別ページに跳ぶなど誤タップを発生させます。ユーザビリティの低下を避けるために、32px以上取ることが望ましいです。

インタースティシャル広告の回避

インタースティシャル広告とは、画面いっぱいに広がる広告をさします。ユーザーが読みたいコンテンツを阻害しますので、このような広告を表示するページの評価を下げてしまう可能性があります。

スマホでのユーザビリティを追求することは、今後のWebデザインでも主流になっていくでしょう。上記の観点に注目し、ユーザビリティのよいWebサイト制作を心がけましょう。

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

「ファーストビュー」は、サイトの印象を決定する重要なパーツ部分です。ページのファーストビューに興味を引く内容がなく、見づらいと印象付けてしまうと、ユーザーはスクロールせずに離脱してしまいやすくなります。

ユーザーに見てもらいやすいサイトにするために、ファーストビューでページの内容が理解でき、コンセプトや関心を引く内容を配置するデザインを意識することが大切です。

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

前述の通り、Googleはモバイルフレンドリーを重視しているため、「レスポンシブデザイン」にすることが推奨されています。レスポンシブデザインとは、モバイルの画面サイズによってページのデザインやレイアウトを変える技術を指します。

この技術はひとつのURLでスマホページとパソコンページのリンクを共有でき、ひとつのHTMLファイルでページを表示できるため管理がしやすいのが特徴です。またGoogleのクローラーも巡回しやすいというメリットもあると言われています。

4.ページの読み込み速度の改善

Googleは「ページの読み込み速度を改善する」ことを重視しています。スマホでWebサイトを見るとき、表示スピードが遅いと離脱してしまう可能性が高く、ユーザービリティを損ねてしまうでしょう。

読み込みの速度を改善する作業は、フロントエンドエンジニアやバックエンドエンジニアが担当する作業ですが、デザイナーにもできることはあります。ビジュアルを優先するあまり重い画像データやプラグインを使用しないなど、考慮するとよいでしょう。

5.パンくずリストを作成する

「パンくずリスト」とは、今閲覧しているページがどこの階層か分かるように表示するリンクのことです。このリストにより、ユーザーが「どこを閲覧しているのか」が明確になりユーザビリティの向上につながります。

中には、下層ページまで手が回らず、パンくずリストを設定していないサイトも見受けられますが、SEOにおいても重要な要素です。パンくずリストが設置されていることで、サイトのページ構造をクローラーが認識しやすくなるメリットがあります。

SEOに役立つGoogleの無料ツール

最後にGoogleが提供しているツールの中でSEOに関係するものを紹介します。Search Console、Analytics、AdWordsのキーワードプランナー、これら3つのツールはいずれも無料で、SEOの分析に広く活用されていますよ。

Google Search Consoleに登録する

以前はGoogleウェブマスターツールという名称でしたが、2015年5月よりGoogle Search Consoleに名称変更されました。Google Search Consoleは、Google検索結果でのサイトのパフォーマンスを監視・管理するための無料ツールです。サチコ、GSCなどと略されます。

Webサイトが検索エンジンに何ページインデックスされているか、検索結果にどれくらい表示されているかなどの情報を調べたり、インデックスを促すためのサイトマップの送信ができたりします。サイトを公開したときには登録必須のツールと言えるでしょう。

Google Analyticsに登録する

Google Analyticsは無料で利用できるアクセス解析ツールで、GAと略されます。無料ながら、機能が非常に充実していて、SEOのみならずWebマーケティングには欠かせません。
 
アクセス数、ユーザー数、平均セッション時間（滞在時間）、直帰率、新規セッション率、ユーザーの環境、ユーザーの使用デバイスなど、さまざまなデータを取得できます。Google AdSenseやGoogle Search Consoleとの連携も可能です。

Google AdWords キーワードプランナー

Google AdWordsは、PPC型（クリック報酬型）のオンライン広告プログラムです。広告を出稿するには費用がかかりますが、登録するだけであれば無料です。
 
Google AdWordsの機能のひとつであるキーワードプランナーは、検索のボリュームや検索キーワードを調べるのに役立ちます。キーワードプランナーの利用は無料で、Google AdWordsに登録すれば誰でも利用できます。

SEO対策をする上で、キーワードの選定は非常に重要な作業。キーワードプランナーを使えば、ユーザーがどんなキーワードで検索しているのかを知ることができるので、サイトやブログのコンテンツを作成する前に調べておきましょう。

まとめ

Webデザインと、これから必要なSEO対策について紹介しました。検索上位につながるサイトにはGoogleの評価が鍵となります。そのためには、モバイルフレンドリーを重視し、よりユーザーファーストの視点が必要です。SEO対策のポイントを踏まえながら、オリジナリティのあるWebサイトデザイン構築が求められてゆくといえるでしょう。