画像を分割もしくは合体させてパフォーマンスは本当に変化するのか? - Webサイトパフォーマンスについて

2014/12/07 108 users 分割 パフォーマンス Webサイトパフォーマンス 初版 画像

2014-12-07 画像を分割もしくは合体させてパフォーマンスは本当に変化するのか? 2008年4月1日に初版が発行された、オライリー・ジャパンの「ハイパフォーマンスWebサイト」を未だに参考にされている方は多いと思います。 時折、「CSSスプライトを使うことで、HTTPリクエスト数が削減されて、高速化に繋がる」と書かれている方をお見受けします。 しかし、それは本当なのでしょうか? そこで、今回... 続きを読む

Webフォントの非同期読み込み - Weblog - Hail2u.net

2013/12/25 83 users Weblog hail2u.net import 並列 CSS

Webフォントの読み込みは@importだと色々まずいので、主にlink要素を使って並列に読み込むわけだけど、これもまた貴重なHTTPリクエスト数を消費するとか、CSSのパース完了が少し遅れるなどあって、完璧な解というわけじゃない。それを非同期にWebフォント定義の含まれるCSSファイルを読み込むようにして、Webフォントのロードをページのレンダリングと並行して行わせるのはどうか、という試み。 非... 続きを読む

img要素でCSS Spriteする方法: 小粋空間

2012/06/06 90 users 小粋空間 img要素 座標 CSS Sprite 手法

「CSS Sprite」は背景画像などの複数の画像ファイルをひとつの画像にまとめて、画像の中から表示させたい部分の座標をbackground-positionプロパティで指定するという手法です。これにより画像ファイルのHTTPリクエスト数を減らすことができます。 この手法は背景画像での利用が一般的なのですが、img要素でも利用することができるようなので、本エントリーで紹介します。 本エントリーでは... 続きを読む