インターネットで稼ぐ流儀　『第１１９号』

【 インターネットで稼ぐ流儀 】

- MENU -

1. 前記
2. [ サイト作成 Tips ：画像編 -1- ]
3. 編集後記

おはようございます。


Gadget-Project ガジェット・プロジェクト の瀬尾です。


前号からの『サイト作成 Tips 』が続きます。

今号から数号に亘って、
『サイト作成 Tips ：画像編 』です。
今号は、Tips と言うより、基本的な内容なのですが、
話としては難しいかもしれません。

意外に知らないことかもしれませんので、
じっくりとご覧頂ければと思います。


では、いつもの新着情報から。

【 今週の新着情報 】
News Ticker ニュース・ティッカー
[ Prometheus Plug-In ]
あなたのお持ちの販売ページ等ウェブ・ページに、
とても簡単に、ニュース・テロップを流せる、
『ニュース・ティッカー』を取り付けることができるようになる、
Prometheus のプラグイン！
（ Prometheus 本体が別途必要です。）
Prometheus のプラグインが、徐々に増えていきます。
ツール・サービス主宰者として、リスト収集に拍車が掛かります！

このメルマガでは、
インターネットで稼ぐための、
サイトの作り方、SEO の考え方、
アフィリエイト、アドセンス、情報起業、リセールライト、
等についてお話していきます。

更に、精神的なことの話や、脳の話など、
あらゆる面でサポートできればと思っています。

どうぞ、末永いお付き合いをよろしくお願い致します。

サイト作成 Tips ：画像編 -1-

サイトに欠かすことのできない「画像」。

画像には、幾つかのフォーマットがあります。

bmp , jpg(jpeg) , gif , png ,…

一般的によく目にするのが、
bmp , jpg(jpeg) , gif 辺りでしょうか。

時々、png なんかも目にされると思います。


これらのフォーマットの使い分け方は、ご存じでしょうか。

フォーマットをうまく使い分けるには、
まず、それぞれの特徴を知っておく必要がありますので、
ここから説明しておきたいと思います。


まず、bmp 、jpeg(jpg) 、gif 、png 、
それぞれの概要を説明しておきます。


bmp ビットマップは、ピクセル毎にデータを格納していて、
基本的には圧縮されていません。

そのため、ファイル・サイズが大きいので、
ウェブ・サイトに使うには適切ではありません。

ウェブ・サイトに使う画像形式としては、
bmp ビットマップは除いて考えた方がいいです。


jpeg(jpg) 、gif 、png 、といった画像フォーマットは、
それ自体、圧縮された形式なので、
bmp ビットマップと比較するとお分かり頂けるのですが、
ファイルが軽くなるフォーマットなんですね。


これらをどう使い分けるのがいいのか、というところなのですが、
まず、gif ジフ（ギフ）の圧縮の考え方を説明しますね。

圧縮形式としては特許があるくらいですから、
実際には特許レベルの圧縮法があるわけですが、
どうやったら圧縮できるのか、
その『圧縮』の基本的な考え方を説明しておきます。

この画は、画像の一部を拡大したものだと思って下さい。
黄と青のところが画像です。



１つのセル（枡）が、１ピクセルとします。

１セルに対し、色情報が収められているのですが、
ここでは単純に「黄」と「青」とします。

画像データは、(0.0) から横に (0.1) (0.2) (0.3) …と、
それぞれに、黄・黄・黄・黄・…
と収められている状態です。

(2.0) から (2.C) までを見て下さい。

黄・黄・黄・黄・黄・青・青・青・青・青・青・青・青

と、データが収められています。

このままでは、色情報のデータ量は多い状態です。

そこでどうするかというと、
黄 x 5 , 青 x 8
とするんですね。

これによって、データ量は少なくできますよね。

この圧縮されたデータがあれば、
それをそのまま逆に再現してやれば、遜色なく元の画像が再生できます。


これが、可逆圧縮（ロスレス圧縮）と言われている圧縮の、
一番基本的なところになる考え方です。
（実際には全て数字に置き換わりますから、もっと“データ”的に処理されます。）

gif ジフ画像は、
基本的にこの方法に則って圧縮されていますから、
テキスト画像や、連続した色の領域を持つものが適していることは、
お分かり頂けると思います。


これに対して、非可逆圧縮（不可逆圧縮）と呼ばれるのが、
jpg(jpeg) ジェイペグのようなタイプで、
jpg(jpeg) ジェイペグは、写真のようなものに適しています。

非可逆圧縮は、映像だけでなく、音でも使われている考え方なのですが、
人の認知力の及びにくいところのデータを削ってしまおう、というのが、
その基本的考え方です。

そして、取り扱うデータをまとめる単位としての１ブロックを、
小さくすればより精細になりますが、データ量は増え、
１ブロックの領域を大きく採れば、相対的にデータ量は減りますが荒くなる、
そういう状態になるんですね。

圧縮率を高めていくと、ブロックの境目に、
ブロック・ノイズと言われているノイズが発生してしまいます。


そして、png ピングなんですが、
圧縮方式は gif ジフと同様の可逆圧縮形式で、
アルファチャンネルとか色んなデータを併せ持つことができます。

アルファチャンネルによって、
透過領域と透過率を自由に設定できようになるので、
部分的に透き通ったような画像も作成可能になります。


gif ジフと png ピングを比較した場合、
圧縮率は幾分 png ピングの方が高いのですが、
gif ジフ画像を作成する際、256色に減色されることになり、
結果、gif ジフの方がファイル・サイズが小さいということも多々あります。

先程言い忘れましたが、
gif ジフが扱える色は最大 256色（8ビット）なんですね。

png ピングを使っていいなと思うのは、
グラデーションなど、細かい階調の表現が綺麗なところです。

gif ジフに比べて色の幅が広い上、
jpg(jpeg) ジェイペグの非可逆圧縮に対し、
png ピングは可逆圧縮なので、画像をきれいに保存できますが、
その分、jpg(jpeg) ジェイペグよりは、
ファイル・サイズが大きくなってしまいます。

png ピングというのは、つまり、
jpg(jpeg) ジェイペグ同様に扱える色数が多くて、
gif ジフのように可逆圧縮、というのが特徴なのですね。


ちなみに、画像作成のソフトで、
Fireworks ファイアー・ワークスというのが使っている形式も、
png なのですが、これは通常の png 形式ではなく、
レイヤー情報等も含んでいますので、
区別して、『 Fireworks png 』と言います。
もちろん、gif や jpg と同様、
最終的に使えるフォーマットとして、
通常の png 形式に書き出し可能です。


png ピング・フォーマットを使うことは、
現在では余り問題はありませんが、
古いブラウザでは対応していませんので、
（ Internet Explorer 6 以前と、Netscape 4 以前）
利用する際は、その点を理解した上でご利用になって下さい。


すごくザックリした説明でしたが、
画像フォーマットの選択の仕方、
お分かり頂けましたでしょうか。


次回も続きます。。。

最新情報をお伝えしていきます。

編集後記

できる限り、話が難しくならないようには心掛けてはいるのですが、
専門的な内容なので、ある程度はご容赦下さい。

次号もお楽しみに。

Gadget-Project　瀬尾　和弘

ご意見・ご感想、何でも結構です！
お気軽にメール下さいね！

お待ちしております。
info@gadget-project.jp

ということで、
次回もお楽しみに！！

See You !!