インデックスカラー（英: indexed color）とはビットマップ画像の一種。画素（ピクセル）ごとに色を直接指定するのではなく、カラーマップと呼ばれる色定義テーブルの参照番号を指定して画像を表現する形式。 ロゴマークなどのデザイン画の場合、1枚の画像の中で使用されている色の数が限られていることが多い。この場合、あらかじめ使用している色を「色番号1は赤30%・緑20%・青40%、色番号2は赤4%・緑92%・青8%、…」のように色番号で定義しておき、画素ごとのデータとしてはこの色番号を指定するようにすれば、高い色解像度を持ちつつデータ量を大幅に抑えることができるようになる。このような色表現のことを「インデックスカラー（indexed color）」と呼ぶ[注釈 1]。対して、画素ごとに直接色を指定する方式は「トゥルーカラー（true color）」または「フルカラー（full color）
透過を使えるPNG画像 画像というとJPGやGIFがメジャーで、あまりPNGを見ない方もいるかもしれません。 印刷物ではあまり使われることのないPNG形式の画像ですが、Webサイトでは多用する事が多い画像形式です。 PNGはJPGやGIFと違い、透過情報・・・つまり透明度を持たせることができます。 なので画像の上に重ねた画像を作る事が出来るので、とても便利な画像形式です。 Webサイトでは背景色をCSSで色付けして、その上にPNG画像を重ねたりして使われることがあります。 背景色を含めたJPG画像でも表現できますが、透過させて置く事で、色の変更などにも柔軟に対応できますし、要素から画像だけが飛び出たような表現も容易になってきます。 ただしPNG画像はRGBの色しか表現できないので、印刷をする場合には使われることはありません。 印刷で使う画像に透過情報を持たせる場合はEPS形式やPSD形式で
>Q1 PNGでは、各画素の持つ色情報は、 ・RGB各8bit=合計1画素あたり24bit ・RGB各16bit=合計1画素あたり48bit ・グレイスケール8bit=1画素あたり8bit ・グレイスケール16bit=1画素あたり16bit などが選べます。アルファチャネル付きの場合は、これにさらにα情報が付加されて、 ・RGBA各8bit=合計1画素あたり32bit ・RGBA各16bit=合計1画素あたり64bit ・グレイスケール8bit+アルファ8bit=1画素あたり16bit ・グレイスケール16bit+アルファ16bit=1画素あたり32bit のようになります。 いわゆる「24bit形式」と呼ばれるのは、このうち「RGB各8bitの1画素24bit」もしくは「RGBA各8bitの1画素32bit」で、画素情報をそのまま圧縮するフォーマットを刺します。 一方、「インデックスカラ
ミケネコ研究所 / 画像研究室 / PNG の話 / 第 3 章 第 3 章 PNG のスペック一覧 PNG (Portable Network Graphics, ピング) フォーマット。 この章では、PNG フォーマットの機能のそれぞれについて、ざっと紹介していきます。しかし、GIF 問題を初めて認識されたあなたにとっては、おそらく PNG の詳しい機能などには興味がないことでしょう。あなたの最も知りたいことは、PNG の高機能性ではなく、本当に GIF の代わりになるのか、ということのはずです。だから、この章はあなたにとって少々たいくつなことでしょう。 幅と高さ カラータイプ 圧縮 フィルタリング フィルター形式 フィルタリングアルゴリズム インターレース Adam7 アルゴリズム GIF との比較 ガンマ補正 透過設定 αチャンネル 透明色 テキスト文字列 背景色 アスペクト比 減
さて、あなたの環境は、αチャンネルに完全に対応しているなら、左右の画像はほぼ同じように見えるでしょう。そうでない方は、右の画像を参考に見てください。右の画像は「PNG が正しく見える環境なら、左はこう見えるべきである」というサンプル画像です。αチャンネルについては、Netscape 7 や Opera 7 は完璧に表示しているように見えます。 これは、ピンク色のチェックの背景画像の上に、ひとりの少年の PNG イラストが重ねて置いてある配置になっています。イラストの PNG 画像は、αチャンネルを用いて、透過率０％、２５％、５０％、７５％、１００％の 5 つの領域を設定してあります。少年のりんかくの外側は１００％で完全透明であり、背景が透けてみえますね。透明度の度合いを変えて、背景が徐々に透ける感覚をご覧下さい。なにやら４分割されているような感じですが、少年はこれでひとつの画像なのです！
さて、今回は「PNG」について。OS Xではスクリーンショットに使用されるなど、事実上システム標準の画像フォーマットとしての地位にあるが、歴史的経緯を知らず漫然と利用しているユーザも多そうだ。 PNGの種類 かつてOS標準のラスター画像フォーマットといえば、MacはPICTでWindowsはBMPだったが、現在では"主役級"とは言えない。写真はJPEG、WEBページのボタンにはPNGといった具合に、OSとは関係なく用途別に使い分けるほうが多いからだ。 特にPNGは高い圧縮率のほか、最大48bitのフルカラー(約280兆色)をサポート、複数の透過色を指定できる、という特徴から汎用的なラスター画像フォーマットとして普及している。特許問題を抱え扱いにくかったGIFの代替フォーマットとして登場した経緯もあり、基本的にはWEB素材やアイコンといった用途に利用されるが、フルカラー表示が可能なため画質劣
今日は、新年度シリーズとして（続くのかな？）、ウェブで使う画像の基本に関する情報をお届けします。お題は「PNG？ JPEG？ GIF？」どんなときにどのファイルフォーマットを選ぶべきかの基本です。 結論から言うと、ウェブ画像（動画ではない静的な画像）の基本は次のとおりです。 写真（自然物）はJPEG 画面キャプチャ（人工物）はPNG（しかも8bit PNGにして減色する） 次のものは様子をみながら8bit PNGとJPEGで最適なものを選ぶ 自然物と人工物が混じったもの（写真が使われているサイトの画面キャプチャ）グラデーションが入っている画面キャプチャ写真でも色数が少なくてパターンが直線的なもの Web画像は「キレイで」「大きくて」「軽い」が命ウェブサイトに画像は付き物です。ビジュアルに魅力を訴求することで、テキストだけのコンテンツよりも効果が増します。 しかし、画像というものは、キレイで
Smart AVIF, WebP, PNG and JPEG Compression for Faster Websites
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
