ガジェレポ！@gadgerepoです。こんにちわ。
今日はブロガー、特に“はてなブロガー”向けの投稿です。
「はてなブログは読み込みが遅い、特にモバイルページが。」
と言われて久しいですが、皆様のブログはどうですか？
今回は、はてなブログの表示高速化のために何が出来るか、対策を考えてみました。
ページの読み込み速度は検索結果にも影響あり！
さて、サイトの表示が遅いということに、どんなデメリットが生じるでしょう？
まず考えられるのは、訪れたサイトがなかなか表示されなかった場合、ユーザーがしびれを切らして離脱してしまう、あるいは最初のページは見終わっても回遊せず、すぐに他のサイトへ飛んでしまう……という可能性があります。
さらに度を超えて重いサイトは、サーバにも大きな負荷をかけてしまいます。
しかし、サイト運営者にとっての一番大きなデメリットは、ネットの巨人「Google」から“遅いウェブサイト”のレッテルを貼られることではないでしょうか。
早くから「ユーザビリティ重視」を謳ってきたGoogleでは現在、モバイルユーザーが早く、分かりやすく情報を得られるために、ウェブサイトのモバイルページをインデックスに使用し、モバイルでの表示を高速化するシステムであるAMPページを提供・推奨しています。
また、ページの読み込み速度はGoogleにおいての検索ランキング要素として、検索順位に直接的な影響を及ぼしています。
さらに言えば、Google search console に「速度（試験運用版）という項目が追加されたことでも、いかに巨人が読み込み速度を重要視しているか、運営者にサイトの高速化を促しているかが窺い知れます。
読み込み速度の速いサイトは（検索順位を）優遇するけど、遅いサイトはその限りではない……
そんなGoogleの思惑を感じつつ、最近ブログのアクセス数低迷に悩む筆者もまた、自サイトの表示速度の低さには頭を抱えておりました。
おなじみ、Google謹製のの無料SEOツールPageSpeed Insightsで当ブログのスピードを計測してみると……
うぇぇぃ……、この体たらく。
ちなみにPCの方は多少マシです。
この PageSpeed Insights、計測結果とともに速度改善のための方法を提示してくれるのがありがたいのですが、はてなブログの場合、ユーザーにはどうしようもない部分が多いんですよね。
例えば「第三者コードの影響」という箇所、介入する第三者のコードにブロックされてページの読み込み速度が著しく低下……とあるのですが、その筆頭で著しく邪魔してくれてるのは誰あろう「はてなブログ」です。
どないせぇちゅ〜ねん。
……まてよ。
はてなブログのデザインテーマ、そのCSSは外部ファイルから読み込むシステムだったよな。
そして、どのデバイスに対しても共通のURL・HTML・CSSファイルを使用する「レスポンシブデザイン」ならモバイルでもやはり外部からコードを読み込んでいるはず。
当然、PC用のHTMLコードやCSSも読み込んでいるから、表示に時間がかかるのでは？
これまで、テーマが「レスポンシブデザイン」対応なら盲目的に有効にしてきたけど、無効にしたら速度的にはどう変わるんだろう？
さっそく、はてなブログのダッシュボードから「デザイン」→「モバイル」→「詳細設定」へ移動、「レスポンシブデザイン」のチェックを外して無効化してみました。
そして、再度 PageSpeed Insights で計測してみたところ……
じゅ、10以上も改善された……
それでも得点は「32」と低空飛行だけど……
一応、PCも確認してみたけど、こちらは影響なし。
コード共通でGoogle検索エンジンのクローラーが巡回する手間が少なくなる、ユーザーの視認性が向上するといった点から、Googleは「レスポンシブデザイン」の使用を推奨しているものの、
「検索順位には特に影響は無い」
とも明言しています。
しかし、「ページの読み込み速度」は検索順位に影響している以上、「レスポンシブデザイン」対応のテーマであっても、読み込み速度が遅いのであれば、あえて無効にするのもひとつの手、ではないでしょうか。
追記（2019.12.03）
あトん@AfterWork_Labさんから、
レスポンシブデザインのメリットを考慮せず、安易に外すのは本末転倒では？
とのご指摘いただきました。
モバイル端末でPCサイトと同じ情報を読み込むレスポンシブデザインは、たしかに表示に時間がかかることがあるかもしれませんが、スマホの画面での見やすさや使い勝手、Google推奨（モバイルの検索順位に有利という記載もあり）、サイト運営者にとっての更新やメンテナンスのし易さ等々の優位点もあり、PageSpeed Insights での数値だけを追い求めるのは、確かに
“どこを向いて走っているのか？”
となってしまいます。
ですので、本記事は筆者環境でのひとつの「テスト結果」として、参考程度に受け止めていただければ幸いです。
まとめ
「レスポンシブデザイン」対応テーマをお使いのアナタ！
ぜひ一度、PageSpeed Insights でサイトの読み込み速度をチェックしてみてください！
