せっかく書いたブログ記事の読み込みが遅い！軽くする３つのポイントの紹介
日々の作業やお勉強、お疲れさまです！
アネオトです。
読者さんがあなたのブログ記事から
すぐに離脱してしまう原因として、
かなりデカイのが……ページの重さです。
もういいや！他の軽いページさがそ！
お客さんは『さっさと情報を知りたい』
『ムダな待ち時間が大嫌い』ですので、
重いページの表示は待ってくれません！
しかし普段、回線の安定した
自宅などでブログを書いていると、
自分のブログが軽いのか重いのかって
気づきにくいんですよね！
だけど実は外出先から見ると
（不安定なWi-Fiを利用していると）
意外と重くてなかなか繋がらなかった！
なんてこともあります。
そして読み込みに２～３秒ほどかかると
半数の人が離脱するというデータも出ています！
アネオトもスタバのWi-Fiを使っていて
ちょっと調べものがしたくなったとき、
「うお～～全然表示されね～～！」という
ページには５秒もガマンできませんでした……
そんな中、表示の速い軽いサイトはありがたかったです！
家で閲覧するぶんには問題なくても、
なるべくページを軽くさせる努力は
しておいたほうがいいでしょう！
あなたのブログがPCやスマホから見て
重いと感じるようでしたら、
以下のことが原因かもしれません。
もくじ
画像が重いのかも？
たいてい、画像がムダに重くて
読み込みに時間がかかっていることが多いです。
軽量化は意外とカンタンなので、
以下の３点を踏まえて
軽くした画像を掲載するようにしましょう！
- 画像自体のサイズを小さくする
- 画像の重さを軽くする
- 画像の拡張子を適切なものにする
詳しく見ていきましょう。
大きい画像を小さくリサイズする
スマホで撮影した写真をそのまま貼り付けると、
メチャクチャでかいはずです。
（※「iPhone 6s」の場合、横4032px・縦3024px）
画像素材サイトで配布されている画像も、
モノによっては2000pxくらいの
大きいサイズになっていたりしますよね。
ブログに掲載する画像は、
だいたい横幅700pxほどでじゅうぶんです！
元のまま載せると無駄に大きくて重いので、
縮小しちゃいましょう！
たいていの画像作成ソフトに、
サイズ変更機能は備わっているはずです。
「ふだん画像編集ソフトを使わないから不安」
でしたら、Web上で画像サイズ変更が
手軽にできる便利なサービスがおすすめです～！
便利サイト 画像リサイズツール
画像の容量を圧縮する（軽くする）
画像の大きさには問題なくても、
画像が高画質すぎて重いケースもあります。
見た目のクオリティはそこそこ保ったまま、
容量を軽減させたいところです！
画像作成ソフトで圧縮率を調整して
書きだす（＝保存する）やり方が一般的ですが、
見た目が劣化してしまう（汚くなってしまう）
ことが多いのが悩みどころです。
画像を見た目キレイなまま容量圧縮してくれる
Web上のサービスがあるので、ご紹介します！
.jpgまたは.png画像を軽く
- オンラインPNG・JPEG圧縮（重いファイルでも大丈夫です）
- JPGイメージをオンライン上で圧縮する（GIFも圧縮できます）
- TinyPNG
.gif画像を軽く オンラインでGIFとアニメーションGIFを圧縮
拡張子（jpg、png、gif）は最適か？
Web上で使える画像の拡張子はこの３種類です。
それぞれこのように使い分けましょう。
| .jpg（.jpeg） |
色数が多いもの |
|---|---|
| .gif |
色数が少ないもの
アニメーション |
| .png |
画像の一部が透過されているもの
劣化させたくない、キレイに見せたい画像 |
ブログに掲載する画像は、
たいてい「.jpg」になると思います。
「キレイになるなら全部pngにすれば間違いないじゃん！」
と思うところですが、
色数の多いものをpngにするとかなり重くなるので、
写真などはjpgにしておきましょう！
写真ほど色数は多くないけど、
gifにするには色数が多いかなという
画像（イラストの場合が多いです）は
pngでいいでしょう。
- はてなブログの場合、pngは使わないほうが吉！
-
はてなブログでは何故か、
「.png」画像をアップロードすると、
元より大きい容量サイズになり、
やたら重くなってしまいます。
youtubeなどの埋め込みが多いのかも？
YouTube動画やツイッターの投稿など、
埋め込み機能を使って１ページの中に
バンバン貼りまくると重くなってきます。
「無駄に貼り付けすぎかな～」と
思うものがあれば外したり、
埋め込みではなく普通のリンクに変えるなど、
工夫してあげましょう！
ちなみに、動画の埋め込みを
軽くさせるテクニックもありオススメです。
（はてなブログ用に書かれていますが、
ワードプレスでも似たようにできます）
参考 はてなブログにYouTube動画を埋め込むと重くなる！ので軽くする方法を紹介
【上級編】スクリプトが複雑なのかも？
ちょっとこれは上級者向けのお話なのですが……
不必要なHTMLやCSSのソースが混ざっていたり、
重いjavaScriptが入っているというケースです。
ブログのテンプレート自体が
複雑すぎて重いものだったり、
無駄な機能を読み込みまくっていたりするなら
見直した方が良いかもしれません。
また、ワードプレスをお使いの場合、
契約しているサーバーのスペックによって
ページスピードが変わってきます。
あまりよろしくないサーバーを使っている場合、
良いものに乗り換えるのも手かもしれません！
信頼できるサーバーのまとめはこちらです。
いろいろご紹介しましたが、
画像の点検が第一優先ですね。
読者さんにありがたがられる、
軽くて親切なブログを目指していきましょう！
今回のようなお客さんへの配慮のほか、
効果的にブログの成果をあげられる考え方を
こちらのメール講座で解説中！
ライフワークの始め方ガイドを準備中！
あなたにとっての趣味のような仕事
略して「趣味ビジネス」を実際に作ろう！
（オープンまで楽しみにお待ちくださいませ）
