クリアメモリ

プログラミングやモーショングラフィックス、便利なアプリケーションなど雑多に記録するブログ

SearchConsole モバイルユーザビリティ対策しないとSEOで負けちゃうかも

f:id:clrmemory:20170422160851p:plain 

先日、GoogleのSearchConsoleを見ていたところ、モバイルユーザビリティと言うものを発見しました。

そこでモバイルユーザビリティというものについて調べてみました。

 

モバイルユーザビリティとは簡単に申し上げると、ブログがスマホ対応しているかどうかを教えてくれるものだそうです。

 

 

モバイルユーザビリティの確認

 

SearchConsoleの場合はブログを指定した後、この部分を開くと確認することができます。

 

 

もしこの場所で「問題のあるページ」が0でなかった場合は、ブログがスマホに対応していないということなので対処する必要があります。

 

というのもスマホに対応していないとSEOのインデックスに乗りづらいらしいので、スマホからアクセスしている人がいなくても、スマホ対応させた方が良いです。

 

詳細な確認

 

SearchConsoleにエラーが発生していないという場合でも、スマホに対応していないということはあります。

 

ですので、こちらから確認しておいてください。

モバイルフレンドリーテスト

 

こちらに確認したいブログのURLを書き込んで分析を押します。

以下のように表示されていればスマホに対応しています。

 

※このように表示されたとしても、ブログのフォントサイズなどにエラーがある場合は修正が必要になります。

 

使用しているテーマがスマホに対応していない

 

一言にスマホ対応と言っても、どのようにするとスマホに対応できるのかわからないと思います。 スマホ対応とは、スマホ専用ページがあったり、画面の横幅がスマホ用に変更されていたり、テキストの文字がスマホ用に大きく書かれていたりといったカスタマイズをすることです。

 

 

実際にスマホ用にカスタマイズするには、レスポンシブデザインといって画面の横幅を端末の横幅に合わせて変更させるという方法があります。

ですが、コードをいじってカスタマイズするのは大変なので「PC,スマホ両対応」のテーマを使うことにしましょう。

 

 

PCページで使っていたテーマが両対応だった場合はこの作業はしなくて良いのですが、私が使っていたtwenty tenはスマホ対応ではありませんでした。

そこで、スマホでアクセスした時のみ、別のテーマを使うというように使い分けることにしました。

 

 

両対応を実現する

 

今回私が使ったスマホ用のテーマは、マテリアルという無料テーマです。

Nobuo_CREATE様のマテリアルというページからダウンロードすることができます。

 

 

見た目がとても綺麗で尚且つサイドバーなどがカスタマイズの必要なしでかなり見やすくなっており、とても気に入っています。

PCではtwenty ten、スマホではマテリアルという風にカスタマイズしましょう。

 

 

今回は、WordPressのプラグインを使います。

「Multi Device Switcher」というプラグインをインストールしましょう。

 

 

Multi Device Switcherの使い方

 

さっそく使い方を説明します。

このプラグインはとても簡単に使用することができます。

 

「マルチデバイス」というプラグインが追加されているので「設定」を選択して下さい。

 

このような画面になるので、それぞれスマホ用のテーマを設定しましょう。

マテリアルならこのようになります。

 

このように設定するだけでスマホでアクセスすると、マテリアルのテーマが表示されるようになります。

 

再度モバイルフレンドリーテストをしてみてください。

先ほどの画像のようにモバイルフレンドリーになっていると思います。

まとめ

 

記事内でもお話ししましたが、googleの検索欄に乗りやすくするにはモバイルフレンドリーにしないといけないので、スマホ対応させなければいならないのですが、対応していないテーマを使っていた場合は自分でカスタマイズしなければなりません。

 

すべてをカスタマイズするのは大変ですが、今回のようにすれば簡単に スマホ PC両対応のブログが完成します。

 

 

スマホ用のページを作成することによって、より見やすいブログが出来上がると思います。

 

ではまた。