CSS スプライト

中尾です。
スクラッチが『CSSスプライト』の案件を承ります！！

CSSスプライトを使用したサイト構築をお考えの方は、
お気軽にご相談ください。

 

まず、CSSスプライトってなに？という方にご説明致しますと、

CSSスプライトとは、複数の画像を一つにまとめ、CSSで表示位置を変更するテクニックのことです。通常、画像はボタンやアイコン等のパーツに分かれていますが、それらをまとめて一つにすることで、画像の読み込みが１度で済みます。
それによって、リクエスト数を減らすことができ、サーバへの負担が少なくなります。また、ブラウザでリソース（画像）が再利用されるので、ページの読み込み時間も早くなります。

しかし、CSSスプライトの欠点として、画像が背景画像となるのでAltを入れることができません。また、代わりにテキストをいれ、 indent：-9999px;という技法もありますが、検索エンジンのスパムの対象になる恐れがあります。
そのため、ナビゲーションやボタンは画像ではなく、テキストリンクになります。

 

CSSスプライトの制作例をご覧になりたい方は、
ホームページにて公開しております。

CSSスプライトの制作例

ご不明な点などでもお気軽にお声かけください！