写真の容量を減らしてアクセス数アップを目指しましょう
最近は、自社のホームページやお店のホームページ内でブログを運営している人が沢山いると思います。
私のお客様の中でもパソコンやスマホには詳しくないけれども一生懸命にブログを運営している人が沢山います。
頭が下がります。尊敬します。
そのような方達に、ちょっと便利なツールのご紹介をします。
ブログに掲載する写真の容量を減らしてアクセス数アップを目指しましょうというツールです。
なぜそうするかと言うと、ホームページ上のデータ量は小さいことが良しとされるからです。
ページ自体の容量を減らすことで、検索結果の上位表示を目指すことができますし、実際にページを表示した際に重くて中々表示しないという事象が発生しなくなります。
最近の写真データは容量が大きいですよね
多くの方々は写真をスマホや一眼レフ、ミラーレスなどで撮影されると思います。
そして、最近の機器は性能が高いため、高解像度の写真を撮影することで、写真のデータ容量が大きくなってしまうということになります。
高解像度の写真が撮れることは良いのですが、撮影した状態のままの写真をホームページ上に掲載するのは実は良くないのです!
撮影写真1枚当たりのデータ容量は、高解像度の一眼レフカメラで撮影したりするとが数十MBになることがあります。(勿論写真によって異なります)
そこで、写真のデータ容量を減らす、画像圧縮という処理をしたほうがホームページを見る人も公開する人も幸せになるのです。
ちなみに、下の写真は、私のiPhone12Proで撮影した横浜の風景で約1.41MBの容量の写真をベースにしてあります。
最近のiPhoneで撮影する写真はheicという拡張子が標準となっており、容量を減らしたデータで作られます。
(ここでは、扱いやすいようにjpgに変換したデータにしてあります。また、実際には圧縮したデータとなっており、139KBという容量になっています。)
なんとなくこのままでも良さそうですが、もうちょっと頑張ってみましょう。
データを小さくする方法とは
画像圧縮するには一般的には画像処理ソフトを利用します。
画像サイズを小さくしたり、解像度や品質を下げて、データ量を削っていくのです。
ただ、この方法は、画像処理ソフトを使う必要があるので、パソコンに詳しくない人には使いずらいし、そもそも画像処理ソフトを持っていないということもあります。
ブログを運営するために、画像処理ソフトを買って使い方を学ぶなんて面倒ですよね。
Squooshが便利です
そこでお勧めしたいのがGoogleのWEBサービスである、Squooshです。無料で利用できます。
これは簡単に画像圧縮してくれる便利なツールなんです。
また、容量を減らすと画質が悪くなるのですが、容量を減らすとどのぐら画質が悪くなるのかを目視しながら調整できるというありがたいツールです。
ですので、「ここまでの画質なら品質が落ちても許せる」というところまでデータ容量を落とすことができるんです。
Squooshのページにアクセスすると下記のようなページとなります。
この真ん中のところに写真をドラッグ&ドロップすればすぐに自動でデータを圧縮してくれます。
上で紹介した横浜の写真を圧縮してみます。
ドラッグ&ドロップすると・・・
このような画面になりました。
29%圧縮して、1.41MBのデータが1.05MBに圧縮されたことが分かります。
ドラッグ&ドロップの操作だけで29%も圧縮してくれました。
では、もっと極端に圧縮してみます。
右下の記述で、Qualify:75とあります。25%の圧縮ということだと思いますが、このバーを左にスライドさせることで更に圧縮することができます。またはバー右上の数値入力でも操作可能です。
画質は、画面中央のバーを左右に動かすことで、ビフォーアフターが目視で確認できるのです。
Qualify:20にしてみました。
結果として76%して350MBのデータ容量になりました。
ただし、画質は粗く、利用するにはNGかなと思います。
このように、実際の画像品質を確認しながら圧縮できるのはとても便利です。
圧縮だけじゃない。リサイズもできる。
また、右側のResizeをオンにすると、画像サイズのリサイズもできます。
デフォルトの設定のままなら、「Width」と「Height」のどちらかの欄の数字を小さくすると、操作していない側も同じ比率のまま縮小してくれます。
一番下の「Maintain aspect ratio」欄のチェックを外すと、縦横比を変えることができます。このとき、「Fit method」を「Stretch」にすると、元画像を切り取ることなく縮小拡大します。
たとえば、widthを小さな数字にすると、その数字のサイズの画像になりますが、元画像の情報を切り取らずに変更することになるので、横方法が縮み、細い見え方になります。
「Fit method」を「Contain」にしてリサイズすると、切り取ることになります。元画像の内容が縮むことはありません。
元画像 500px × 500px
「Fit method」を「Stretch」にして 300px × 500px
「Fit method」を「Contain」にして 300px × 500px
こんなイメージです。
見る人がストレスを感じないように
スマートフォンでも使えるようですが、私は試していません。また、このようなWEBサービスは複数ありますが、私としてはこのSquooshがとても使い易いと思いました。
ちょっとの手間で画像圧縮しておけば、後々コンテンツが増えてもサクサクWEBページが表示できるようになると思います。
見る人がストレスを感じないように、そして検索時に上位表示されるように、すこし気に留めて作業してみるのが良いと思います。