携帯サイトを3日で作れ的な展開になって泣きながら勉強したときのメモ
なんだかとりあえず3日で携帯サイト作れみたいな展開になってきたので、
1日目:勉強
2日目:環境整備&構想
3日目:コーディング
というスケジュールでやろうかと。
携帯サイト構築に関する本もちょっぴり出ているけど、携帯の世界は移り変わりが激しくて、内容が古かったりするのでやっぱりWEBで最新のモバイル開発をお勉強。
ちなみに携帯サイトの開発経験ゼロ、普段携帯サイトはあんまりみないです(乗換検索とたまにmixi、gmail)。
早速検索してみたところ、こんな↓勉強会が開かれていたようです!
blog.grayash.com - モバイル勉強会レポート
キャリア判別と絵文字についてよりつっこんで学ぶ
特にユーザからの投稿などの機能のないサイトなら絵文字なしの運用も可能だと思いますが、
ユーザからの書込み・投稿・メールなどがありえる場合は絵文字についてきちんと対応したいところ。
その他携帯サイト関連まとめ・概論系参考サイト
上記に加えて余裕があれば以下の記事も読むと勉強になります(だいぶボリュームがあるのでまずはざっと眺めてから深く読んでくほうがいいかも)。
そろそろモバイルサイト作成について本気でなんとかしたいと感じる・・・が。*ホームページを作る人のネタ帳
ケータイサイトを作る時にやっていること。 - ぎじゅっやさん
携帯ホームページを作ろう! -ちょっと詳しいモバイルサイトの作り方-
携帯サイト開発環境を整えよう。
実際に開発する前に、まずは実行確認ができなきゃ話にならないですね。
実機があるなら実機で確認するのが一番確実だけど、全キャリア・全機種揃えるのは難しいのでなんらかのエミュレータを使うのが現実的かなと。
調べてみたところ、とりあえず3キャリアのオフィシャルエミュレータツール(および開発ツール)が
ありました。いくつかあるけど今はこの3種でOKっぽい。
ドコモ
iモードHTMLシミュレータII | サービス・機能 | NTTドコモ
それぞれがどんなもんなのかについては↓を参照。
CodeZine:携帯シミュレータ入門(開発ツール, まとめ)
でも、↓の記事によれば
TokuLog 改め だまってコードを書けよハゲ - ケータイシミュレータなんて使ってないで Moxy 使えばいいのに
という感じでエミュレータだってあんまりあてになんないよ、書いてあります。
で、
実際には Firefox+UserAgentSwitcher+ModifyHeaders+i絵文字 という組み合わせがよく使われてるんじゃないかと思いますね。
とのこと。
上記に加えてさらにMoxyというプロキシサーバーをかませて開発すると楽ですよ、ということが書いてあります。すごく便利そう。Moxyについてのプレゼンムービーもありました。
Moxyプレゼンムービー
Mobile web development with Moxy
Moxyプレゼン資料テキスト版
Mobile web development with Moxy
(※ちなみにPerlで実装されてるのでPerlがわからないと導入は難しそう。)
できる人はMoxy(Firefox+User Agent Switcher+Modify Headers+i絵文字)を使って、できない人は公式のエミュレータ、というのが手軽なのかなあ。
ウノウラボの携帯サイト開発関連記事
ウノウラボの携帯サイト開発関連記事も中身が濃くて必読です!
ウノウラボ Unoh Labs: 携帯サイト作成時の注意点(SoftBank編)
ウノウラボ Unoh Labs: 携帯サイト作成時のXHTMLでの相違点
データ
キャリア・機種判別のための情報をまとめて、かつプログラムに利用可能な状態でデータを公開されてる方もいらっしゃいます!これは活用したい!
機種情報DB - trac on tmty.jp - Trac
そのほか役立ちそうなtipsとかツールとか
第10回 Net_UserAgent_Mobile クラス - 携帯端末情報取得ライブラリ - PEAR講座
携帯電話の「簡単ログイン」は個体識別番号を使ってこんなふうに作れます|WEBクリエイターの木
cakePHPでPCと携帯で出力文字コードを変更する方法 - インストールメモ
iモードサイトを全携帯端末対応にするツール
試してないですが、iモードサイトを全携帯端末対応に変換するツールもありました。
スムーズに理解&導入できたらとても便利そう。
(仕組みを理解するのが大変そうなので今回はとりあえず独自で作ろうかな?)