WEBサイト制作の勉強

WEBサイト制作の勉強の為の解説ブログです。

フェリカテクニカルアカデミー

CSSスプライト

CSSスプライトとは複数の画像を1つの画像にまとめる事でサイトの読み込み速度を速くする手法です。FacebookGoogleでも使われている手法です。

f:id:yachin29:20160322014753p:plain

 

メリット
画像の読み込みが1回で済むので、サイトの読み込み速度が速くなる

 

デメリット
サイズやデザインの更新が面倒
background-positionの理解が必要

今回はナビゲーションボタンにCSSスプライトを使ってみましょう
f:id:yachin29:20160322014851p:plain