絶品ゆどうふのタレ

ふと気づいたことを綴るだけのメモ

3キャリア対応のテンプレートの話

キャリア別とか2G用にテンプレートを複数作って対応というのは個人で出来るレベルじゃないので、モバイル向けは1ページごとに1枚のテンプレート追加で作る。
なるべくPC向けのテンプレートを大幅に修正しなければいけないようなものは避ける。

(中略)

最後にもう一度まとめ
文字コードUTF-8
マークアップ言語はXHTML Basic
・画像はJPEGGIF
CSSはインラインで書く。
・ページサイズはXHTML9KB以内、画像含めてで100KB以内。
で、最近の端末はだいたいカバーできるはず。

ページが見つかりませんでした | 15Pub

ってことで、割とよくまとまっている感じ。

ただ、実際にこのやり方で組んだことはないんじゃないかなーって言う印象。いや、やったことあったらごめんなさい。
何でそう思うかって言うとインラインCSSのハマりっぷりについて何も触れてない。
3キャリアで1テンプレートを実現しようとすると、DoCoMoのi-CSSのはまりっぷりったらない。
特にstyle="font-size:hogehoge"あたりが半端ない。
CSSと名前が付くけど、全然別物の劣化コピーなので無理に3キャリア対応しようとすると逆にハマる。
っていうか、考えていたデザインは実現できない。絶対3キャリアのデザインが統一されない。


例えば上のstyle="font-size:hogehoge"なんだけど
ausoftbankは、hogehogeは数値指定。
だけど、DoCoMoはlargeとかsmallとかxx-largeとか書いたりする。文字列。数値ダメ。
同じ指定名称なのに、取る値が違う。これは泣ける。
しかもこれで指定すると、ausoftbankは何か変な値と解釈するようで、フォントサイズがおかしくなったりする。au羽虫っぽいけどsoftbankは解釈したはず。
もちろん、ausoftbankの間でも同じ数値の意味する所が違うとか、やるせない違いはあるんだけど、まだ思った方向性に進むだけマシ。DoCoMoマジしn(ry


じゃあausoftbankはheadのCSSで!とか言おうと思ってもそこはインラインが強い。font-size指定上書きされちゃってあちゃぽー。
そういうとこキッチリしなくていいからお二人さん。

じゃあどうするかというと、これを回避するためには、変なバッドノウハウを使う必要がある。


実は、DoCoMoのFoma端末は「XHTMLに対応」しているわけじゃなくて、HTML(DoCoMo独自)モードとXHTML(DoCoMo独自)モードという2種類の解釈方法を別々に持ってる。内部エンジンが実は同じみたいな話も聞いたような聞いてないようなそこはシラネ。

どういうことかと言うと、HTMLモードのときはXHTMLのタグは使えなくて、XHTMLモードのときはHTMLタグは使えない、ということ。
fontの例で言えば、
HTMLモードのときは<font>タグは解釈するけど<span>タグは解釈せず、
XHTMLモードのときは<span>タグは解釈するけど<font>タグは解釈しない。


他にも当然HTMLモードのときは<div>解釈しないとか色々。
ビックリだ。。。


でも、これが合ってよかった、とおもう瞬間もある。それが↑の問題に突き当たったとき。
幸いにも、ausoftbankはHTMLかXHTMLかに関わらず、<span>だけじゃなく<font>も効く。XHTMLだろうが効く。
なので、3キャリア対応で文字サイズを変える場合には、こうすることになる。

<span style="font-size:small"><font size="1">ほげほげ</font></span>

あほかー。
しかも、fontタグでサイズを変更すると、ソフトバンクの変わり具合がヤバい。
正直言ってむちゃくちゃで、ハナクソより小さな文字から1増やすと見出しかお前は!位でかくなる。


まぁまぁ総括すると、素人だろうがなんだろうが、何が何でも3キャリアテンプレート別にしたほうが圧倒的に作業量は減りますし、そもそも1テンプレートにすると表現したかった結果にはたどり着けない場合が出てきますよ、と。



※なんとなく、まとめを見て一応言っとくかって気分になっただけなので走り書き。ごめんね文章書くつもりで書いてないから読んだ方多分すごく読みにかったろうね(;;