Webセキュリティの小部屋

Twitter のフォローはこちらから Facebook ページはこちら RSSフィードのご登録はこちらから
公開日:2020年8月7日
最終更新日:2020年8月8日

SEO対策としてスマホサイト対応しました

はじめに

最近、このサイトのページビューが少なくなったなぁと思い、Google Analytics で1年分のアクセスを分析したところ衝撃的な事実が分かりました。

なんと1年前とくらべて、1日あたりのページビューが5分の1程度にまで落ち込んでいるではないですか。2020年2月22日を境に、激減しています。

アクセス解析

おそらく、Google のアルゴリズムの変更でこのサイトの評価が大幅に下がったのだと思います。

このままではマズイと思い、SEO対策を行うことにしました。

サイト表示速度の調査

Google のPageSpeed Insightで、このサイトの以下のページの表示速度を調べてみました。

すると衝撃の結果が。。。

モバイルサイトの速度のスコアがたった20しかありません。。。

モバイル速度

パソコンサイトのスコアは74とまずまずでした。

パソコン表示速度

このサイトはパソコンからのアクセスがメインで、スマホからのアクセスがほとんどないのですが、そういうことか、と納得しました。。。

これはマズイので対策を取ることにしました。

画像遅延読み込みの設定を行う

とりあえず画像読み込みがパフォーマンスに影響が大きいようなので、「Native Lazyload」というプラグインを導入しました。

このプラグインは、画像遅延読み込みを行ってくれるすぐれものです。ユーザーが画像を表示するまで画像をロードしません。それにより、ページの表示速度を向上させます。

また、画像が重いと当然のこと表示が遅くなるので、今までの画像は仕方ないけれども、これからは加増は圧縮してからアップロードするようにします。

スマホサイトを用意する

はてなブログでページ速度を改善させるときに気がついたのですが、レスポンシブデザインは見た目はよいのですが、モバイルサイトとしては重たくて微妙なところがあります。

このサイトもレスポンシブデザインを苦労して取り入れていたのですが、どうもそれがよくなかったようです。

そこで、スマホサイトを用意するため、「WPtouch」というプラグインを導入しました。

「WPtouch」は WordPress にプラグインを導入するだけで、スマホ対応ができるすぐれものです。

しかも、今回は投資として「WPtouch Pro」($79/year)の有償版を購入しました。オプション($10/year)もつけて。なので、これから年に$89の追加費用がかかるようになりました。💦

それで、サイトの表示なのですが、レスポンシブデザインのときはこんな感じでした。

レスポンシブデザイン

これが「WPtouch」導入後は、こんな感じになりました。

スマホデザイン

ずいぶんとイメージが変わりましたね。

これで表示速度が向上すればよいのですが。

スマホ表示速度対策の結果

上記表示速度対策を取って、あらためて PageSpeed Insight でテストしてみたところ、スコアが33に向上しました。13ポイントの向上ですね。ほぼ1.5倍早くなった計算です。

スマホ表示速度

おわりに

まだまだ表示速度に納得がいっている訳ではありませんが、少しはスマホにやさしいサイトになったのではないかと思います。

これで、Google の評価が上がるとよいのですが。。。

 

 


スポンサーリンク





カテゴリー:ブログ

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA