こんばんは!
岩永です。
アフィログへようこそ!
僕がアドセンスブログを始めた時、
結構悩んだことがありました。
それは画像の圧縮です。
ブログには画像を貼ることが多いです。
中見出しの真下には
画像を貼るのが定番ですからね。
文字だらけの記事より
画像があることで読みやすくなります。
その画像をWordpressに取り込む時に、
元画像のサイズをそのまま取り込んでしまうと、
容量を圧迫してサイトの表示速度が遅くなります。
サイトの表示速度が落ちると、
離脱率が上がってしまうと
言われています。
画像圧縮とは、
その名の通り画像を圧縮して
サイズを小さくすることです。
これがWordpressに取り込む前に
やる方法と、
Wordpressのプラグインでやる方法の
2つがあるんです。
そこで今日は
僕が実際にやっている画像圧縮の方法
についてお話しします。
どうして僕が
画像圧縮で悩んだかと言うと、
ページスピードインデックスで調べた時、
遅かったからです。
ページスピードインデックス
https://pagespeed.web.dev/?utm_source=psi&utm_medium=redirect&hl=JA
これはサイトスピードを
MAX100で計測します。
0~49:危険
50~89:普通
90~100:速い
で、僕のサイト24でした。
携帯電話とパソコンがあって、
パソコンは90点台が多いです。
そして携帯電話の方が異常に悪い。
これはほとんどの方が同じだと思います。
パソコンの場合、有線ケーブルか
Wi-Fi接続されているんで
通信速度が速いんです。
しかし携帯電話(スマホ)の場合、
Wi-Fiが無い環境であることが多いです。
スマホ回線だと、
どうしても通信速度って遅いんですよね。
その状態で
重たい画像を貼っていると
サイトの表示速度が下がります。
この数値に大きな影響を与えるのが
画像の容量なんです。
僕は最初このプラグインを使っていました。
EWWW Image Optimizer
このプラグインは
入れておくだけで
勝手に画像を圧縮してくれます。
だけどこのプラグインを入れた状態でも
ページスピードインデックスの数値が
悪かったんですよ。
それでしばらく
tynypingというフリーソフトを使いました。
tinyping
しかし無料だと枚数制限があり、
僕のサイトは画像が多かったので
すぐに無料分の枚数に達してしまいました。
なのですぐにやめました。
画像が少ない方には
良いサービスだと思います。
このサービスのポイントは
画像圧縮してるのに
品質を高く保てること。
例えば57KB(キロバイト)の画像を15KBまで
圧縮してもほぼ分からないくらい
キレイです。
KBというのは容量の単位です。
MB<KB<GB<TB
左から
となります。
よくBlu-rayrecorderとかで
聞く単位ですよね。
500GBとか1TBの容量みたいな
表現で使われます。
数値が小さいほど
容量が少なくなります。
これは画像圧縮の話ですが、
画像はリサイズというものがあります。
画像のリサイズっていうのは、
画像をブログ用に小さいサイズに
変更することです。
例えば横1500px(ピクセル)、縦800pxの画像を
リサイズせずに取り込むと60KBくらいの
容量になってしまいます。
リサイズすると10~20KBくらいまで
減らすことが出来ます。
これもWordpress前と後で
やる方法が存在します。
色々試しましたが、
Wordpressに取り込む前に
リサイズするのって面倒なんですよ。
そこで僕はこのプラグインを使っています。
Resize Image After Upload
有効化したら
Maxwidth:800,Max Heigiht:0
に設定して保存します。
これは横幅800まで
縦幅は無制限という意味です。
このプラグインの良いところは、
メディアに画像を取り込むと
自動的にリサイズしてくれるところ。
先程設定した横幅800pxまで
自動でリサイズしてそれに合わせて縦幅も
自動でリサイズしてくれるんです。
先程のプラグインを2つ入れておくと、
自動で圧縮とリサイズが行われます。
今、僕が考えうる限り
最適な画像圧縮方法だと
思っています。
実際に毎回使ってますが、
本当に画像にかける時間が
減りました。
スマホの写メをそのままメディアに
取り込んだら終わりです。
もちろん
フリー画像も同じく
リサイズ・圧縮してくれます。
設定も簡単なので、
もし画像の圧縮やリサイズで悩んでいるなら
試してみて下さい。
何か分からないことがあれば、
いつでもメールでご相談下さい。
感想メールも大歓迎!
本日は以上になります。
前の記事
⇒アドセンス審査に受からない時の対処法!ブログ初心者さんのお悩み事
次の記事
⇒ChatGPTを使いこなすコツ3つ!AIに指示を出す時に必要なこと
今日も最後までお読み頂きありがとうございました。
メルマガでは、このあと編集後記なども書いている完全版をご覧頂けます。
興味のある方は、ぜひメルマガ登録をお願いします!
以下にメールアドレスを入力しお申し込みください
コメントフォーム