はてなブログ初心者がトップページ表示が重い問題に挑む
はてなブログ（無料版）を初めて10日ほど。
書くおもろしさと他の方のブログを読む楽しさを堪能し、
管理画面などの見方も少しずつ理解してきた最中に問題発生。
最近パソコン（ノートPC使用）で自分のブログを開くとき、
すごく重い！！かなりのストレスです！
特にトップページを開くときに重くなってグルグル回り出し、
一方で個別の記事を開く際は、とてもスムーズ。
という問題を今日解決できましたので記事にしてみました。
まずは原因追求から・・・
原因は写真の容量ではなかった
写真の画像データが少しずつ増えてきたからかな？
と思い容量を確認してみると・・・
まだ5%しか使用していません。
5%で重くなってしまうことはありえないし…
無料版というのが何か関係あるのかな？
と思い同じ現象の方がいないか検索してみたのですが、
どうやら原因は画像データの重さではない様子。
犯人はトップページの読み込むデータの多さ
初心者なので重いといえば画像くらいしか思いつかず、
「はてなブログ 重い」で検索。
結局ググるとすぐに同じ現象の方がいました！
原因はどうやら、各記事についているソーシャルボタンなど様々なデータを読み込むのに時間がかかっているようでした。
トップページでは何記事か表示されるようになっているので、
「いろんなデータ読み込み（更新）」 ✖️ 複数記事 ＝ 重い！
もちろん私なんかに分からない複雑な要因が他にもあると思いますが、
対処できそうな理由がこのくらいだったのでひとまず解決に向けて、
トップページ重い問題の解決方法を試してみます。
はてなブログ重い問題の解決方法
解決方法はトップページをコンパクトにすること！
重さを軽減するためには、トップページをアーカイブ方式に変更した方がいい！
とのことで早速試してみました。
アーカイブ方式とは一つ一つの記事の全文が表示されて並んでいる状態ではなく、
このような形になっていること（多分）
一つ一つの記事の全文が表示されて並んでいる状態は、
ソーシャルボタンなどの読み込みに時間がかかってしまうそうです。
そこで、トップページから自動でアーカイブページに移動できるようにJavaスクリプトを入れればよいとのこと。
なんだか難しそうですがブログ初心者（初心者マークをイメージ）の私でも、
簡単に1分ほどで完了したのでご安心ください！
トップページをアーカイブページに自動で移動させる4つの手順
手順を私のような初心者でも分かりやすく…
手順①
「管理画面のサイドバーの「設定」をクリック」
手順②
「設定の中の「詳細設定」をクリック」
手順③
「詳細設定の下の方にある「headに要素を追加」に下記コードを追加」
コード（スクリプト）はこちら。
赤文字箇所をご自身のサイトURLに変更してコピーしてください。
<script type="text/javascript">
if( location.href == 'http://mujilife.hateblo.jp/'){
location.href='http://mujilife.hateblo.jp/archive';
}
</script>
<noscript>
<p><a href="http://mujilife.hateblo.jp/archive">mujilife</a></p>
</noscript>
詳細設定の下の方にある「headに要素を追加」の場所はこちら。
手順④
「詳細設定の一番下の「変更する」ボタンをクリックして変更完了」
変更ボタンを押さないと設定が反映されません。
忘れず押すように注意！！
結果トップページと管理画面の読み込みが早くなった
上記の1〜2分で完了した設定のおかげか、
トップページの読み込みがすごく早くなりました！
快適にブログを続けられそうです。
でも見栄えはどっちの方がよかったのかなとも思いますが…
遅いよりはマシだと思ってしばらくはこの設定にしておきます！笑
関係ないかもしれませんが・・・
トップページだけでなく管理画面の読み込みも早くなった気が！
プチストレスだったので嬉しい！
もしお悩みの方がいたらぜひ試してみてください。
追記：スマホにも反映されてしまっていたので早速変更
上記を試してうまくいっていたのですが…
スマホでは最初から記事のタイトルのみ並んでいる方式が反映されていてアーカイブに移動する意味がないので、PCで見た時のみアーカイブページへ切り替わるよう下記に変更しました。
貼り付ける場所は同じで、下記をそのまま変更なしでコピーして更新すれば完了です。
<script src="//niyari.github.io/hatenablog-modules/deprecated/navigate-page-archive.min.js"></script>
