1分でできるアイキャッチ画像(続)

2020/07/04

Blogger QooQ

t f B! P L
花

前回、


という記事を書きました。毎回毎回、アイキャッチ画像に苦しめられ続けた僕が、ついにたどり着いた結論でした。

その後何をしていたのか、何に悩んでいたのかを書きます。

PNG画像とJPEG画像を比べる

どこかで(どこでか忘れました)イラストはPNGで、写真はJPEGがいいと読んだので、前回の記事でPNGでダウンロードしなさい、と書いたのはまずかったかと気になり始めました。

そこで、Canvaで同じ画像をJPEGでダウンロードしようとしてみました。ところが、JPEGの場合は、無料では80%の品質しか選べないのです。Canva Proにしようかと思いましたが、月に1000円以上もするのですぐに諦めました。

とりあえず、JPEGでダウンロードしてみました。PNGと比べると明らかに写真も文字もぼやけています。ファイルサイズを見ると、PNGの方が406KB、JPEGは40KB。なんと10倍の開きがありました。

まあ、PNGでいいかと思っていたのですが、調べているうちに、ファイルサイズが大きいとページの読み込みに時間がかかり、SEO的にもよくない、訪問者もいなくなってしまうとどこかで(どこ?)知りました。画像ファイルは100KB以下にするのがいいようなのです。

試しにいくつかのサイトからアイキャッチ画像をダウンロードしてみると、みんな100KB以下でした。406KBもあるPNGはNGなのかも(うまい?)、と思って、誰かが(誰?)教えてくれていた、


を訪問してみることにしました。

アクセススピードを比べる

サイトへのアクセススピードをチェックしてくれるようなのです。Googleさんは、ここでも私たちを助けてくれているんですね、と感心しつつ、自分のサイト(1分でできるアイキャッチ画像)のアドレスを打ち込んでみました。

画像なしJPEGPNG
1回目735861
2回目807245

100点満点で、

0〜49点:遅い(赤)
50〜89点:普通(黄)
90〜100点:速い(緑)

ということになります。

1回目は406KBのPNG画像を使った方がJPEGの場合より早くなっています。何かの間違いでしょう。あるいはたまたまネット状況が不安定だったのでしょう。

2回目が妥当な点数のような気がします。きっとこれが正しいに違いありません。でも、恐ろしいことに、なんとPNG画像は赤点をもらっているではありませんか。

これはちょっと低すぎない、って勝手に思って、PNG画像だけもう一度測ってみました。今度は59点で「普通」の評価。まあ、こんなもんだろうな、と勝手に納得しました。

いずれにせよ、はっきりしたのはやはりサイズが小さいほうがいいということです。100KB以下をめざすことにしましょう。

写真だけにする

CanvaではPNGはいいのですが、JPEGは品質が極端に落ちてしまいます。それで、もういっそのことCanvaを使わないことにしよう、写真だけにして(そう、どうせタイトルなんてちゃんと最初に書いてあるし)、大きさを「縮専。」というフリーソフト(まだ使っています)で減らすだけにしたらいいと思いつきました。

これなら、アイキャッチ画像はあっという間にできます。というより、ほとんど何もしなくてもいいようなものです。

「縮専。」で、4160×3120pxの写真を800×600pxに縮めました。ファイルサイズは84.8KB。画質もCanvaの40KBのものよりよさそうです。

明るさも、Canvaではなく、Windows標準の「フォト」で調整します。「編集」の「ライト」を50くらいにしたらいい感じになりました。

厳しい非難を受ける

しかし、実際に使って見ると、周りの人々から厳しい非難を受けました。

これではアイキャッチの意味がない、花の写真が記事とどんな関係があるのか、ブログのタイトルを「ヨジローの雑記帳」ではなく「ヨジローの花日記」とすべきだ、などなど。ヨジローは非難の雨あられに身を縮こまらせてひたすら耐えるばかり。これも絵やイラストのことはよくわからんという日頃の劣等感のゆえ。

しかし、貴重な提言もありました。それは、これまで使ったアイキャッチ画像を使い回せばいいのではないか、というものです。

そうなのです、Canvaはこれまで作ったものをいつも保存してくれています。それを開いて、背景はそのまま、タイトルの文字の色もそのまま、写真だけを差し替えればいいのです。3つか4つか5ほどのアイキャッチ画像をテンプレートにしておけばいいのです。

なんでこんな簡単なことに気づかなかったんだろう?

まとめ

これで結論が出ました。「1分でできるアイキャッチ画像」という標語も守ることができます。

でも、今日一日、僕は何をしていたのでしょうか。PNGやJPEGについてあれこれ調べ、画像を入れ替えてはページの表示速度を測り、ついに結論に達したにもかかわらず、あっさりと覆され……。

こんな日もあります。でも、画像について少しだけ詳しくなり、ページの表示速度を測定できるサイトがあることを知りました。それに、結論が出たことが何よりの収穫です。

(追記)
以下に続きます。


QooQ. Powered by Blogger.