Someday Somewhere

A little something to say in my everyday life

はてなブログのスマホ画面が重い

f:id:tsukisai:20190317123954j:plain

普段の生活でスマホを使うことが当たり前になっている今、スマホから自分のサイトを訪問する人が増えていると感じている人もたくさんいると思います。 アフィリエイトに関するサイトを見ても、スマホからの訪問者のことも考える重要性に触れている記事をよく見かけます。

ということで、自分のサイトをスマホで見てみると、・・・、これがとっても重い。 PCから開いた場合は全く問題が無いのに、スマホで開くと異常に遅い、重い。

スマホに限った方法ではないのですが、とりあえず、ブログが重いと感じた時にやるべきことを一応やってみました。

現状のスピードを把握する

Webサイトの表示速度を確認するツールを紹介しているサイトが幾つもあるので、よく使われているツールで確認するといいと思います。

表示速度を計測するツール紹介サイト(↓)

試しにPageSpeed Insightsで確認してみました。 状態はGood。 スマホもPCも特に遅いわけではない結果が出ました。 でも、やっぱりスマホ画面は重い。

画像サイズを調節する

次に、表示速度をあげる方法の一つとしてよく言われているのが画像サイズ。 投稿する際にソフト等を使ってその都度圧縮する方法もありますが、てっとり早いのははてなフォトライフから設定する方法。

はてなフォトライフの設定ページを開くと「画像サイズ」と「画質」という項目があるので、そこの数字を変更します。 変更前は「画質」が100%になっていたので、とりあえず80%に変えました。 「画像サイズ」も自分のブログに適したサイズに変えればいいと思います。

画像サイズと画質の数値を変更後、表示速度を再度測ってみましたが、特に変化は無し。 ただ、若干開くまでの時間が短くなったような・・・。 それでも、スマホはまだまだのろのろしています。

Google AdSenseの「同期と非同期」

Google AdSenseで広告コードを作成する時、「同期」と「非同期」のどちらかを選択することができます。 この「同期」と「非同期」。 一体どういう違いがあるのでしょうか。 その違いを説明しているサイトさんがありました。

結局、広告が「同期・非同期」のどちらかによってもサイトの表示速度に違いがあるということになります。

さっそく、Google AdSenseにログインし、広告が「同期・非同期」のどちらになっているか確認しました。

Google AdSenseの広告を貼る位置

自分のサイトを開く時、よ~く見ていると、Google AdSenseの広告が表示されるまでに時間がかかっている感じです。 この時、広告の一つをブログタイトルの下に貼っていました。 これが、どうももたついています。

ということで、ブログタイトル下の広告は取り外しました。

すると、まあ速い速い。 スマホ画面は特に速度の改善がはっきりとわかりました。 なんだかんだ言って、当ブログの表示速度は、結局、広告の位置が原因だったようです。 やれやれ。

終わりに

Webサイトの表示速度を計測する場合、PageSpeed Insightsというサイトは日本語で書かれていますし、手軽に使えるサイトです。 もっと詳しく計測し改善したいと思う場合は、上記リンクを貼らして頂いたサイトで詳しく説明されていたりするので、そちらを参考にしてください。