＜こちらの記事は、2022年11月16日配信のメルマガを一部転載したものです＞
.
こんばんは！
あおです。
前回のメルマガでは、
ブログで使う画像について
【表示速度を早くするために
画像を軽くするのは大事だよー！】
という内容だったんですけど、
( *´艸｀)＜ 早く続きを話したくて・・・！
今日は、
【あおがブログ画像で意識していること】
とか
【あお的なファイルサイズの目安】
とか
【あおが使ってる圧縮ツール】
とか
私がやっていること中心に
画像のお話しをしたいと思ってます。
.
■画質はキレイなほうがいい
「Googleに良い評価をしてほしい！」
それならやっぱり、
画像はできるだけ軽いほうがいいんです。
でも、【画質】も大事。
Googleも「画質の良い画像を使ってね！」
って言ってますし
何より、ユーザーに役立つ記事を作るなら
キレイな画像を使ったほうがいいに決まっています。
なので私は、
画像を軽くしていく工程で
画質が劣化したり粗くなってしまうのは
避けるようにしています。
(｀・ω・´)＜ 粗くなるくらいなら、重いまま使います！
.
■画像形式の話
画像にはファイル形式というのがあって
JPGとかPNGとかのことなんですけど
これを、正しく使うようにしています。
容量だけでいえば
JPGのほうが軽くて
PNGのほうが重くなる
そんなイメージですね。
だからといって、
容量を軽くするためだけに
PNG画像をJPGにするのは
あまりよくありません。
なぜなら、画質が粗くなっちゃうから。
JPGっていうのは
写真などに適した形式で
文字などくっきりとした画像に使うと
ぼやけて粗くなってしまいます。
その逆で、PNGは
ハッキリとした線や文字などに
適した形式になっています。透過もできる。
その分、データはちょっと重たくなります。
だから、
文字入れをしたアイキャッチ画像なんかは
JPG形式で保存しちゃうと
ファイルサイズは軽くなっても
画質が悪くなっちゃうんです。
なので、
「画像を軽くするためにJPGで保存する」
とかはやらないようにしています。
.
■画像サイズを適切に
デジカメで撮影した写真なんかだと
幅が3000px以上あったりして。
めちゃくちゃ大きいんですよ。
パソコンの画面からはみ出ちゃう大きさ。
で、ブログに表示させるのに
そこまでの大きさって必要ないよね？
ってことで、画像サイズは
適切にリサイズしています。
サイズを変えるだけでも
画像の容量はだいぶ抑えられます。
この画像サイズの「適切」って
お使いのテーマによっても違うので
一概には言えないところがあるんですけど
ブログだったら
大体、幅800px～1200pxくらいが
ちょうど良いのかなって思ってます。
ちなみに私のブログ「ブログドロップ」では
SANGOというテーマを使っていますが
公式推奨のアイキャッチサイズは
680×390pxなんですよね。
けど、これではちょっと小さい気がするので
1200pxくらいにしています。
記事の途中に入れる挿絵画像は
アイキャッチほど重要ではなかったりするので
もう少し小さくしています。
ちなみに、ワードプレスの投稿画面で
画像をフルサイズ、大、中、小
から選ぶことができると思うんですが
あれは、
ワードプレス側でサイズ調整をするので
画像の容量が増えることがあります。
画像サイズを変更するなら、
基本的にはワードプレスにアップする前に
やったほうがいいですね。
.
■容量の目安
で？
それで？
結局、画像はどれくらい
軽ければいいの？って目安ですが
結論、
１つの画像が100KB以下になるように
がんばってます。
理想を言えば50KB以下かな、と。
ただね。
そうは言っても
100KBにおさまらないことも多くって。
だから、こんな感じで↓
・アイキャッチだったら200KB以内まで許容
・レビュー記事のように何十枚も画像を使うときは、１つあたり50KB以下を目指す
といった感覚でやっています。
アイキャッチ画像とかこだわって作ると、
どうしても重くなっちゃうんですよ…
でも、記事の顔だから
画質を優先させたいって気持ちが強くって。
200KBくらいなら
まぁ表示速度をそこまで遅くさせないかな、とか
バランスを見ながらやっています。
.
■画像圧縮プラグイン「EWWW Image Optimizer」
画質を劣化させずに
画像を軽くする方法に「圧縮」があります。
ぎゅーっとね。
無駄を省いて圧縮して、
容量を小さくできるんです。
あんまりやりすぎると
画質にも影響がでるんですけど
肉眼では気にならない程度に
圧縮することは十分可能です。
ワードプレスでの画像圧縮と言えば、
プラグイン「EWWW Image Optimizer」が
超定番です。
（以下、EWWW）
このプラグインを入れておけば、
ワードプレスにアップする画像が
自動で圧縮されるのでかなりラクちんですし
私もほぼすべてのブログで使っています。
ただ、画像圧縮を
このプラグインだけに頼るのは
ちょっと不安かなって部分もあって。
圧縮率がね
すごくいいわけではないんですよね。
もちろん、ちゃんと機能してくれるので
入れておいたほうがいいプラグインだし
全ブロガーさんが推奨すると思うけど
個人的には
「ないよりはあったほうがいい」
くらいのイメージで捉えてて
（あくまで個人的な見解です）
EWWWさえあれば
画像はそのままアップして大丈夫！
ってことではないと思っています。
なので、
画像サイズを適切にして
そもそものファイルサイズを軽くしておくことは
できるかぎりやっておいたほうがいいですよ。
ちなみに、EWWWを使っている方は
「どれくらい圧縮してくれているのか」
を確認したことはありますか？
「おすすめって見かけたから
プラグインは入れているけど
正直、よく分かってない…」
って人はいると思うんですよね。
ぜひ一度、確認してみてください。
ワードプレスのダッシュボードで
「メディア」＞「ライブラリ」を開くと
画像がアイコンサイズで並んでいると思うので
これをリスト表示にします。
（上部に表示切替のボタンがあります）
すると、「画像最適化」という欄に
どれほどのサイズが圧縮されたのかが
表示されます。
ぜひ(´▽｀)
.
■お気に入りの画像圧縮ツール
どうしても重たい画像や
1記事に何十枚も画像を使うようなとき。
私は、
画像圧縮ツールを使うことがあります。
画像圧縮ツールは
無料でいろいろあって。
ブロガーさんに有名なのは
「TinyPING」っていうパンダのイラストのやつですね。
ただ、私的に…
すっごく個人的なアレで申し訳ないんですけど
パンダの目が怖いのと（ぇ）
英語表記なのがあまり好きではなくて。
最近は
「あっしゅくま」という
日本人のプログラマーさんが作ったツールを使っています。
こちらも、パンダと似たような画像圧縮サイトです。
( *´艸｀)＜ ぽこぽこ動くくまさんが可愛いの♪
そうは言ってもさ。
記事を書くのに
いちいち画像を圧縮するのは
どうしても面倒だと思うし
私も毎回やれているわけではないので
（それで上位表示もできてるので）
・サイズを小さくしても重たい画像
や
・1記事の画像の枚数が多いとき
に圧縮ツールを使ってます。
.
■さいごに
画像ひとつとっても
まぁー－－－話せることってたくさんありますね！
自分でも驚きです。
画像の軽さや表示速度って
理想を追い求めると本当にキリがないので
「このくらいかな」
という目安と作業効率との
バランスが大切かなって思います。
だって、
毎回リサイズしたり圧縮するのって
めんどうですもんね(ノД`)
なので、
なぜ画像を軽くする必要があるのか？
Googleは何を大切にしているのか？
この本質を理解しておくと
バランスをとりやすい気がしています。
ネットで調べると
「画像は軽いほうがいい！」
「圧縮は必須！」
「表示速度を改善しよう！」
と
正論ばかりなんですが
なんでもかんでも「理想」を目指すのは
やっぱり難しいと思うので。
あなたなりの正解を
見つけてみてくださいね。
あお
.
☆°｡ 追伸 °｡☆
ご紹介した画像圧縮ツール
「あっしゅくま」。
本当に可愛いので、
ぜひ一度使ってみてほしい！
（もちろん機能も優秀です）
ということで、
使い方を記事にしてみました。
なるべく初心者さん向けに
画像多めで書きましたので
流し読みでも見てもらえたら嬉しいな～
( *´艸｀)
