ビットマップ形式の基礎と主要フォーマットの選び方：圧縮・色空間・ウェブ実務
エバープレイ編集部ビットマップ形式とは
ビットマップ形式（ラスタ形式とも呼ばれる）は、画像を画素（ピクセル：picture element）の格子で表現する方式です。各ピクセルには色の情報が割り当てられ、これらの集合によって画像全体が構成されます。写真や複雑なグラデーションを含む画像はビットマップ形式で表現されることが多く、モニタ表示やプリント、画像編集などで広く使われています。
基本的な仕組み
ビットマップ画像は横×縦のピクセル数（ピクセル寸法）と、各ピクセルが持つビット数（色深度）で特徴付けられます。たとえば 1920×1080 の画像は横1920ピクセル、縦1080ピクセルの格子で表現されます。色深度は1ビット、8ビット、24ビット、32ビットなどがあり、次のように解釈されます。
- 1ビット：白黒（モノクロ）。各ピクセルは黒か白のどちらか。
- 8ビット：256色（インデックスカラー）やグレースケール。パレット（カラーテーブル）を使用することが多い。
- 24ビット：一般的な「フルカラー」。RGB 各チャンネルが8ビット、合計約1,677万色（256×256×256）。
- 32ビット：24ビットカラーにアルファ（透過）8ビットを加えたもの。透過情報を扱える。
ピクセルごとに色を格納するため、画像の拡大（拡大表示）ではピクセルの目立ちやすさやジャギー（ギザギザ）が生じます。これに対してベクター形式は数学的な図形で表現するため拡大縮小に強い点が異なります。
主なビットマップ（ラスタ）ファイル形式と特徴
- BMP：Windows Bitmap。基本的に非圧縮（または単純な圧縮）で、ヘッダ情報とピクセルデータを格納。互換性は高いが同サイズの画像ではファイルが大きくなる。
- PNG：可逆圧縮（DEFLATE）を使用し、アルファチャネル（透過）をサポート。ロゴやスクリーンショット、線が多い画像に適する。透過が必要なウェブ画像で広く使われる。
- JPEG（JPG）：不可逆圧縮（離散コサイン変換ベース）で写真に最適化。圧縮率を上げるほど劣化（ブロックノイズや色のにじみ）が発生する。透過は基本サポートしない。
- GIF：256色パレットに制限されるがアニメーションと透過（1ビット）をサポート。色数が少ない簡易なアニメやアイコンに向く。
- TIFF：多目的で拡張性が高い。可逆／非可逆圧縮や複数ページ、CMYK カラーモデル、16ビットチャンネルなどを扱えるため印刷業界でよく使われる。
- WebP：Google 提案のフォーマット。可逆・不可逆・アルファをサポートし、JPEG/PNG より高い圧縮効率を実現する場合が多い（対応ブラウザやツールは広がりつつある）。
- AVIF：AV1ベースの新しい形式で、非常に高い圧縮効率と高品質を提供。対応はまだ拡大中だが将来性が高い。
圧縮方式（可逆／不可逆）と用途
ビットマップ形式は圧縮方式によって分類され、用途が変わります。可逆圧縮（lossless）は元のピクセルデータを完全に復元でき、画像処理や保存に向きます。一方で不可逆圧縮（lossy）はデータを捨てることでファイルサイズを大幅に小さくでき、主に写真やウェブ配信に適します。PNG や GIF は可逆、JPEG は不可逆、WebP/AVIF は可逆・不可逆の双方をサポートします。
色空間・カラーマネジメント（ICC プロファイル・sRGB）
ビットマップ画像では色空間（sRGB、Adobe RGB、ProPhoto など）とカラープロファイル（ICC）が重要です。異なるデバイスや表示環境では同じ RGB 値でも見え方が異なるため、正確な色再現が必要な場合は ICC プロファイルを埋め込むか、色空間を明示して扱います。ウェブでは互換性の観点から sRGB が事実上の標準となっています。さらに、ガンマ補正や色管理を無視してリサイズや合成を行うと、明るさやコントラストが崩れることがあるため注意が必要です。
画像処理の基本とリサンプリング
ビットマップ画像の拡大縮小（リサンプリング）では補間アルゴリズムが結果に大きく影響します。代表的なものは次の通りです。
- 最近傍補間（Nearest Neighbor）：処理が速いが階段状（ジャギー）が目立つ。主にアイコンなどピクセルをそのまま保持したい場合に用いる。
- バイリニア補間（Bilinear）：周辺4ピクセルの線形補間で滑らかに見えるが若干ぼやける。
- バイキュービック補間（Bicubic）：より滑らかで品質が高い。写真のリサイズでよく用いられる。
また、パレット数を減らす際のディザリング（dithering）は、少ない色数でも階調を擬似的に再現するための手法です。リサイズや色変換ではガンマを考慮した補正を行うことが、自然な見た目を保つ鍵になります。
ビットマップとベクターの違い・使い分け
ビットマップは写真や複雑なテクスチャ表現に優れ、ピクセル単位での編集が可能です。一方、ベクター（SVG など）は点・線・曲線を数式で表現するため、拡大縮小しても劣化しません。一般的な使い分けは次の通りです。
- 写真・複雑な画像：ビットマップ（JPEG、PNG、WebP など）
- ロゴ・アイコン・図表：ベクター（SVG、PDF、EPS）
- 印刷ワークフロー：高解像度のビットマップ（TIFF、PSD）やベクターの組合せ
ベクターをビットマップに変換する工程をラスタライズ（rasterize）と呼び、DPI（dots per inch）やピクセル寸法を指定して出力します。逆にビットマップをベクターに完全に戻す（トレース）するのは、単純な形状を除き限界があります。
ウェブと実務での最適化（パフォーマンスと品質のバランス）
ウェブ配信ではファイルサイズと画像品質のバランスが重要です。実務で一般的に行う対策は次の通りです。
- 適切なフォーマットを選ぶ：写真は JPEG（または WebP/AVIF の不可逆）、透過やロゴは PNG（または WebP/AVIF の可逆）など。
- 画像サイズを用途に合わせる：表示サイズ以上の解像度を配信しない。レスポンシブ画像（srcset）で端末に合わせた最適なサイズを提供。
- 圧縮ツールを利用する：pngquant（PNG の量子化）、mozjpeg（JPEG の最適化）、cwebp（WebP 変換）などでさらに圧縮。
- 遅延読み込み（lazy loading）や CDNs の活用で初期表示を高速化。
よくある誤解と注意点
- 「DPI が高ければ写真が高解像度になる」：DPI は印刷時の出力密度指標であり、ディスプレイ上のピクセル数（ピクセル寸法）とは別概念。Web 上ではピクセル寸法が重要。
- 「JPEG は透過できる」：標準の JPEG（JFIF）に透過チャネルはない。透過が必要なら PNG や WebP、AVIF を使う。
- 「ビット数が大きいほど常に良い」：色深度が大きいほど表現力は増すが、ファイルサイズと処理コストも増える。用途に応じた適切なビット深度を選ぶことが重要。
実例：フォーマット選びの判断基準（簡易ガイド）
- 写真（ウェブ）：JPEG（高圧縮）→ 可能なら WebP/AVIF に変換して配信
- ロゴ・アイコン（透過が必要）：SVG（ベクター）または PNG（ラスター）
- UI スプライト・小さなグラフィック：PNG あるいは最適化した WebP
- 印刷用マスターファイル：TIFF や高ビット深度の PSD
- アニメーション：GIF（制約あり）→ より効率的には APNG / WebP / AVIF のアニメーション
まとめ
ビットマップ形式はピクセル単位で画像を表現するため、写真や複雑な色合いの再現に適しています。形式ごとに可逆・不可逆の違いや透過サポート、圧縮効率があり、用途に応じた選択が重要です。色空間やガンマ、補間アルゴリズムなどの知識が画像処理や最適化の品質に大きく影響します。最新の WebP / AVIF のような新しいフォーマットは高効率ですが、互換性やツールチェーンの確認も忘れずに行ってください。
参考文献
- ビットマップ - Wikipedia（日本語）
- ラスターグラフィックス - Wikipedia（日本語）
- MDN Web Docs - 画像フォーマットの種類（英語/日本語）
- PNG - Wikipedia（日本語）
- JPEG - Wikipedia（日本語）
- GIF - Wikipedia（日本語）
- WebP（Google Developers、英語）
- AVIF（仕様・ドキュメント、英語）
- International Color Consortium (ICC)（色管理）
- sRGB 色空間（W3C）
- pngquant（PNG 量子化ツール）
- mozjpeg（JPEG 最適化ツール）
- cwebp（WebP 変換ツール）
投稿者プロフィール
