ましゅまろ・でい

エンジニアが異動で空マイラーになっちゃった!?サラリーマンのブログ

【ブログ運営】ブログ速度改善を試みた結果①

どーも、セカンドです。

タイトルの通り、ブログの速度改善を目指して挑戦した内容をまとめました。

(現状は、満足出来る結果は得られておらず見事に撃沈しています。)

もし、ブログ初心者の方で、私と同じ問題に悪戦苦闘している方がいましたら、これをしても効果が少ない(意味が無い)というメッセージになると思い、記事に残すことにしました。

改善方法が明らかになった時点で、随時更新しようと思います。

※2週間ほど戦いましたが、現時点では負けを認めます。

 これからリベンジしてやっからなぁー!

 

❚ 目次

 

ブログデザインによって、読込み速度って違うんだってよ。

ブログ初心者の私は全く知りませんでしたが、2020年5月5日にGoogleアップデートが行われたようです。

アップデートされても影響が無いくらいの弱小ブログなんですが、先輩ブロガーの方々の記事を読んでいると、どうやら影響がハンパないらしいです。

その中でもブログの読込み速度が今後のGoogle検索順位に大きく影響するってことなので、初心者でも出来る対策はしようと、「とにかくやってみる!」の精神で動くことにしました。

これから、ドツボにはまるとも知らずに・・・。

 

そんな中、見つけた記事が⇩です。

www.fulogabc.net

 

記事の概要は、

①デザインによって読込み速度は変わる。

②人気デザインであっても遅いものがある。

 ➡特に、「DUDE」は読込み速度が速い方ではない。

 

・・・・・・えっ?

・・・・・・オレが選んでるデザインって「DUDE」じゃん・・・。

・・・・・・デザインで選んだけど、読込み速度遅いって・・・。

 

以下、心の声。

今まで一生懸命、初心者なりにCCSとか無駄に調整してたのって何・・・?

無駄な努力ってこのことか・・・?

⇧努力とは成果が出て、それまでの過程を初めて努力と呼んで良いので、成果が出なければ残念ながらタダの無駄な作業。

 

結構デザイン気に入ってたので、記事を読んだ瞬間に相当に凹みました。

また今後、どうすべきかも併せて。

私のDUDE最終バージョンは下記。

f:id:md-113:20200530235825j:plain

 

好き(お気に入り)だったのは、

①DUDEが元々もっているシンプルデザイン

②ブログ上部の写真(アメリカ出張時に自分で撮影したもの)

③推奨記事3個

 

自分でも薄々気付いてたんです。

はてなブログ開く時に、なんか開くの遅いなーって。

ただ、これがデザインによるものなら、今後のブログ運営においてプラスにはならない・・・。

苦渋の選択して、読込み速度が遅い場合は、DUDEと決別することを決めたのでした。

 

ブログ読込み速度確認してみたってよ。

そんなわけで、読込み速度を確認することにしました。

どの記事でも「速度測定はこれ!」の PageSpeed Insights を使って。
結果は、PC:18という散々な結果でした。

 

さて、どーしよーもないので、ブログデザインをどうするかがポイントになりますが、まずはDUDEで出来る事から始めることにしました。

 

改善①

まず、誰でも出来る改善としては、

掲載写真の圧縮をする!

ことです。

こうなるまで全く知らなかったんですが、ブログの写真って軽くすべきなんですね。

エンジニアとして資料を作る側からすると、あんまり容量小さくし過ぎると画像が悪くて相手に見えにくくなるので、このブログの写真は、大体100KBを目途にしていました。

常識を知らないって本当に怖い・・・。

⇧別に速度遅くて良ければ、何も問題無いんですけどね。

 

1枚1枚、全ての掲載写真を圧縮(30KB程度)し直しました。

そして、貼付け直したその結果は! 

f:id:md-113:20200531000516j:plain

ん!?

見間違いか???と思えるほどの素晴らしいほどの無改善。。。

PCで21って。。。

ここで、残念ながらDUDEとお別れを決断したのでした。

 

改善②

では、どのブログデザインにすべきなのか。

今回もデザイン重視で、なおかつ、ブログカスタマイズが非常に簡単なメリットがある、「Innocent」を選択しました。

 

これで、速度改善だぜー!と思って速度測定。

結果はまさかの・・・

f:id:md-113:20200531000928j:plain


おいおい、PC:31って。

50ぐらいは超えねーのかよ・・・。 

もう、訳分かんねーよ・・・。

 

はぁ・・・。で、原因は??

f:id:md-113:20200531001538p:plain

使用していないJavaSprict

らしい。 

  

”使用していないJavaSprict”って何?

ここは結論から書きます。

どう削除するかの前に、そもそもJavaSprict自体がなんなのか、調査に調査を進めましたが。。。

すみません、本当に何なのか、私の力では理解することが出来ませんでした。

例えるのならば、素人が設計図面を読むみたいな感じでしょうか。

同じエンジニアでも、メカ設計の方が電気回路を良く理解出来ない、またはその逆の様に、専門用語に対する予備知識が無さ過ぎて、有益な情報を検索出来ませんでした。

 

以下、私感。

私だけなのかもしれませんが、なんか最近のGoogle使いにくくないですか?

検索しても、欲しい情報がある記事に行きつきません。

(私の検索力が乏しいだけかもしれませんが。。。)

もう少し検索力がない人でも、見たいページを探せるように、アルゴリズムを向上させるように、Google先生よろしくお願いします。

 

まとめ

速度改善を行った結果、大した改善にならないという、意味が分からない状態になりましたが、スマホの表示はグローバルメニューが使えるようになったので、良しとしています。パソコンよりスマホでブログを見る方が多いはずなので、スマホ版にグローバルメニューがある方が、初訪問の方にどんなブログなのかを理解してもらい易いですからね。

 

▪ これまでスマホ表示画面

f:id:md-113:20200531004245j:plain

 

▪ 改善後

f:id:md-113:20200531004745j:plain

 

グローバルメニューはこんな感じ(⇩)です。

f:id:md-113:20200531004307j:plain

 

ブログ読込み速度が、H2(あだち充先生作)の野田くんぐらい鈍足(スマホの速度結果:18)ですが、初心者から中級者、上級者と成長する中で、改善を重ねて行こうと思います!!!

 

P.S.

改善方法をご存知の方がいましたら、コメント or Twitterでご連絡いただけれると、大変助かります。効果の確認が取れ次第、随時、更新記事でブログ公開したいと思いますので、みなさまよろしくお願いします!!

 

次回に続きたーいっ!