JavaScript

iPhoneでWebアプリをデザインするときに気をつけたい、「jpg」ではCSSスプライトができない

css_sprite

そーいえば以前のことになりますが、
iPhoneでWebアプリをデザインするときに気をつけたいことがありました。「jpg」ではCSSスプライトができないんです。
とはいえちゃんと確認したのは2012/8/13日のこと。

Webアプリケーションを作っていると、CSSスプライトを使う機会が増えてきています。画像のファイルを軽量化したいのと、体感速度を上げたいから。

そこで「png」よりもファイル容量が小さくなる「jpg」でCSSスプライトをやれば、アプリの軽量化につながるんじゃないかと思って実装してみました。

すると

Android端末では問題なく動作しているのに、
iPhoneでは正常な動作にならなかったんです。

ファイルを「png」に戻してみると、AndroidとiPhoneのどちらでも動作しました。

CSSスプライトを使うときはiPhoneを対象にするならファイルは「png」にしといたほうが無難だと思います。

iOSのアップデートなどで、この先使えるようになるかもですが。

ねんのためメモでした。