「携帯用ページ」の作り方

はじめに

　本連載では、Web標準のメリットを最大限に活かすことをテーマに、仕様書には書かれていない部分を中心に取り上げ、実際のWeb制作現場で起こり得る問題について、解決の糸口を紹介しています。

　多様なデバイス向けのページ制作として、前回は印刷用ページの作り方を紹介しました。連載第6回目となる今回は、携帯電話向けページの作り方を扱います。

　携帯電話の国内3大キャリアと言えば、NTTドコモ、au by KDDI、ソフトバンクモバイルですが、それぞれに仕様が異なり、すべてのキャリアに対応させるには工夫が必要です。キャリアごとにページを作成し、ユーザーエージェントで振り分ければ、精度の高いデザインを再現できますが、それなりの制作・運用コストがかかってしまいます。本稿では、なるべくコストをかけずに3キャリアに対応した携帯サイトを制作・運用する方法を紹介します。

対象読者

• XHTMLとCSSの基本を理解している方。
• Web標準サイトの実践的な作り方に興味のある方。
• 普段はパソコンサイトを作っていて、これから携帯サイトを作ろうと思っている方。

必要な環境

　表示確認のため国内3大キャリア（NTTドコモ、au by KDDI、ソフトバンクモバイル）の携帯端末があれば望ましいですが、難しい場合には、各社の提供する携帯エミュレータ（携帯端末での見え方を確認できるPCソフトウェア）を活用すると良いでしょう。ただし、実機とまったく同じ見え方になるわけではありませんので注意してください。

図1　iモードHTMLシミュレータ

ツールをダウンロードするには、Mobile Creation会員登録（無料）が必要です。

• NTTドコモ「iモードHTMLシミュレータ」
• au by KDDI「Openwave SDK 6.2K」
• ソフトバンクモバイル「ウェブコンテンツヴューア」