今や、誰もが持っている携帯電話なので、
　　　携帯端末からホームページにアクセスする機会が
　　　これからはますます増加します。

　　　ここではi-modeを対象にお話していきます。

　　　先ほどのタグを使ってi-mode用のﾍﾟｰｼﾞを作ってみましょう。

　　基本的に使い方はは同じです。
　　ただ、表示できる面積や処理速度ではどうしてもパソコンには
　　劣ってしまうため、使えるタグにも限りがあるので、
　　作成の面から見ると逆に簡単につくることができます。

　　タグの使い方の練習として、
　　まず簡単な i-mode のページを作ってみましょう。 		　



　 　　プロバイダー契約

　　ホームページを持つ為にはプロバイダーとの契約が必要です。
　　プロバイダ-によってはホームページを持てない所もありますが、
　　その場合は、フリーのレンタルスペースを利用しましょう。

　　・ご契約のプロバイダーでホームページの申込みはお済みですか？
　　　　　　　まだの方はこちらからお申込みください。

　　　　　サーバー名、UPL、アカウント(ログイン用ID)、 パスワードは
　　　　　必ず書き留めておいてください。


　　 ホームページ用のフォルダ作成

　　　マイコンピュータのCドライブの中にフォルダを新規作成します。
　　　名前は“homepage”用とわかるものにしましょう。（半角英文字）

　　　そのフォルダのショートカットを作成し、
　　　デスクトップ上に置くと便利です。
　　　このフォルダの中に作成していきます。

　　　ここでは、“homepage”というフォルダを作ったと仮定します。

　　　　　　アップロードした場合、自分のURLを呼び出すと
　　　　　　homepageフォルダの中のindex.htmが表示されます。


　　 i-modeページ用フォルダの作成

　　　homepageフォルダの中に新規作成でフォルダを作成します。
　　　このフォルダには i という名前をつけます。

　　　i-mode用のテキストファイルと画像は i フォルダの中に置きます。


　　　　アップロードした場合、 http://www.〜〜(自分のURL)/i/ が
　　　　 i-mode 用ページのURLになります。


　　 i-mode用ファイルの作成

　　　 i フォルダの中にテキストファイルを作成します。
　　　ここにHTMLの決まり事にしたがってタグを入力します。 		　



　 　　どこが違うの？

　　　　　　ここでは練習の意味での作成なのでテキストのみのページを作成しますが
　　　　　　本格的に作る場合は次の違いを覚えておきましょう。
　
通常のWebページの場合
i-modeの場合
1ﾍﾟｰｼﾞの容量 　特にナシ 　5KB以下
　 (できれば2KB以下)
１行の文字数 　特にナシ 　全角文字で
　 8〜10文字以内
使用可画像 　JPEGまたはGIF 　GIFのみ
使用可能
ﾌﾟﾛｸﾞﾗﾑ		 　JavaScript他多数 　使えません
使用可能タグ 　HTML4.0
　IE・ネスケ使用の場合		 　ｉ モード対応HTML

　　　　　　※ 機種によっては白黒液晶のものもあるので、白黒でもきちんと表示できる画質にしましょう。　　


　　ｉ モード対応HTMLと通常のHTML4.0との比較
　 　ｉ モード対応HTML（Ver.１．０） 　ｉ モード対応HTML（Ver.２．０）
<A>
 　電話をかけられる（telto：） 　１．０と同じ
<BODY>
 　背景色他の指定はできない 　色指定可能
<BR>
 　同じ 　同じ
<CENTER>
 　同じ 　同じ
<FONT>
 　指定できない 　色指定可能
<HR>
 　指定できないが表示される 　１．０と同じ
<HEAD>
 　同じ 　同じ
<HTML>
 　同じ 　同じ
<IMG>
 　GIFのみ指定可能 　１．０と同じ
<MARQUEE>
 　指定できない 　ＩＥのみ指定可能
<P>
 　同じ 　同じ
<PRE>
 　同じ 　同じ
<TITLE>
 　同じだが表示されない 　１．０と同じ

※ その他のタグについてはDocomoのページをご覧ください。
　



　

　前のページのタグの使い方を見ながら実際に１ページ作ってみましょう。

　　　　初めに、右クリック → 新規作成 → テキスト文書でテキストファイルを作成し
　　　　下のソースをそのままコピー＆ペーストしてindex.htmという名前で保存します。

　　　　青文字の部分は変更可です。

i-modeで見てみる
ｉ−ｍｏｄｅをお持ちの方はこちらをクリックしてください。

宛先の先頭にご自分のアドレスを入力するだけで送信できます。

パソコンで見てみる

表示画面
ソース
<HTML>
<TITLE>めだか工房</TITLE>
<BODY>
<CENTER>
めだか工房&#63861;<BR>
<IMG SRC="medaka.gif"></IMG><BR>
</CENTER>
<HR>
&#63847;<A HREF="news.htm">お知らせ</A><BR>
&#63722;<A HREF="gyoumu.htm">業務内容</A><BR>
&#63863;<A HREF="mail.htm">お問合せ</A><BR>
&#63647;<A HREF="link.htm">おすすめﾘﾝｸ</A>
</CENTER>
<HR>
* めだか工房 *
</CENTER>
<BODY>
</HTML>
　　** ソース解説 **
　・５行目
　　&#63861;　 これは i -modeで使える絵文字のコード指定です。
　　　　　　　　　　 &#XXXXX；で指定します。
　　　　　　　　　　 ( i-mode同志でのメールに使えるあの絵文字)
　　　　　　　　　　 コード表については、Docomoのﾍﾟｰｼﾞをご覧ください。

　・６行目
　　　<IMG SRC="medaka.gif"></IMG>
　　　　　　　ここで使用する画像はできるだけサイズを小さくします。
　　　　　　　ちなみにめだかの画像サイズは２４３バイトです。

　　　　　　　　画像の数が多くなる場合はindex.htmと同じ場所に
　　　　　　　　imageというフォルダを作成し、その中に表示したい
　　　　　　　　ＧＩＦ画像を入れるようにするとわかりやすくなります。
　　　　　　　　imageフォルダを使用する場合は相対パスで記述します。
　　　　　　　　　　　　　　　
ｉ−ｍｏｄｅ用の フォルダ i の 中はこうなってます。 →

　・８行目・１４行目
　　　<HR> は、水平線です。

　・９〜１２行目
　　　<A HREF="news.htm">お知らせ</A>
　　　　　お知らせという文字は news.htm にリンクしています。という意

　　慣れてきたらこういう指定もしてみましょう。
　　　<A HREF="news.htm" ACCESSKEY="1">お知らせ</A>
　　　　　 コレが入るとそのままﾘﾝｸ先にジャンプできるようになります。
　



　 　タグ入力後

　　　テキストファイルを index.htm という名前で保存します。　　　
　　　拡張子 .txt を .htm に変更するとアイコンの表示が変わり
　　　HTMLファイルになります。

　　　拡張子変更後の修正は、HTMLファイルを開いて、
　　　ブラウザの表示→ソースでソースの中身で行います。
　　　

　　　＊ 拡張子は .htm でも .html どちらでも構いませんが
　　　　　どちらかに統一します。
　　　　　ここでは、 .htm に統一しています。 		　



いよいよWeb上に公開です。 次のステップに進みましょう。



* Copyight© 1999-2010 めだか工房 *