Labs: iPhoneサイトを作る(3) iUiの仕様

「iUi」についてはヤフースタッフブログにとてもいい説明がありました。去年ブックマークに入れていたのを忘れて今気づきました。「Yahoo!画像検索流 iPhone用ページの作成方法」。

iPhone発売前の記事なのに十分な内容。なので、もうほとんど説明はいらないんですが、書かれていないことで気になった点をいくつか。

POSTデータの渡し方

トップを静的なページとして、検索結果を別ファイルのPHPとします。そのページ間で渡すPOSTデータは、日本語なので変換が必要でした。PHP側でこのように処理。
ちなみに、iUiのページ遷移ではURLを操作しているので、何かデータを渡すときはPOSTにする必要があるようです。

別ファイルの出力方法

iUiでは１ファイル内の遷移も、別ファイルへの遷移も同じようにスクロールで見せてくれます。ただし、別ファイルでは、HTMLフォーマット一式ではなく、bodyタグ内部の必要な箇所のみを出力します。今回の場合、検索結果はリスト表示なので、「ul」タグの部分のみ出力します。
詳細は、iUiのサンプル「samples/theaters/search.php」参照。

その他

• 「fieldset」「label」タグが本来の意味から離れているので調整したいんですが、今後のバージョンアップも踏まえて、基本的なマークアップは変更しないようにします。
• スタイルの微調整としては、リストが押しやすいように項目の高さを変更するなど。
• 新しい要素を作りたい場合は、スタイルが決まっていない「p」や「dl」のタグを使うのがよさそう。ブラウザが１つなのでチェックも楽。
• レストラン検索の仕組みは、PC版とほぼ同じですが、結果に口コミを追加することにします。このツールの目的は「テキスト情報だけでレストランを決めること」。気軽に食べログページへ行けるPC版とは違って、少しでも判断材料が欲しいので。

後はレストラン決定後のアクション（地図表示、電話など）ができれば完成。つづく。