学ぶ&ワーホリ情報
新･パソコン講座
- 携帯サイトの作り方 [2008/3/17]
各社エミュレーターのダウンロード･サイト
本紙システム部
質問：私はオーストラリアで個人事業を営んでおり、事業用にウェブサイトを立ち上げています。この度、携帯電話用のウェブサイトの構築を考えています。日本では既に普及している携帯サイトですが、オーストラリアではこれからが本格的に広まって行く気がします。初心者でも簡単に立ち上げることができる携帯サイトの作り方を教えてください。
回答：既にウェブサイトを作ったことのある人なら、携帯サイトの構築は簡単です。また、業者にウェブサイトを作ってもらい自身はメンテナンスのみでも構いませんし、あるいは、サイト構築は全くの初心者の人にとって、携帯サイトの構築はHTML言語を理解する上で、ちょうどよい入門編になると思います。
ウェブサイトのページは、大きく<head>部と<body>部に分かれます。<head>部に書かれたHTMLコードには、インターネット･エクスプローラのようなブラウザへ知らせるための設定情報やグーグルのような検索エンジンへ知らせるためのコンテンツ情報が含まれます。これらは、インターネット･ユーザには直接、目に触れることのない情報群です。一方、<body>部に書かれたHTMLコードは、インターネット･ユーザに読んでもらうためのコンテンツそのものとなります。
携帯サイトを構築する上で気を付けなければならないことはいろいろあるのですが、まずは重要な以下の3点を押さえておきましょう。
1． HTMLコード内の全角文字をShift-JISと言う文字コードで記入すること
2． 1ページあたりのファイル･サイズ（画像込み）を5KB程度に抑えること
3． 画像ファイルにJPG形式を使用すること
1に関しては、上述の<head>部に<meta http-equiv="content-type"content="text/html; charset=Shift_JIS">と記入した上で、Windows PCでコードを書いていれば気にする必要はありません。2に関しては、1ページに使用する画像の枚数を1枚〜2枚程度に減らし、かつ、画像のサイズ･画質を極力、小さく･低くする必要があります。画像をたくさん見せたい場合は、ページ1枚あたりの容量を小さくする必要があります。
一方、文字数に関しては、5KBでかなりの量を記述できますから、それほど気にする必要はないでしょう。
3に関しては、画像はJPG形式で作成されることをお薦めします。理由は、ほとんどの携帯電話キャリアの携帯ブラウザがサポートしている形式だからです。現在、会社のロゴ･データをJPG形式以外でお持ちの場合もJPG形式に変換した後に、携帯サイトで使用することをお薦めします。
携帯サイトの場合、<body>部に記述できるHTMLタグにかなりの制限があります。例えば、文字を左から右へ流す指定を行う<marquee>と言うタグは、いくつかの携帯ブラウザでサポートされていません。また、JavaScriptなどのブラウザ上で実行されるプログラム言語にも多くの携帯ブラウザで対応されていません。携帯サイトの場合は、ごく基本のタグのみを使用するよう心がけてください。
最後に、日本の携帯キャリアの話ですが、NTT、KDDI、Softbankの各社が無償で提供している携帯電話エミュレーターとそのダウンロード･サイトを紹介します。
エミュレーターとは、あるコンピュータ上での動作を別の種類のコンピュータ上で擬似的に動作させること、あるいは、動作させるコンピュータそのものを言います。このエミュレーターがあれば、各社の携帯電話を持っていなくても、作成したHTMLコードをお手持ちのPC上で確認、テストすることができます。また、上述したHTMLタグの制限についての情報もこれらのエミュレーター上で提供されています。
そのほか、現在、ブログを持っている人は、ブログへのエントリーの都度、発行･更新されるRSSフィードやATOMと呼ばれる仕組みが、ブログ･サービスのプロバイダから提供されているかもしれません。これらを携帯サイトのHTMLに組み入れることで、ブログに入力した記事を携帯サイトにタイムリーに反映させる仕組みにすることも可能です。もちろん、今回、紹介したのは携帯サイト構築のごく基本であり、ほかにさまざまな表現力を持ったコンテンツを作成することが可能です。それでは、携帯サイトで新たな読者を獲得し、ビジネスのさらなる発展にお役立てください。
<head>部の例
<head> <meta http-equiv="content-type" content="text/html; charset=Shift_JIS"> <meta name="robots" content="noarchive"> <title>Nichigo Press</title> </head> |
<body>部の例
<body> <center><img src="http://www.25today.com/img/nichigo_mb.jpg" alt="Nichigo Press"></center> <table width="100%"><tr><td bgcolor="#6666ff" align="center">日豪プレス 携帯サイト<br></td></tr></table> <hr> <table width="100%"><tr><td bgcolor="#007fff" align="center">Copy Right Nichigo Press 2008<br></td></tr></table> |
注１：上記のHTMLコードはサンプルであり、リンクなど実際には存在しません。
注２：実際に使用する場合は、部と部の全体をタグで囲む必要があります。
NTT Docomo
www.nttdocomo.co.jp/service/imode/make/content/download/index.html
(ダウンロード：2008年2月16日 現在)
Softbank
developers.softbankmobile.co.jp/dp/tool_dl/web/wcv.php
(ダウンロード：2008年2月16日現在)
KDDI AU
www.nttdocomo.co.jp/service/imode/make/content/download/index.html
(ダウンロード：2008年2月16日 現在)
|
その他の注目記事： |
