初心者ブロガー昨年の10月からブログをはじめた46歳のアラフィフデパート宝石サロン勤務のみゆきんです。ブログをはじめてからはたまにサボってしまうこともありますが、楽しみながら自分の思うこと、伝えたいことを中心に執筆しています。今回の記事で[…]
ブログに使う画像の種類を覚えよう「サイトを軽くする方法」
ブログに使う画像はフリー画像サイトからダウンロードできますが、ブログ初心者の人にはどのくらいのサイズで、どういう種類の画像なら使っていいのか？わかりませんよね。
まずそのことから説明しますと・・。
おすすめフリー画像サイトは3つ
数多くのフリー画像サイトがありますが、ここで迷ってしまっていても時間がもったいないですので実際に私が1年間ブログを続けてきて最初から今現在も使っているサイト3つをご紹介します。
最初はこの3つを使ってみて、徐々に自分のサイトの特性や雰囲気を固めたら色んな画像サイトを追加していってブログを彩っていけばいいと思います。画像に凝りたい人は有料のサイトも多数ありますよ。
画像の種類を2つ憶えよう
拡張子（画像フォーマット）の種類代表的なが画像の拡張子（画像フォーマット）は以下の6つです。
・PNG（.png)
・GIF(.gif)
・TIFF(.tiff/tif)
・WebP(.webp)
・SVG(.svg/.svgz)
JPGそれぞれの画像の拡張子のメリットとデメリット、用途を紹介します。
JPGは、静止画像の圧縮方式で、旧来からのフルカラーの画像ファイル形式であるBMPよりも容量を小さくした画像ファイル形式です。ジェイペグと読みます。画像の色情報から人の目では違いがわからない程度にデータを切り捨てることで、従来よりも容量を小さくしています。
JPGのメリット
JPGのメリットは主に2つあります。
色数が多い
フルカラー約1670万色を表現することができます。デジタルカメラやスマートフォンの画像形式もJPGが多いです。
圧縮倍率が指定できる
圧縮率を1/5~1/30で指定できます。色と色の境界を自然にぼやかして、容量が大きい画像データを小さくします。
JPGのデメリット
JPGのデメリットは主に2つあります。
非可逆圧縮である
JPGは圧縮すると圧縮前のデータが消えてしまう非可逆圧縮です。一度データをカットして圧縮してしまえば、もとには戻せません。また、サイズを変えたり上書き保存をするだけでも画質が劣化してしまいます。
背景透過ができない
JPGでは、背景の透過ができません。四隅が角ではない画像も、長方形の画像として表示されてしまうので注意が必要です。
JPGの用途
JPGは、一般的には色数が多い写真に用いられるファイル形式です。色数の多い、背景写真のように色鮮やかな写真などで使用されます。逆に、シンプルなロゴやイラストでの使用は少なく、背景を透過したい画像には用いられません。
PNG
PNGは主にWebサイト上で画像を表示するなどするために開発された画像ファイル形式で、ピングと読みます。
PNGのメリット
PNGのメリットは主に3つあります。
色数が多い
フルカラーの約1670万色を表現することができます。
可逆圧縮である
JPGと違って、PNGは可逆圧縮です。データを後で完全に復元できます。JPGと違って圧縮しても画質が劣化しないので、何度も加工をする場合はPNGの形式で作業を行うことがおすすめです。
背景透過ができる
PNGは背景の透過ができるので、ロゴマークや、デザインカンプから1つの画像を切り取る際などに有用です。
JPGのデメリット
PNGのデメリットは、画像の種類によっては容量が大きくなってしまう点です。 色数が多く、可逆圧縮や背景透過が可能な半面、グラデーションのある風景のような写真では、JPGよりも容量が大きくなる場合があります。
PNGでしか対応できない可逆圧縮や背景透過の必要性がない場合は、容量を小さく抑えるために、JPGを使用することが多いです。
JPGの用途
JPGと比べたとき、PNGの大きな違いは可逆圧縮である点と背景透過ができる点です。主な画像処理はJPGで行い、何度も加工する際や背景の透過が必要な際に、PNGが用いられる事が多いです。また、図解などの塗りつぶしの多いイラストやロゴマーク、アイコンといったWebサイトに必要な画像にもPNGが使用されることがあります。
画像の種類を変換するなら
画像の種類を変換するのならオンライン上で作業ができる、ILOVEIMGがおススメ。JPEGに変換したり画像サイズを簡単に変更できます。
webサイト上で画像処理ができるのも便利ですログインせずに使えます。
ILOVEIMGで変換したりサイズ変更した後は、こちらもまたweb上で画像を圧縮できるTinyPNGというサイトで画像を圧縮した後ダウンロードしましょう。
画像の圧縮作業
TinyPNGで圧縮した後は圧縮した画像をダウンロードして自分のブログにアップします。
アップする時には、代替テキストとタイトルのところには何かしらの言葉を記入しましょう。説明を入れてあげないとgoogleさんはロボット（AI)なので画像の意味を理解できません。
これで画像サイズを変更してから圧縮する作業は終了です。
PCのCPUの性能によっては時間がかかる場合がありますがサイトを重くしてしまわないように、この作業はキッチリと行うことをおすすめします。
更には、自動で画像を圧縮してくれるプラグインも導入されることをおすすめします。おすすめはEWWW image Optimizerというプラグインです多くの人が使っているプラグインです。
ブログに使う画像の種類を覚えよう「サイトを軽くする方法」のまとめ
今回の記事では私がブログをはじめた時に地味に苦労して時間がかかった、ブログに画像を挿入するときに、「どんな画像を使えばいいのか？」、「挿入する手順は？」などについて説明させていただきました。
画像を取得する時のおすすめ画像フリーサイトは・・。