モバイルサイトをリッチ化する
Flash Liteとモバイル動画
リッチ表現を目指す時に、Flash Liteの存在も重要です。Flash Liteはデザインの自由度も高く、携帯の小さな画面でもインパクトある印象を与えることが可能です。
Flash Liteには、サイト全体もしくはページ全体をFlash化する場合(インタラクティブFlash)と、ページの部分にFlashを使う場合(インラインFlash)の2種類の手法があります。目的により使い分けると効果的です。
Flash Liteは各機種のブラウザサイズへ自動的に最適化しますので、機種ごとにサイズを意識することはありませんが、やはり機種依存はあります。
3G端末の中に一部Flash Lite非対応端末があります。非対応端末には、代替画像を表示させるなどの処理が必要です。
また機種によって、Flash Lite1.0/1.1/2.0/3.0の対応バージョンの違いがあります。バージョンによって表現できる内容も違ってきます。それぞれのバージョンでの表現が必要な場合は、対応端末で振り分けて表示させます。上位互換性はありますので、1つのFlash Liteファイルで対応させたい場合、現時点ではFlash Lite 1.1で作成するのがベストでしょう。
キャリアごとのFlash Lite対応端末については下記になります(FOMA905iでは最新の3.0に対応)。
・docomo:900iシリーズ以降で対応(一部非対応あり)
・au:W2xの一部とW3x以降で対応(一部非対応あり)
・SoftBank:3GC端末で対応(一部非対応あり)
Flash Lite開発仕様については下記になります。
・Flash Lite1.0/1.1(Flashバージョン4に相当:ActionScript1.0)
・Flash Lite2.0(Flashバージョン7に相当:ActionScript2.0)
・Flash Lite3.0(Flashバージョン8に相当:ActionScript2.0)
Flash Liteについては、連載「出遅れるな!Flash Lite入門(http://www.thinkit.co.jp/article/144/)」も、参照ください。
動画を使った表現も、モバイルサイトでは今後ますます期待される手法でしょう。3.5Gのスピードの端末では、ダウンロードやストリーミング時の転送速度にストレスを感じにくくなってきています。
動画ファイル作成や配信方法は、キャリアごとに仕様が異なります。配信方法やファイル形式・容量によって機種依存も発生してきます。3キャリアへの対応やより多くの端末への対応を考えると、モバイル動画を、サイトに簡易導入するには、ASP型の動画配信サービスを用いるのが、コスト面から見ても現状はベストだと考えます。
キャリアごとの動画ファイル形式と最大容量については、図3になります。
モバイルリッチサイトを簡単に実現する
モバイルのリッチサイト制作について、ポイントとなる技術要素を紹介してきましたが、デザイン性の高いサイト表現を目指すと、端末対応のハードルが上がってしまうことは否めません。特に画像サイズへの最適化は、最低でも8パターンは必須ですので、XHTMLのコーディングも凝ったデザイン表現では難易度も上がり、キャリア別に記述を書き分けるなど、工数も多くなります。
さらに、レイアウト崩れはないか、多くの機種での実機確認にもより時間がかかる可能性があります。市場からはリッチサイトが望まれても、制作コストが大幅に高くなっていたのでは、なかなか導入機会に恵まれないかもしれません。やはり、モバイルのリッチサイト制作はハードルが高いと感じられた方も多いのではないでしょうか。
モバイルサイト制作現場では、その機種対応の多さから、端末ごとに最適化したページを動的に表示させる機能を持ったASP型のサービスが普及しています。その中でも最近では、XHTML対応・Flash対応など、本格的なリッチサイト制作に対応するサービスがでてきています。
・Rockbird(http://www.rockbird.jp/)
・Let'sケータイ!(http://lets-ktai.jp/premium/)
また、インタラクティブFlashを簡単に生成するサービスやデータベースからリアルタイムでFlashページを生成するエンジン等、Flash Liteを活用しやすいサービスが生まれています。
・MOSE(http://www.mose.jp/)
・ケータイサーチビューアー(http://leafnet.jp/search/)
こういったサービスを活用し、より簡便にモバイルサイトをリッチ化することも一考かと思います。
次回は「コンテンツもよりインタラクティブに」と題して、モバイルのリッチコンテンツ最新事情について紹介していきます。
なお、本稿の執筆にあたって、以下を参考にしました。
「株式会社バリューエンジン:端末プロファイルデータ(http://valueengine.jp/mobile/dprofile.html)」(アクセス:2008/10)
「NTT docomo:端末スペック一覧(http://www.nttdocomo.co.jp/service/imode/make/content/spec/index.html)」(アクセス:2008/10)
「au by KDDI EZfactory:機種別情報一覧(http://www.au.kddi.com/ezfactory/tec/spec/new_win/ezkishu.html)」(アクセス:2008/10)
「SoftBank Mobile Creation:端末一覧(http://creation.mb.softbank.jp/terminal/index.html)」(アクセス:2008/10)