今回は, 画像ファイルを Web に載せる方法を講義します.
今回の講義では, ビットマップ画像とかラスター画像と呼ばれる画像です.
コンピュータでは, 画像は色情報を持つ点(各点を pixel (picture element の略)という)
の 2次元的な集まりで表示しています. その各点の色情報を単純に持っている画像を
ビットマップ画像, あるいはラスター画像と言います.
今のHTMLでは動画用のタグ(<video>
)もありますが,
動画は一般的にデータが大きくなり, サーバーやネットワーク資源を多く消費します.
通常の情報共有の場面では, 特別な事情がない限り, 動画は避けるようにします
(琉球大学のホームページでは, オープニングアニメーションが動くようになっていますが,
情報にたどり着くまでに余計な時間が掛かるので, 設計としては最低です).
ラスターイメージに対して, 様々なファイル形式が様々な場所(企業や公的団体)で定義されています.
形式の基本的な違いは, その画像に対する補助的な情報の部分と画像データを圧縮する方法です.
画像データは, データサイズが大きくなるので, そのデータを圧縮することにより,
通信などでのデータやり取りの量を減らすような工夫がなされます.
Web でよく利用される画像形式は, 次に述べてある 3つです.
他のファイル形式が利用できないことはないのですが,
それらも, PC(Windows, Mac, Linux どれでも)に付属するソフトウェアで, 下の 3つの
ファイル形式に変換できますので, これらを利用した方がブラウザに対する依存性が少なくできます.
- GIF(Graphic Interchange Format)
- ビットマップ画像の形式としは古いもの.
256色しか使えないが, 簡単なアニメーションを表示できる. 以前は, データ圧縮に関する特許があり,
使うのに注意が必要であったが, 現在はその特許の有効期限が切れている.
ファイル拡張子は, gif または GIF
- JPEG(Joint Photographic Experts Group)
- 主にディジタルカメラによる写真に利用される形式. データ圧縮率が高いが, 圧縮方式が非可逆
(圧縮データをもとに伸長したときに元データが完全に復元できないこと).
ファイル拡張子は, jpeg または jpg.
- PNG(Portable Network Graphics)
- GIF の特許に関する部分を回避するために策定されたもの.
特許料を要求しないことが仕様の一つになっている. 可逆圧縮なので, 線画のようなものに向いている.
ファイル拡張子は png.
Subsections
2024-06-06