ウノウラボ Unoh Labs: ゼロからはじめる携帯サイト構築。

こんにちは、日食を妙に楽しみにしていたわりには見ようともしなかった ryosuke です。曇りで残念でした。曇りでも日食と分かるぐらい暗くなったら嬉しかったのですが、東京ではそんな事は全然ありませんでしたね。

さてさて、そんな私ですが入社後半年が経過したところで、入社当初より携わって来た携帯サイト構築に関して得た知識(失敗談)をまとめてみようと思います。

初ラボブログ記事でも触れた様にそもそも本格的な携帯サイト構築は経験に乏しく、バッドノウハウの塊の様な面倒な思いこみが先行しがちだったわけですが(実際バッドノウハウの塊ですが)、端末の機能や表現力が豊かになるのと同時に開発環境的なツールやライブラリの充実、ノウハウの蓄積と情報公開により随分すんなり入って行けた様に思います。

結局はキャリア感の差異を知り吸収する事がすべて

いきなりですが、PCサイトと携帯サイトの違いで最も厄介な所はこれにつきます。さらに言うと機種事の違い等も少なくありません。

キャリア毎やマークアップによるIME制御の違い
- IME制御は入力が楽になるので是非行いたい所ですが、キャリアやマークアップによって挙動が異なるためかなり分かりにくいです
- 場合に寄ってはエンドユーザーが端末側でモードを切り替えられない事もあるので慎重なテストが必要です
- Yudoufuさんによるまとめがわかりやすくて助かりました。携帯XHTMLでの入力モードのまとめと、ちょっとしたハマりどころについて
メーラー起動時の引数の付け方の違い
- メールのタイトルや本文に予め文章を埋めておく事でガイドする等色々活用できるのですが、これもキャリアや端末の世代によって実装状況が異なります
- Softbankに気をつけないとですね
au ではプログレッシブjpgが表示できない
- docomoやsoftbankでは普通に表示されてるのに何故？とおもったらauの端末ではプログレッシブjpgはNG
- 用意する画像はプログレッシブにしない、PCとコンテンツの共有があり、ユーザー投稿がありえるならサーバサイドでプログレッシブを解除変換する
auの WML拡張は Content-type が text/html じゃないと使えない？
- なんだか不思議な話ですが。
基本的すぎるミス(極めて個人的)
- jpeg画像の MIME Typeは image/jpg じゃない -> image/jpeg
- 携帯がどうとかいうレベルじゃないけど意外と表示できる端末も多いので気付きにくい

これ無しではやってられないぐらい頼りきったツール達

FireMobileSimulator
- http://firemobilesimulator.org/
- 便利過ぎる
- タブ事にシミュレーターのon/offを切り替えられる様になって言う事無し
- 7/30追記: タブ事にシミュレーターのon/offを切り替えられると書いていますが、この機能が実装されているのは現在のところベータ版のみです。詳しくは開発者の堀川さんのブログタブごとに端末選択可能なFireMobileSimulatorベータ版公開と人柱募集でご確認ください。
Live HTTP Headers
- https://addons.mozilla.org/ja/firefox/addon/3829
- 定番のHTTP ヘッダー表示ツール
- デバッグ時に活躍
QRコード出力
- 実機テスト時に大活躍
- QRコード関連はライブラリも揃っているので、自前でQRコードを生成して使って居ますが、Google Chart API のQRコード生成をはじめとしたWEBサービスを使えば十分だと思います。
- http://code.google.com/intl/ja/apis/chart/#qrcodes
- Firefoxのアドオンにもあります
- https://addons.mozilla.org/ja/firefox/addon/2780