CSSスプライト
読み方：シーエスエススプライト
【英】CSS Sprites
CSSスプライトとは、Webデザインにおける技法の一種で、複数の画像部品を連結して1枚の画像ファイルにまとめ、CSSで表示範囲を指定することによって表示する手法のことである。
CSSスプライトは、一般的には複数のファイルとして扱われる画像部品を、1つのファイルにまとめて扱うため、Webページを表示する際にサーバーに対して発せられるHTTPリクエストの数を削減できるという特徴がある。これによって、HTTPリクエストによる表示の遅延を防ぎ、パフォーマンスの向上を図ることができる。また、オンマウス時に表示の切り替わるメニューボタンのような類似画像をまとめて管理できるという利点もある。
CSSスプライトによってまとめられた画像部品は、CSSの「background-image」プロパティで表示範囲を指定することによって、個別の画像ファイルと同様に表示される。画像を結合した上で、表示範囲をピクセル単位で指定するという独特の困難があるが、リッチデザインとハイパフォーマンスの両立の実現が図れる技術の一つとして、CSSスプライトは注目されてきている。
参照リンク
CSS Sprite Generator - （英語）
|
