i−mode対応Webページを作る


目次

はじめに
CompactHTML
 ・タグ
 ・ダイレクトキー機能
 ・電話番号の指定
 ・絵文字
i−mode端末の活用
 ・住所録
i-mode対応ホームページ編集ツール
HDML(Handheld Devaice Markup Language)
MML(Mobile Markup Language)
XHTML

一つ前へ


はじめに

 最近、NTT DoCoMoのiモード端末が売れているようです。(iモードのiはinformation、interactiveともいわれていますが、本命はやはりinternet。インターネットのサイトを読むことができるブラウザ搭載電話(ブラウザフォン)であることが最大の特徴です。当然Eメールもできます。それ以前の携帯でもメールは可能でしたが、同一キャリア(通信事業者)内に限られたり、いろいろな制限があり、ユーザにとって使い勝手がいいものではありませんでした)売れる要因として、新聞社や金融機関などによる専用サービスが充実していることもありますが、e-mailの交換やWebページの閲覧ができることも人気の要因の1つでしょう。
 i-modeで採用されているCompact HTMLで記述したWebページを使ってi-mode端末を活用する方法を紹介します。
 ちなみに、ドコモ以外ではDDI−セルラーとIDOの「EZ陣営」は同じくブラウザフォンとしてEZweb/accessがありますが、こちらは携帯電話用に開発された記述言語HDMLを採用しています。また、J−フォンのJ−スカイウェブで採用されているのがMMLです。

CompactHTML
 i-mode端末では、CompactHTMLで記述されたWebページが表示できます。CompactHTMLは携帯端末向けのHTML4.0のサブセットで、1998年にアクセスを中心とする国内の数社によりW3Cに提案されました。
 携帯電話上で情報を提供するためのプロトコルとしてはMotorolaやNokiaなどがWAP(Wireless Application Protocol)を推進していますが(IDOなどのEZ陣営が採用 参考1参考2) iモードのWebページはHTMLを利用したCompactHTMLで書かれているので、一般のブラウザでも小さいながら閲覧することが可能です。CompactHTMLの強みはWebページの資産を活用できる点にあります。
 
 


  i−mode対応HTMLの特徴


 ●HTML2.0,3.2,4.0のサブセット
 ●文字コードはS−JIS
 ●画像は2階調GIFのみ表示(502iからアニメーションGIFも可)
 ●イメージファイルを含む1ページのサイズは2Kバイト
  一回4.8円の課金が上限。((2048÷128)×0.3円)
 ●Javaアプレットやスクリプトは未対応(503iで対応予定)
 ●半角カナが使用できる(通常は使用不可)
 ●使用できないタグがある
 ●専用の絵文字がある
 ●クッキをサポートしない

タグ

 携帯端末では、背景色やフォントの大きさ、色などを小刻みに変えたり、細かな表示をするのは困難です。そこで、CompactHTMLでは<font>や<table>などは省略しています。しかし、基本的なタグ(<br>や<ul>、<center>など)やリンク用のタグ(<a>など)、画像表示用のタグ(<img>など)、ユーザからの入力を支援する<input>タグといった基本的なものに関しては通常のHTMLと同様に利用できます。
 i-mode端末では、CompactHTMLのサブセットが使えます(表1)。
 


  (表1)i−mode端末で使えるおもなタグ


 <A>
 <BLOCKQUOTE>
 <BR>
 <CENTER>
 <DL> <DT> <DD>
 <DIR> <MENU> <OL> <UL> <LI>
 <DIV>
 <HR>
 <IMG>
 <INPUT>
 <P>
 <PRE>
 <SELECT> <OPTION>
 <TEXTAREA>


  502iシリーズで追加された主なタグ

 <BLINK>
 <META>
 <LI>
 <SELECT>
 <BODY><FONT>
 <MARQUEE>
 istyle属性


http://www.nttdocomo.co.jp/i/tag/

ダイレクトキー機能
 CompactHTMLは、携帯電話などのテンキーをもつ機器で効果的なブラウジングをおこなうために、HTML4.0で定義されている”アクセスキー(ダイレクトキー)機能”を備えています。通常、HTMLの<A>タグでは、

 <a href="http://www.kaisya.co.jp/">kaisya</a>

 のような記述でwww.kaisya.co.jpへのリンクを表現し、文字列”kaisya”をクリックして選択することによって指定されたURLへ移動できます。
 一方、CompactHTMLでは、

 <a href="http://www.kaisya.co.jp/" accesskey=1>kaisya</a>

 のようにaccesskey属性で指定したキーを用いて指定URLに直接移動するようになっています。上の例では、"1"のキーを押すとwww.kaisya.co.jpが選択され、そのページに移動します。以下のようにキーとURLの対応付けを明示すれば、"kaisya"が"1"キーに対応していることをユーザに示せます。

 <a href="http://www.kaisya.co.jp/" accesskey=1>(1)kaisya</a>

 ダイレクトキー機能は<a>タグのほか、<input>タグのなかでも指定できます。たとえば、

 <input type=submit accesskey=#>

 と記述すれば、電話の"#"キーで入力ホームが送信できます。

電話番号の指定

 i-mode端末では<a>などのタグのなかで、URLやメールアドレスだけでなく電話番号を指定することもできます。たとえば、

 <a href="tel:01-234-5678" accesskey=1>どっか社</a>

 などと記述しておけば、これを選択した場合に該当する番号に電話が発信されます。

絵文字

 i-mode端末では<img>タグによるGIF画像の表示も可能ですが、これには比較的時間がかかるので、代わりに約160種類の絵文字(外字)が用意されています。http://www.nttdocomo.co.jp/i/tag/emoji/

i−mode端末の活用

 i-mode端末では、CompactHTMLで記述したインターネット上の任意のWebページが閲覧できます。通常のCGIプログラムも使えますし、<input>タグを用いたユーザの入力の送出も可能なので、画面が小さいという制限はありますが、通常のWebページと同等なインターフェイスを実現することができます。
 i-mode端末には、通常のPDAに備わっている電卓や住所録などの機能はありません。しかし、Webサーバ上に住所録をおいて参照したり、あるいはCGIプログラムで計算を行うようにすれば、PDAと同様の処理が可能になります。
 以下に、i-mode端末で住所録を扱う例を示します。(セキュリティについては考慮していません)

住所録

 画面が小さいので下のリストのようなHTMLファイルを使って名前を階層的に検索するようにすればよいでしょう。図は、このHTMLファイルをi-mode端末で表示したところです。


  (リスト)階層的な検索を可能にする

 <html>
 <hedad>
 <title>住所録</title>
 </hedad>
 <body>
 [1]<a href="as.html" accesskey=1>あ行</a>
 [2]<a href="kas.html" accesskey=2>か行</a>
 [3]<a href="sas.html" accesskey=3>さ行</a>
 [4]<a href="tas.html" accesskey=4>た行</a>
 [5]<a href="nas.html" accesskey=5>な行</a>
 [6]<a href="has.html" accesskey=6>は行</a>
 [7]<a href="mas.html" accesskey=7>ま行</a>
 [8]<a href="yas.html" accesskey=8>や行</a>
 [9]<a href="ras.html" accesskey=9>ら行</a>
 [0]<a href="was.html" accesskey=0>わ行</a>
 </body>
 </html>



(図)住所録を表示
 [1]あ行 [2]か行
 [3]さ行 [4]た行
 [5]な行 [6]は行
 [7]ま行 [8]や行
 [9]ら行 [0]わ行
  

i−mode対応ホームページ編集ツール

「i.ホタル2001」
 デービーソフトの”ホームページ手ずくり工房「i.ホタル2001」”(\17,800)は、i-mode対応ホームページの作成を支援してくれるホームページ作成ツールです。Windows95/98/NT4.0 に対応し、普通のホームページも作成できます。iモード対応の特徴は下記のとおりです。



 ●iモード用HTMLの編集
 ●iモードが対応していないHTML(タグ)の削除
  既存のホームページを流用するときに使用
 ●GIFファイルを白黒2階調に変換する
 ●iモードプレビュー
  パソコン上に、携帯電話のイメージを表示し、そのスクロール
  ボタンを押すと、「行単位」,「画面単位」,「ページ単位」,の
  スクロールを行う
 ●画面のサイズは、各種携帯端末に合わせて、下記に切替えられる
  画面8桁x6行(48文字)
  画面8桁x8行(64文字)
  画面10桁x10行(100文字)
  その他(任意)
 ●ファイルサイズの確認機能
 ●iモードでの絵文字の貼りつけ
 ●iモード用素材300点
 ●そのまま使えるiモードテンプレート集

HDML(Handheld Devaice Markup Language)

DDI−セルラーとIDOの「EZ陣営」はcdmaOneの新サービス「PacketOne」対応機種を発売ました(DDI-セルラーは「EZweb」、IDOは「EZアクセス」という名のサービスを1999.4から提供開始している)。iモードにぶつけてきたこのサービスの最大のウリは通信スピード。iモードが9.6Kbpsなのに対し、上り(携帯電話→ネットワーク)14.4Kbps、下り(ネットワーク→携帯電話)64Kbpsと最大で7倍近くの速度差があります。cdmaOneは音質の良さが特徴で'99年4月の全国展開以来、300万台以上を売り上げています。今回の新商品ラインナップでiモード追撃態勢が整ったわけです。もちろんブラウザフォンであり、世界標準である通信規格WAP(Wireless Application Protocol)を採用しています。ところがPacketOneは携帯電話用に開発された記述言語HDML(Handheld Devaice Markup Language)を使っているために、PCからは専用のブラウザがないと見ることができません。
iモードのWebページはHTMLを利用したコンパクトHTMLで書かれているので、一般のブラウザでも小さいながら閲覧することが可能です。そのせいばかりではないだしょうが、「iモードの(iメニューに入っていない)勝手サイトは4000にも達しているが、HDMLを採用したEZweb/accessの勝手サイトは100分の1程度」とも言われ、苦戦しています。
「WAPが世界標準といっても海外のサイトはまだ発展途上で、実際に楽しめるわけではありません。さらに通信スピードに関しても、実際には違いはありません。画面に表示できる文字数が100にも満たない段階ですから、1000文字=2Kとすると、計算上9.6Kbpsなら50分の1秒で表示されるわけで、ユーザにとっては変わりません。カラオケをフル・オーケストラでダウンロードしても10Kですから。それよりもどんな面白いサイトがあるか、役に立つか、コンテンツの広がりが問題でしょう。またHDMLは独自の記述言語で、WAP標準の記述言語WML(Wireless Markup LAnguage)のベースとなったもので、似ているが互換性はありません。将来はEZサービスでもWMLを採用する見込みなのでHDMLの将来はどうなるのでしょう?。

MML(Mobile Markup Language)

J−フォンのJ−スカイウェブで採用されているのがMML(Mobile Markup Language)です。MMLはHTMLのタグを短くしてデータサイズを小さくするものです(例:<A HREF="・・・・">が<A H="・・・・">に、<CENTER>が<C>になるといった簡略化が行われている)。実際にはJ−フォンのゲートウェイがHTMLからMMLに変換するので、HTMLで記述すればよいのです。実際J−フォンもHTMLで記述することを推奨しています。MMLはHTMLを基本としているのでCompactHTMLと多少の互換性があり、i-modeのコンテンツをJ−フォンでも表示することは可能ですが、完全に共用することは出来ません。
 

XHTML

 XHTMLは2000年1月26日(米国時間)、ネットの標準化団体であるW3C(ワールドワイド・ウェブ国際コンソーシアム)によって承認されました。XHTMLは、次世代のウェブ記述言語である『XML』(拡張マークアップ言語)の体系に従って、『HTML(ハイパーテキスト・マークアップ言語)4』を書き直したもです。
 XHTMLは、HTML4のエレメント(段落、リンク、テーブルなど)を、データプロパティの定義に使われているXMLの文法体系に統合している。一般的なエレメントの、決まったセットしか提供しないHTMLよりも、カスタマイズが容易です。
 XHTML1.0を使えば、ウェブ制作者は、HTML4のエレメントと他のXML言語からのエレメントを、不適合を起こさずに混用できる。マルチメディア用の『SMIL』(シンクロナイズド・マルチメディア言語)、数式を記述する『MathML』のほ か、『RDF』(リソース・ディスクリプション・フレームワーク)を通したメタデータなどです。
 XHTMLが標準化されたことにより、一般的なウェブブラウザーでXMLコンテンツを閲覧する道も開かれた。現行のウェブブラウザーは、良くてもXMLの一部の機能にしか対応していない(インターネット・エクスプローラ)し、最悪の場 合、まったく対応していない(ネットスケープ・ナビゲーター)からです。
 これまで、一般のブラウザーでXMLの閲覧を可能にするには、XMLのデータは、『XSLT』(Extensible StylesheetLanguage Transformation)機能を搭載したサーバーか、あるいはユーザーが独自に書いたアプリケーションを使って、 HTMLに変換する必要がありました。
 「ウェブマスターはもう、データフォーマットのことを気にする必要はなくなる」とW3Cの広報担当者ジャネット・デイリー氏は語っています。「あらゆる機器が1つのデータフォーマットをサポートするようになれば、真のデバイス非依存性が実現する」
 XHTMLはHTMLと違って、ウェブページ上でデータとレイアウトをリアルタイムで結合するので、ウェブ制作者側のデータおよびサイト管理も、より簡単になる。つまり、データだけを書き換えれば、ウェブページ全体を書き直さなくて もページの更新ができるのです。
 ミュンヘンのスタック・オーバーフロー社のマーケティング担当副社長ヨーゼフ・ディートル氏は、「XMLへ向かう準備段階として、HTMLは、HTML対応デバイスの融合に向けて準備が整ったことになる」と述べた。市場に出ているXHTMLエ ディターは数少ないが、スタック・オーバーフロー社は、その1つである『モズキート・ファクトリー』を開発しています。
 ウェブ制作者は現在、ウェブページをモバイル機器、『パームパイロット』、テレビに向けて発信する体制に入ろうとしているが、その際XHTMLは、プラットフォームに依存しないページ制作の手段を提供する、とディートル氏は述べました。
 「HTMLはコンピュータースクリーン専用だが、例えば無線機器には無線機器の、放送機器には放送機器向け等、機器別の記述言語がある」と同氏は説明する。「パソコン以外の機器で見ることのできるウェブページを作るには、機器に 依存しないフォーマットでページを記述し、変換するのが今までの方法だった。しかしXHTMLの登場で、この変換という過程が必要なくなったのだ」
 XHTMLはHTML4に対し下位互換性を持っているので、一般的なブラウザーはすでにXHTMLに対応していることになる。確かめたい人はW3Cのホームページに行ってみよう。すべてXHTMLで書かれたウェブページが用意されており、ネットスケ ープ・ナビゲーターの4.7以降とインターネット・エクスプローラ5で読むことができます。

一つ前へ