ワンクリックに命がけのWEB・ホームページ制作会社「エムハンド」

インバウンドサイトを作るときに知っておきたいこと

スマホサイト整備に待ったなし!?Googleが「スマホ対応」ラベルの対応を開始!

  • コンテンツ

字が小さい、写真が大きすぎて画面からはみ出している、リンクがタップできない……スマートフォンでWEBページを見ているとき、「わかりにくい」「使いづらい」と感じた経験を持つ方は多いと思います。もしあなたのホームページがそんな状態なら、多くの見込み客を取り逃してしまうかもしれません。

さらに最近では、Googleが、モバイル版の検索結果にスマホ対応のラベルを追加することを発表。そこで今回は、SEO対策としても対応が急がれる「スマホ用サイトの整備」事情について、取り上げてみたいと思います。

パソコンを上回り始めたスマートフォンでのWEB閲覧

携帯サイトはパソコンサイトの簡易バージョン…いまだに、そのようなイメージを持っている方は少なくないようです。それには、WEB制作の現場で、「まずパソコン版を充実させてから、シンプルな携帯電話版を作る」という流れが長く一般的だったことが影響していると思われます。

しかしそれは、表現可能なデザインや機能で、パソコンが携帯電話を大きく上回っていた時代の話。もはや、状況は一変しています。パソコンにひけをとらない、高性能なスマホやタブレットでのWEB閲覧が標準化してきているのです。

企業のWEB担当者もスマホを意識

ソフトウェア会社Adobe(アドビ)が企業のWEB担当者を対象に行った調査では、「モバイルサイトの制作ニーズが高まっているか?」という質問に対し、約9割がその必要性を感じると回答。その理由として、以下のようなものが挙げられていました。

  • モバイルからのアクセスが増えているから
  • 他社の成功事例を見るから

また80%近くが、モバイルサイトを「すでに運用している」または「制作中もしくは制作を予定」していると回答。モバイルサイト全般、ひいてはスマホ用サイトの整備が、WEB担当者の間で強く意識され始めていることが分かります。

グラフデータはAdobeによるWEB担当者アンケートより

Googleが先導する「モバイル優先」

SEO対策においても、スマホ用サイトの整備は急務となりつつあります。検索サービスを提供するGoogleは、かねてから来るべきスマホ時代を予測。モバイル優先のWEBサイト・サービス運用を強く支持してきました。そして今年11月19日、それをさらに推し進める対策を、モバイル版のGoogle検索に施すと発表しています

その内容は、スマホで見やすく(使いやすく)しているサイトについては、検索結果に以下のような「スマホ対応」ラベルの表示を行うというもの。発表時点で、「今後数週間で順次日本を含む世界中で公開する予定」だとされています。

スマホ対応ラベル

スマホ最適化度合の判断基準

スマホに最適化されているかどうかは、以下のような基準で評価されるということです。

  • 携帯端末では一般的でないソフトウェア(Flashなど)を使用していないこと
  • ズームしなくても判読できるテキストを使用していること
  • ユーザーが横にスクロールしたりズームしたりする必要がないよう、コンテンツサイズが画面サイズと一致していること
  • 目的のリンクを簡単にタップできるよう、各リンクが十分離れた状態で配置されていること

検索順位への影響

このような話を聞くと、気になってくるのは、検索ランキングに影響するのかどうか、という点ですよね。スマホに最適化しているかどうかは、今のところ表示順位には関係しない模様です。とはいえGoogleは、「このモバイルフレンドリーの条件をランキング要素として使用することも実験中」と公式に発言。今後、評価に取り入れる可能性は、十分にあるといえそうです。少なくともGoogle検索においては、今後いっそうスマホ用サイトが重視されていく方向で間違いないでしょう。

自社メディアをテストしてみよう

「スマホ用サイトの重要性はわかった。手始めに何をすればいい?」そんな方には、Googleが提供するテストツールをおすすめ。スマホに最適化しているかどうかを手軽に調べられる、とても便利なWEBツールです。

Mobile-Friendly Test

image022
https://www.google.com/webmasters/tools/mobile-friendly

四角い欄にコーポレートサイトなどのURLを入力し、「ANALYZE」ボタンをクリックするだけ。詳細は英語表記ですが、色でOKかNGか判断することが可能です。利用例を見てみましょう。

スマホに最適化されたサイトの場合
緑色の帯が上部に表示され、「素晴らしい!このページはモバイルフレンドリーです」と称えられます。スマホで閲覧した場合の画面も、バーチャルに確認することができます。

スマホに最適化していないサイトの場合
赤い帯が上部に表示され、「モバイルフレンドリーではありません」と告げられます。判定の理由についても、字が小さすぎる・リンク同士が近すぎる(からタップしづらい)などと説明されます。

素晴らしい!このページはモバイルフレンドリーです モバイルフレンドリーではありません
チェック結果例

結果に対する具体的な改善にあたっては、WEB制作の専門知識が必要になってきます。テストツールで確認したら、詳細を印刷するなどして、制作スタッフや制作会社に相談してみてください。

今回のまとめ

  1. スマホでのWEB閲覧が標準化。サイト運営はモバイル優先の傾向に。
  2. Googleの動きなどからも、SEO対策においてもスマホ用サイト整備は急務に。
  3. テストツールを使い、スマホ最適化の切り口を探してみよう。

閲覧数の増加が見込まれるスマホ用サイトへの展開は、集客力強化の新たなチャンスにもなり得ます。サイトリニューアルをお考えの際などには、ぜひ視野に入れてみてください。当社でも、スマートフォンサイトの制作を行っていますので、お悩みの折にはご相談ください。また、よろしければ、「WEBページのスマホ対応でレスポンシブWEBデザインが注目されるその理由」も参考にしてください。

<参考サイト>

企業のWEB担当者に聞いてみた17の質問(Adobe Pinch In/レポート)
http://www.adobe.com/jp/jos/pinchin/report/2014h2-17-questions-for-web-managers.html

検索ユーザーがモバイルフレンドリーページを見つけやすくするために(Google)
http://googlewebmastercentral-ja.blogspot.jp/2014/11/helping-users-find-mobile-friendly-pages.html

この記事に関連する記事

カテゴリー

アクセスランキング

月間

  1. 1

    いまさら聞けない!フリック、スワイプ…スマホ操作の基本用語まとめ

  2. 2

    【WEBデザイン10選】これぞ進化系!今どきのレスポンシブWEBデザインサイトまとめ

  3. 3

    【保存版】アツイ視線が集まる激戦区!女性向けWEBメディア50選

  4. 4

    今どきの幼稚園・保育園ホームページ研究。32サイトに見る傾向と課題とは?

  5. 5

    【WEBデザイン10選】コンバージョンUPにも!パララックスを効果的に使ったLPまとめ

  6. 6

    【WEBデザイン10選】シンプルでわかりやすい「1カラム」サイトまとめ

  7. 7

    【WEBデザイン10選】雑誌風デザインを上手く取り入れたWEBサイトまとめ

  8. 8

    【事例に学ぶ】話題の新興SNS、Instagramを集客に使うコツ

  9. 9

    今年はこうなる!2016年のWEBデザイン、5つのトレンドを大胆予想!

  10. 10

    「プッシュ通知はアプリのもの」は過去の話。簡単にできるブラウザでプッシュ通知する方法

総合

  1. 1

    いまさら聞けない!フリック、スワイプ…スマホ操作の基本用語まとめ

  2. 2

    【保存版】アツイ視線が集まる激戦区!女性向けWEBメディア50選

  3. 3

    【WEBデザイン10選】これぞ進化系!今どきのレスポンシブWEBデザインサイトまとめ

  4. 4

    初めてでもできる!iPhone動画編集アプリ【厳選4つ】

  5. 5

    【WEBデザイン10選】コンバージョンUPにも!パララックスを効果的に使ったLPまとめ

  6. 6

    【事例に学ぶ】話題の新興SNS、Instagramを集客に使うコツ

  7. 7

    【WEBデザイン10選】シンプルでわかりやすい「1カラム」サイトまとめ

  8. 8

    【WEBデザイン10選】背景に動画を大胆に使った日本のサイトまとめ

  9. 9

    今年はこうなる!2016年のWEBデザイン、5つのトレンドを大胆予想!

  10. 10

    【WEBデザイン10選】雑誌風デザインを上手く取り入れたWEBサイトまとめ

エムハンドブログ編集部

  • 編集長みつむね

    得意分野はWEBマーケティング/コンテンツ編集。「インバウンドブログ」立ち上げから編集に参加。

  • 伊藤 高啓

    SNS運営からWEB広告/マーケティング業界を経て、鳴り物入りでエムハンドブログ編集長に就任。

  • 新棚幹太

    雑誌出版社を経てフリー編集者に。東京生まれ、京都暮らし4年目のオールラウンドライター。

  • 島田

    某グルメ雑誌の編集長を経て、業界違いのWEBへ転身。独自の視点で個性的な記事を手がける。

  • ヨネクラ

    WEBメディアの立ち上げに参加したくエムハンドライティングチームに参加。早稲田大学出身。

  • キクチ

    京都大学卒業後、京都大学院工学研究科に進学。研究を続けながらライター業に従事。

  • 池田仮名

    週末Webプランナー。情報システムの発展によって変化していく人の心や共同体のありかたに興味。

最新記事

  • M-HAND 士業
  • M-HAND 歯科
  • Logonic
  • M-HAND TechnicalBlog

ワンクリックに命がけのホームページ制作会社「エムハンド」