カテゴリー：ウェブ関連

カラフルなiモードページを作る

ドコモのiモード端末のうち、いわゆるFOMAというやつは、仕様上、XHTMLに対応しています。
なかでも900以降の機種については、XHTML1.1対応なので、ブロックごとにリッチに背景色を設定できたりして、かなりカラフルなページ作りができることになっています。最近、大手サイトなんかはカラフルなのが多いですよね。
XHTMLとスタイルシートを使わないと、ごく最近の機種以外は、リッチに背景色を設定したりできません。

ところが、XHTML1.1でちゃんと仕様通りにタグを書いても、端末でみると一切のCSSが反映されていない、というトラブルにあってしまいました。
解決方法をメモしておきます。

XHTML&CSSをきっちり反映させるには

XHTML&CSSをきっちり反映させるには、サーバから、「今から送るのはXHTMLのファイルだからな！」といってもらわないといけないようです。

方法は2つ。

http.confを修正

自分のサーバでapacheのhttp.confが直せる人は、http.confに次のように書き加えます（詳しい書き方はaddtypeとかでググってください）。

AddType application/xhtml+xml 対応させたい拡張子

対応させたい拡張子のところには、.html、.xhtmlなどとスペースを空けて列記します（ドット付けて）。

.htaccessファイルをディレクトリに置く

htmlファイルのあるディレクトリに、「.htaccess」というファイルを作って、上記のAddTypeをそのファイルに書いておきます（詳しくは「.htaccess」でググってください）。

こっちのほうが楽で柔軟ですが、レンタルサーバなんかの場合だと、このファイルの設置を許可していないところもあるかもしれません。

いずれにしてもめんどくさいですねぇ。

また、こうするとたしかにカラフルなページにはなりますが、CSS本来の「デザインとコードの分離」という目的は達せられません。
何せ、インラインにしか対応していませんから…。(´･ω･`)
marqueeタグやhrタグなんかは、独自過ぎて設定もえらく面倒だったりします（iモード対応XHTML比較表）。
凝りだすと、テキトーに素人さんがホームページビルダーで作ったページみたいに、spanタグだらけになってしまうでしょう。
そういう意味では、うれしくない部分も非常に多い仕様です。

参考リンク