8-2モバイルプログラミングの基本 Tips475 モバイル向けCSSを理解する

Level1

Point原則としてインラインCSSを使う

CSSはCascading Style Sheetsの略で、一般的にはスタイルシートと呼ばれます。CSSではHTMLやxHTMLの各タグの要素をどのように修飾するかを指定することができ、ブラウザやモバイル端末毎にCSSを分けることで、各プラットフォーム上での見せ方を変えたりすることができます。

CSSは一般的のWebサイトでは普通に使われている技術ですが、モバイル端末上でのCSSには注意が必要です。EZWebやY!ケータイでは、HTMLファイルとは別にCSSファイルを用意し、外部参照の形でCSSを読み込むことができますが、数年前のiモード端末ではxHTMLに直接記述するインラインのCSSにしか対応していないという、致命的とも言える仕様の不備があります。最新のiモード端末では外部ファイルのCSSが使えるようになっていますが、FOMAの906iシリーズや706iシリーズ、最近のN-05AやSH-04Aなどで外部CSSが非対応です（Column参照）。執筆時点の2011年6月の段階では、これらの端末シェアもまだ相当数あると推測でき、これら端末への対応をバッサリと切り捨ててしまうのは難しいものがあります。ですので、非常に面倒ですが、3キャリア共通のCSSということでは、以下のようにインラインで書くしかいまのところなさそうです。