Web marketing webマーケティング

 
webマーケティング

4/15セミナー『スマホ対応ラベル完全対策〜Google基準のスマホサイトの作り方〜』

4/15セミナー『スマホ対応ラベル完全対策〜Google基準のスマホサイトの作り方〜』

4月15日(水)に、Googleのアルゴリズム変更に対しての対策セミナーが東京・銀座で開催されました。Googleのアルゴリズム変更が実行される前週ということもあり、今回は参加者の「スマホ対応」ラベルに対する熱が高く、その中から聞こえてきた技術的な質問についてレポートします。

セミナータイトル

『スマホ対応ラベル完全対策』〜Google基準のスマホサイトの作り方〜

セミナー内容

  1. 【はじめに】モバイルからのアクセスが逆転! マルチスクリーン時代に突入
  2. 【第一部】「スマホ対応ラベル」に必要な6つのポイント具体解説
  3. 【第二部】「Googleが推奨するモバイルWebとは?」
  4. 【第三部】「モバイル対応サービス【Mobify】のご紹介」
  5. 【質疑応答】

セミナー概要

  1. 4/21(火)Google 世界一斉でスマホユーザーに新検索アルゴリズム導入
  2. 対応しないと「スマホ対応」ラベルが付かない6つの項目
  3. Google適合とはなにか? 中期的な視点で正しいモバイルサイト運営が大事

 
まずは株式会社ドーモ(以下ドーモ) 代表の占部雅一が、現在の「スマホ対応」関連に関する現在の状況に関して解説しました。「昨年にはスマホからのアクセスがPCからのアクセスを完全に逆転し、今年はいよいよPCではなく、モバイルを中心としたコミュニケーションが重要になってくる」「私たちは、その意識をチェンジしなければならない」と解説しました。

次に、ドーモ CTOの大賀匠竜が、Googleの「モバイルフレンドリーテスト」をパスさせるために、必ずチェックすべき以下の項目を具体的に解説しました。

株式会社ドーモ 技術担当 大賀匠竜

株式会社ドーモ 技術担当 大賀匠竜

  1. ビューポート(表示領域)を正しく設定する
  2. コンテンツのサイズを、ビューポート(表示領域)に正しく合わせる
  3. テキストを大きくモバイル用に読めるようにする
  4. タップ要素同士が近すぎないように配置する
  5. Flash等、モバイルで再生できないコンテンツを削除する
  6. Googlebotがクロールできるようにする

6番目の項目について、「Googlebotがクロールできるようにする」には、サイトの構造が大事となってきます。『別々のURL』『動的配信』『レスポンシブWebデザイン』というスマホサイトの構築手法がありますが、それぞれの手法で構築した場合、どのような対応をすべきかについて説明がありました。

『別々のURL』の場合

別々のURL

上の図のようにPCとスマホで個別のサイトを用意する、いわゆるスクラッチ(セパレートサイト)で構築した場合です。この場合、サイトにアクセスしたデバイスを判別する方法などでリダイレクト設定をする必要があります。しかし、サーバー側で自動的にリダイレクトする設定をしていても、アノテーションが欠けているとGooglebotには、重複するコピーコンテンツと見なされたり、スマホサイトが存在しないという判定をされることもあります。

このアノテーションは元々、正規のURLを検索エンジンに伝えるためのものですが、PCとスマホが別々のURLで存在する場合、この設定は欠かせないものです。

ただし、スマホのページから正規のページとしてPCのページがあることをcanonicalで設定しているだけでは不十分です。PCのページからもスマホサイトが存在することを伝えられるように双方向のアノテーションを設定する必要があります。

rel=”alternate” と rel=”canonical” を使用する場合は、スマホ用ページとそれに対応するPC用ページの関係が1対1になるようにしなければなりません。

また、すべてがトップページを参照してしまう、すなわち1つのスマホ用ページを複数のPC用ページから参照するようなアノテーションは避け(その逆も同様)、ユーザーを混乱させてしまう間違ったリダイレクトをしないように注意すべきです。当然無限ループに陥ってしまうようなリダイレクトミスは起こさないようにしましょう。

別々のURLでのサイト制作は、PC用とスマホ用のページを個別に作ることができるので、一見簡単そうに思われがちですが、運用面での作業が多くなることに加えて、アノテーションやリダイレクトを間違えないよう正確に管理することが求められます。

『動的配信』の場合

動的配信

次に、サーバーがユーザーエージェントに応じて別々のコンテンツを配信する『動的配信』(サーバーサイド・テンプレート調整)の場合です。

URLは1つになりますが、設定を誤ると正しく評価されないことがあります。原因は主にキャッシュで、Googlebotが最初にPCサイトをインデックスするとPCサイトの情報がキャッシュされてしまい、モバイルのGooglebotが訪れた際にVary HTTPヘッダーで別コンテンツが存在することを伝えていないと、キャッシュされたPCサイトの情報を読み込み、スマホに最適化されていないと認識されるわけです。

対処方法は、サーバー側でユーザーエージェントに応じてコンテンツを出し分けていることをVary HTTPヘッダーで適切に伝えることです。そうすることでPCとスマホで別々のサイトがあることを認識させることができます。

『レスポンシブWebデザイン』の場合

レスポンシブWebデザイン(RWD)

最後にレスポンシブWebデザインで構築した場合です。1つのURLでPCもスマホも同じhtmlを利用し、画面サイズによって表示を変える手法で、こちらは問題なくスマホ対応済みと認識されます。

しかし、レスポンシブWebデザインだからといって、安心してはいけません。Googlebotがページとそのアセット(CSS、JavaScript、画像など)をクロールできるようにしなければなりません。

PCサイトだけの場合は、新たに構築をする。スマホサイトの状態が不十分な場合は、改善をする。

スマホサイトが ある ない

さて、それでは、4/21からのGoogleによるスマホ対応とはどうすればいいのでしょうか?

まずスマホサイトがある場合は、以下をチェックし、問題ないようにしておきましょう。

  1. 検索結果で「スマホ対応」ラベルが表示されているか?
  2. 「モバイルフレンドリーテスト」で正しくモバイルフレンドリーと診断されるか?
  3. 更にGooglebotのユーザーエージェントでスマホサイトが表示されるかをChromeを使用してチェック

スマホサイトがない場合は、新規に作成する必要があります。『別々のURL』『動的配信』『レスポンシブWebデザイン』のいずれで作成する場合も、前記したスマホ対応のポイントはきちんと抑えて、どの方法がご自身のサイトに適しているか検討してください。

ユーザーベネフィットの高いモバイルサイトとは

 
ふたたび占部より、ユーザーベネフィットの高いモバイルサイトとはなにかについて解説をいたしました。

Googleの検索エンジンのアップデート、パンダアップデートは27回、ペンギンアップデートでも6回以上繰り返されています。

今回のようなモバイルフレンドリーに対するアップデートは今後、どんどん強化される可能性が十分に考えられます。なにしろ、今回の対応策は、スマホサイトの構築としてはきわめて当たり前の基準だからです。そのため目先の対応方法だけでなく、将来を見据えた対応を考えていくことが必要です。

多くのSEO会社もここまでは解説しているようです。しかし、中期的、将来を見据えるということはどういうことでしょうか。私たちドーモは、Googleの語るユーザーベネフィットとはなにかを考えて、それに応じたサイト設計を提供しています。

ユーザー目線=ユーザーベネフィットと言う視点を踏まえると、表示デザインだけではありません。

今後新たな指標となるのは、クロスデバイスやソーシャル共有、メールリンクなどで、PC・スマホ・様々なデバイスからのアクセスに対して、1つのURLでアクセスできることです。さらに表示スピードが速いことは、ユーザーのストレスを軽減させます。また、根本的なモバイルファーストのコンテンツ設計や機能設計が必要になってもきます。さらに正しくコードを記述することも欠かせません。

スマホ対応 に向けてMobify(モビファイ)

 
最後に、モビファイのプラットフォームの特徴と先進性について、ドーモのモバイル事業部・山崎明日花より解説をいたしました。

モバイルがコミュニケーションの中心です。しっかりとしたサイトがいまこそ求められています。私たちはGoogleの推奨をうけた責任を感じつつ、よりよいサイトを提供していきます。

セミナー終了後に参加頂いた方から、「まずは落ち着いて、キチンと対応できていない部分をすれば良いことを再確認できたからこそ、もっとモバイルについてより深く考えていきたいと感じました」といった感想を聞くことができました。

引き続き、不安を持たれてるお客様のために、できる限りの情報提供をしてまいります。

 

タグ

記事mobifyロゴ
Mobify(モビファイ)とは

Googleが認定しているマルチスクリーン対応のための最適化サービス。
デバイスに応じ、専用にデザインされたサイトを表示することができます。
ページの表示を高速化させる仕組みも持ち合せており、ユーザーの離脱を防ぐことが可能です。

▸Mobify(モビファイ)についてさらに詳しく

 最新記事