CSSスプライト

制作スタイルによってはひとつのWebページを複数のCSSで構成して生産性を上げることも行われているが、 HTTPリクエストが増えるため、その適用手法によっては結果的にページの表示スピードの低下を招くこともある。複数のCSSを使った制作スタイルであるのはかまわないが、本番環境への移行時はできるだけ複数のCSS は 統合しておいた方がよいのは言うまでもない。極端な話をすれば、改行コードやタブなどの余分なスペース、コメントなども本来は不要な要素である。 同じように Webぺージの表示スピードなどを考慮する場合は、 CSS の背景画像も個別に用意するのではなく、結合できるものは CSS スプライトのテクニックを使ったほうがよいだろう。 CSS スプライ トとは、背景画像として配置する複数の画像を一枚の画像として用 意して、 background-position プロパティで位置を移動させることで 表示させる手法だ。 CSS スプライトに限った話ではないが、 GIF 形式 を使うよりも PNG形式の画像のほうが、同じクオリティでも圧縮効率 が高くサイズダウンできることも覚えておきたい。