スマホ版の管理、ちゃんとしてますか?[MFIに向けて今できそうなこと]

この記事はMFIに向けての啓蒙と対策を目的としています。

「レスポンシブデザインを利用しており、スマホ版は表示設定にしている」

という方、及び、

「レスポンシブデザインを利用しており、スマホ版を表示設定にしている」

方に向けてです。「レスポンシブデザインじゃありません」という方はスルーして頂ければ、と思います。固定幅デザインの方は自己責任&自分で対策ってことでお願いします (´・ω・`)
また、「SEOなんて全然どうでもいいですー。検索に出るとか出ないとか順位もどうでもいいですー。」という方も読まなくて良いと思います(笑)
みんながみんな気にしているわけではありませんので、それはそれで良いと思うんです。

今はまだテスト段階ですので、今すぐどうこうというのはありませんが、2017年冬期あたりに実施するのではないか、と囁かれています。来るべきその時の「前」にできる対策を考えてみようと思います。

MFI(モバイルファーストインデックス)とは

モバイル ファースト インデックスに向けて

モバイル ファースト インデックスに向けて

Google フレンドリーなサイト制作・運営に関するウェブマスター向け公式情報

ざっくり言うと、今後はサイトの第一評価がPCではなくスマートフォンになります ということです。これまではPCが優先でしたので、PCサイトのコンテンツがどうなっていてどう表示されているか、が大きかったのですが、このGoogle方針に従って今後はスマートフォンでのコンテンツ・表示(レイアウト) が重要視されることになります。つまりGoogleは逆転現象を起こそうとしているわけです。

これもう決定事項であり公式発表済みですので、よほどのことが無い限りどんでん返しはありません。

で、ここからはリンク先のGoogleの公式ブログをちゃんと「読んだ」という前提です。そしてFC2ブログの特徴を踏まえての補足説明です。

「レスポンシブサイトは何も変更する必要はありません」について

まずこちらから。
何もしなくて良いのは

  • レスポンシブデザインを採用している
  • スマホ版を非表示 にしている
  • 「モバイル版(スマートフォン版)で表示」などの切り替えボタンを設置していない

上記3項目全てに当てはまる方に限ります。この方は何もしなくて大丈夫ですし、それ以上何もしようがないです。PCでレスポンシブデザインを選んで設定していても、スマホ版を表示している方は該当しません。そしてスマホ版非表示でも切り替えボタンを設置している方はできれば消した方が良いですね。理由は後述。

ダイナミックサービングかセパレートか

「スマホ版」を表示させるには大別して以下の2つの方法があります。

  • スマホ版とPC版を全く別のhtml, CSSで管理し、URLも異なる
  • スマホ版とPC版のhtml, CSSは異なるが、ダイナミックサービングを利用して同一URLで管理する

後者はGoogle推奨です。「何もしなくて良いよ」に含まれます。

別URLというのは、ちょっと前までのAmebaがこういう形でした ↓

  • PC --- ameblo.jp/ID
  • SP --- s.ameblo.jp/ID

スマホ版には s. が含まれて、異なるURLになっています。これが セパレートURL ってやつです。が、現在はMFIへの取り組みとして ダイナミックサービングによる切り替え に変更になり、URLの統一が行われました。現在Amebaブログをスマホから閲覧した際、今まで下部にあった「PC版で表示」という切り替えボタンも無くなってます。ダイナミックサービングではデバイスを変更しなければ切り替わらないので意味が無いからです(使用ブラウザの機能によっては切り替え可能ですが、それはあくまでもブラウザの機能)

FC2ブログはどうかと言うと

PC --- ID.blog.fc2.com/
SP --- ID.blog.fc2.com/?sp

こうして後ろに パラメータ が付いてます。正規アドレス (パラメータを含まないもの)についてはダイナミックサービングが行われます。スマホから見るとスマホ版が優先表示されますよね。ところがこのパラメータはテンプレートの種別を意味していますので、パラメータ付きのリンクを踏んだ場合にはダイナミックサービングは行われず、パラメータと合致したテンプレートでの表示が行われます。つまりPCでもパラメータ付きをクリックしたらスマホ版が出ちゃいます。なんだか中途半端な仕様(笑)

Amebaが一歩リードって感じになっちゃったなぁ (´・ω・`)
AmebaはAMP対応もしてるんですよね。ちょっとFC2さん… 頑張ってくださいよ… ( ̄∀ ̄;)
ちなみに私がスマホ版テンプレ製作を辞めたのはこのあたりのFC2仕様が理由です。でもこの仕様は仕方がないんですよ。FC2のウリはカスタマイズ性の高さなので、PCからスマホ版の確認ができないとみなさん困りますよね (´・ω・`)

同一URLの利点とダイナミックサービング

URLが同一だと SNSシェアリンクが統一 されますね。そしてダイナミックサービングだと、同じURLをクリックしても、スマホから押せばスマホ版表示に。PCから押せばPC版表示に。と、自動で振り分けが行われますので、PCなのにスマホ版が… といったことが起こりません。逆もまた然り。
(だけれどもパラメータが付いてたら元も子もない)
見た目がどうなるかの問題だけでなく、パラメータがついてるページ・ついてないページで評価も分散します 例えば正規アドレスへのFBのLike!が10、ところが同じページの?spパラメータつきへのLike!が50あった。とか。そりゃまとめた方が良いですよね。もったいないから。この点で重要なのは canonical です。

FC2ブログではレスポンシブデザインでモバイル版を非表示にしてれば、辿り着く先の表示形式は同じです。PC版がレスポンシブでも、スマホ版を表示しているのなら問題アリの上記内容と同じです。

ダイナミックサービングでも「スマホコンテンツをPCコンテンツより少なくしている」場合は対策しろ、って書いてありますが、それはメインコンテンツのことを指しますので、FC2の場合コンテンツ内容(記事内容)はスマホ版テンプレによほど特殊なカスタマイズをしていない限りは同一のはずなので、ここはセーフ。
(ただしもちろんスマホ版利用者に対策が必要なことに変わりはありません)

canonicalとalternateの逆転はどうする?

canonical, alternate なんて知らん (´・ω・`)
というスマホ版利用者の方は、まずそこからやってください ^^;
ググれば色々出てきます。MFIとかなんとかよりも先にそれは最低でもやっておく。

既に設定済の方も、canonicalとalternateを入れ替える… のか?
という疑問が出てきますが、そのあたりは「俺らが上手くやるからとりま今は無視でいーよ。」というのがGoogleの回答のようです。「無視で良い」ってのは「やらなくて良い」じゃないですよ。既にちゃんと済ませているならば、そこは何も変更しなくて良い、という意味です。念のため。

スマホ版非表示レスポンシブの方はこの項目は無視でOKです。完全レスポンシブ、というその時点で既に「対策済」ということです。

何故スマホ版利用に対策が必要なのか

実際にテストしてみるのが良いと思います。

硫黄島での激戦のさなか fc2

で検索してみましょう。インデックスされたブログがたくさん出てきますが、URLの末尾に ?sp がついているもの、ついていないもの、それぞれ開いて表示の確認をしてみましょう。パソコンからでもスマホからでも構いません。困った問題だってのがわかると思います。そして今後は優先インデックスはスマホ版である、ってところに留意しながら確認。

完全レスポンシブが有利な理由

有利、というのはMFI対策に追われなくて済む、という意味ですから、「インデックス・ランキングが有利」ってのとはちょっと違います。が、サイト表示方法というのは大事ですので(モバイルフレンドリー)ランキング要素になってくるとは思いますけれど。(一番の評価対象はコンテンツ内容です)

完全レスポンシブの場合にはパラメータ付きでアクセスされても表示されるコンテンツも表示方法も常に一致しています。「モバイル版で表示」の切り替えボタンを私のリリース済みテンプレートでは導入してありますが、「スマホ版非表示の方は削除」とコメントを付けています。これは ?sp つきのインデックスを避けるためです。モバイル表示URLへの経路を経つ、という意味です。結局ここが一番の対策になると思うんです。FC2の場合。パラメータ付きのURLを極力インデックスさせない、ってところが。ですからやっておいた方が良いですよ。今後リリースするテンプレートではこれまでと逆にしようかと。「スマホ版表示の方はコメントを外してください(ボタンを有効化してください)」に変えようと思ってます。

折りたたみを採用している場合

追記を展開型にしている、サイドメニューを展開型にしている、サイドメニューをドロワーにしている、など。レスポンシブでこういった手法を取ることは往々にしてあります。これらについては「UXの為と判断されるものについては、隠されたコンテンツもちゃんと評価対象になる。」という回答のようですので、過剰に心配する必要はなさそうです。

* UX = ユーザーエクスペリエンス, ユーザーの使い勝手

「隠された内容」とは隠しテキストの類じゃないですよ。こちらも念のため。隠しテキスト(indent飛ばし, 背景色同一化, 判別不能極小文字)などはスパム対象です。「スマホ閲覧時には display: none; でナビを非表示に切り替える。」とかがUXの方です。

念のためですが、PCでのコンテンツ折りたたみは現在でもGoogleから評価を下げる対象になってますよ。トップページの折りたたみ展開とかも。ただインデックスは基本、パーマリンク(個別記事)単位ですので、過敏になる必要はない(と思う)

まとめ

● 完全レスポンシブの方 --- 特に何をする必要もありません。強いて言えば「モバイル版で表示」アイコンを削除。

● レスポンシブ + スマホ版 の方
・最低でも canonical, alternate を設置。
・ランキングバナーやアフィリエイトバナーなど「PCでは掲載してるけどスマホ版ではやってない」という方はスマホ版と同等になるよう対策。
やっておかないと今後ますますPC版へのアクセスは減少しますので、クリックしてもらえる機会を失います。
・重要な内容でPCテンプレソースに追加したものはスマホテンプレソースにも掲載。
上記項目と同じ理由。
・スマホ版にはあってPC版には無いページを noindex にしておく。
コメント一覧とかです。
PCの方の「タグページ」もスマホ版には無いのでこっちもやらないとですね。

とにかくPCとスマホの同等化を図りましょう、ってことです。なにもかもめんどくさい!!!
という方は完全レスポンシブにすれば良いんでない (´・ω・`)
そもそも私は レスポンシブ + スマホ版 の意味がわからないよ(笑)
MFIが実際に稼働すると ?spパラメータのついた記事が優先インデックスされることになると思うんです。なので?spにアクセスさせない (リンクを設けない(誘導ボタンを設けない)・search console でパラメータにnoindexをつけるなど)ようにした方が良いんじゃないかと思うわけです。

んで、これ大事ですが、私のテンプレートはcanonicalは書いてますがスマホ版へ向けたalternateは書いていません 完全レスポンシブでお使い頂くのが大前提ですのでやってませーん (´・ω・`)
だからスマホ版を併用する方はご自分でなさってね。すみません ^^;
ただFC2ブログでalternateはそんなに意識しなくても良いのかなぁ、と個人的に思います。canonicalは重要というか必須と言っても過言でないと思うけど。

んでさー、スマホ版ってのは今後廃れていくような気がするよ。どうせスマホ版を抱えるならAMP版作った方が良いし。そして全文表示タイプも今後ちょっと厳しいか…。でもデザインまでもGoogleに統制されてしまうのは嫌だなぁ。とかそんなことを感じておりますー (´・ω・`)

* 注) 常時ssl化はまた別の問題です。FC2はこちらも不安だ(笑)

コメントに関する注意事項
  • テンプレートに関するご質問は各テンプレート専用記事でのみ受付致します。また、よくある質問をまとめているページも事前にご参照ください。
  • 専門的なご質問の場合、記事内容と明らかに関連の無い内容はお控えください(雑談の場合はその限りではありません)
  • 第三者が不快と感じる内容や論調でのコメントはお控えください(性的,高圧的,暴力的など)