小さな会社のためのECサイトプロデュース|ブレイントラスト
  • Yahoo!コマースパートナーBest Store Awards 2020特別賞
  • Yahoo!コマースパートナー認定

ビギナーのための写真基礎知識

前回の記事では誰でもスマホで簡単に商品撮影ができる方法を紹介しました。
今回の記事では、さらに良い写真に仕上げるために写真の基礎知識を解説します。
写真のことを理解しておくことでより良い撮影、画像掲載が可能になります。

写真の基礎知識
スマホでも一眼レフでも、デジタル写真の原理自体は同じです。
そこを理解しておくことで、スマホでも良い写真が撮影できるようになります。
最初に、知っておかないといけないのは次の4つです。
・ピクセル(画素)
・解像度
・画像のファイルサイズ
・ファイル形式

ピクセル(画素)

写真を構成する最小単位のことで、四角形のピクセル(点)の集まりで写真が構成されています。
例えば、パソコンの中の画像を選択し、右クリックしてプロパティを選んだあと、詳細タブをクリックしてみて下さい。
そうすると次のような画像が表示されます。

この画像の場合「幅1920ピクセル 高さ1440ピクセル」と表示されています。
つまり、横に1920個のピクセルが並び、縦に1440個のピクセル(点)が並んでいるので、1920✕1440=約276万個の点の集まりとなり、これが、よくデジカメの性能の表示に使われる●●万画素という意味になります。
この点の数が多いほど、緻密で高画質の画像ということになります。

解像度

画像のきめ細かさを表す数字で、1インチ(2.54cm)の中にどれだけのピクセルが並んでいるかで表現します。
これを「dots per inch(dpi)」といい、数値が大きいほど、密度が高くきめ細やかな画像となります。
例えば、2000✕3000ピクセルの画像を、2✕3インチの大きさで出力する場合、1インチの中に2000÷2=1000ピクセル並ぶことになり、これを1000dpと言います。
同じ画像を4✕6インチで出力する場合は、1インチの中に2000÷4=500ピクセルが並び、500dpiとなります。
このように、元の画像を大きなサイズで出力すればするほど、画像の密度が小さくなり、画質が粗くなります。
また、WEBの場合に覚えておく必要があるのが、解像度は使用するディスプレイに依存するということです。
例えば、パソコンのモニターの場合は、一般的に72dpiまたは96dpiでの表示となります。
下の画像の「水平方向の解像度」と表示されている部分です。

この場合だと、1インチに96個のピクセルが並んでいます。
つまり、パソコンで見るときに250dpiや350dpiの画像は必要ない、ということです。
WEBの場合は、解像度よりもピクセル数だけを意識しておけば大丈夫です。
解像度が高いほうがキレイに見えるだろうと思って、ファイルサイズの大きい高解像度の画像を使うことで、サイトの表示が遅くなるなどのデメリットがありますので注意が必要です。
また、WEBサイトからダウンロードした画像を印刷に使用する方がいますが、印刷物の場合は、通常350dpi以上の画像でないとキレイに表現できませんので、こちらも注意が必要です。

ファイル形式

WEBで使用するファイル形式は、JPGかPNGのどちらかを選択すれば大丈夫です。
画像のファイル形式としては、ほかにもGIF、TIFF、PSDなどもありますが、初心者の方はあまり気にする必要はありません。
まずは、JPGとPNGの特徴を理解しておきましょう。

JPEG

圧縮率が高い、フルカラー(1677万色)の画像を扱える、汎用的
サイズが大きい画像を小さく出来るのがメリットだが、圧縮の際に一部のデータを切り捨てるため、画質が劣化してしまう
単に画像を閲覧したり画像をコピーするだけなら劣化はしない
Photoshopなどの画像編集ソフトで、上書き保存や別名保存を行う際に圧縮処理が行われ画質が劣化する
圧縮率が高いほど画像サイズは小さくなるが、画質が劣化するので注意

PNG

8bit(PNG-8)と24bit(PNG-24)があり、8bitなら256色、24bitなら1677万色の画像が保存でき、透過色を持たせられます。
透過色とは「透過PNG」などとよばれ、使用できる256または1677万の色の中の、どれか1色を透明に見せる画像、という意味です。
背景を切り抜いた商品画像に向いているほか、イラストやロゴなど圧縮ノイズを目立たせたくないようなデータに向いています。
また、JPGと違って、データを復元したときに完全に元に戻すことが出来る「可逆性圧縮方式」なので、何度も加工を繰り返すような画像にも向いています。

画像のファイルサイズ

WEBサイトで使用する画像で注意しないといけないのが画像のファイルサイズです。
撮影の際に、WEBで使うのか、印刷物でも使うのか決まっていない場合、とりあえず高画質の画像を撮っておくことがよくありますが、その画像をそのままWEBにアップすると、当然のことながら表示が遅くなります。
そこで必要なのが画像の「リサイズ」という作業です。
例えば、400万画素で撮影した画像を、WEB用に30万画素にリサイズするというような作業になります。
通常、400万画素のファイル形式がJPGの場合、約1MBの容量があります。これを、30万画素にリサイズすると、ファイル容量は約90KB程度に収まります。
グーグルで推奨されている画像のファイルサイズは1.6MB以下とされていますが、例えば、楽天の商品画像を登録する場合、推奨サイズが750✕750ピクセルとされています。
これは画素数で言うと約56万画素になり、ファイルサイズは約0.4MB程度になります。
これ以上のサイズのデータを登録しても、表示される画質は何も変わりませんので、そうであれば、出来るだけ小さいサイズの画像にしたほうが、表示スピードが早くなり、見る側のストレス軽減になるわけです。
(ちなみに、楽天の場合は、画像登録後にサイズを変更するための機能があります)

画像のリサイズ方法としては、Windowsに標準搭載の「ペイント」を使ってリサイズができます。
(プログラム→Windowsアクセサリ→ペイント)
ペイントを開いて、ファイル→開く→画像選択で、画像ファイルが開きますので、ホームタブ→サイズ変更をクリック後、サイズ変更画面でピクセルにチェックを入れ、ピクセル数を指定するだけで、ファイルサイズが変更されます。
一度試してみて下さい。