こんにちは。制作部の神谷です。
前回はよく目にする一般的な画像の保存形式についての記事を書きました。
今回は前回紹介しなかったもう一歩専門的な保存形式についてお話ししたいと思います。
本日紹介するのは以下の4つの形式についてです。
・tif
・bmp
・webp
・svg
・おまけ：保存形式、大文字と小文字の違い
・tif
まずは.tifについてです。
読み方は「ティフ」で“tiff”という表記もあります。
（なぜ3文字表記と4文字表記があるのかについては前回の記事をご覧ください。）
恥ずかしながら、私は現在の会社に入ってから初めて見ました。
photoshopで開いたらものすごく大きく、一瞬にしてカンバスを見失いました（笑
このtifは保持できる情報量が多く、圧縮をしないため高解像度での保存が可能ですが、その分サイズが非常に大きいという難点があります。
デジタルカメラなどでたまに見かける形式です。
一度拡張子をjpgなどにしないとwebページでは表示されません。
・bmp
次に.bmp。
読み方は「ビーエムピー」で、Windowsの「ペイント」で見たことがある方もいるかもしれません。
こちらも圧縮をしないので高解像度なのですが、tifと同じくサイズが大きいうえにWindowsのみの対応となっています。
こちらも拡張子を変更しないとwebページでは扱えません。
・webp
これはgoogleが開発したwebのための形式だそうです。
読み方は「ウェッピー」。
こちらも現在の会社に入ってから初めて見ました。
既存サイトから素材をダウンロードしたら謎のファイルだらけになり、びっくりしたのを覚えています。
goolgeが開発したという事もあり、画像のサイズを小さく保存できたり、ページ上での読み込みが早くなるなどの効果があるようですが、まだあまり浸透しておらず、残念ながら対応しているソフトも少ないようです。
そのため、フリーソフトなどを使って拡張子を変換してからしか扱えません。
・svg
最後に、svg。
こちらは私が今一番気になっている形式です。
画像をビットマップ（点）ではなくベクター（計算式）によって描画したもので、illustrator上で描写されるものと同じです。
点描写ではないので拡大縮小に強く、エディターなどで後から編集が可能、さらにcssやJavaScriptなどを使って様々な効果がかけられる！という、とてもweb向きの形式なのですが…やはり弱点はあるようで…。
それは写真等の複雑な描写のものには不向きだという事です。
描写が複雑になればなるほど、それを表すための数式が多くなり、結果コードが膨大な量になる、という事らしいです。
ですので今はまだ簡単なボタン等にしか使用できませんが、いつか写真も美しく描写できるようになるのでは!?と期待しています。
＊おまけコーナー＊
「jpgとJPG、何が違う？？」
画像を扱っていると、時々気になるこの表記。
自分が保存したものはjpgで統一したのに、貰ったデータはJPGだった…という事もちょくちょくあります。
そもそも何が違うんだろう、と思ったことはありませんか？
気になったので少し調べてみました。
結論から言うと、違いはない、との事。
大文字か小文字かは保存時に使用したソフトの違いなどで決まり、その表記が違うからと言って見た目や大きさが変わる、などという事はないそうです。
ただし注意しなければならないのはサーバーに上げるとき。
Windowsでは同じものとして扱われていたこの2つが、サーバーに上げた途端別物扱い、という事が起こるようです。
これはシステムの認識の違いからくるもので、Macユーザーにも同様のことが起こります。
ですので、やはりwebの作業で使うものはどちらかに統一しておいたほうがよさそうです。
また、作業環境がWindowsとMac両方あるような場合も統一しておいたほうが良いでしょう。
以上、普段の生活ではあまり見かけない、ちょっと専門的な保存形式（+α）についてのお話しでした。
次回はブラウザによって微妙に異なる「リロード」の仕方についてお話します。
