インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT HDML入門 さっぴー川原 @sapi_kawahara 1

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT 自己紹介 ● 名前：川原 英明 ● Twitter：@sapi_kawahara ● 業務：五反田の企業でEM＆フルスタックエンジニア ● スキル：コンシューマーゲームプログラマー、最近IT業 界にジョブチェンジしました！ ● マンモス本を片手に、PostgreSQLを理解しつつ、Perlの フレームワークを自作しながら仕事してます。 2

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT iモード使っていますか？ ● 画面が小さいから流行らない！？ ● モノクロだから流行らない！？ ● 使えば使うほど料金かかるのが痛い！？ ● 公式メニューは月額料金が別にかかるのが痛い！？ ● そもそも、Webを家の外で見ないよね！？ ● 知ってました？メールサービスを使うついでに、使って いる人が多いんですよ！！ 3

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT でも、俺の携帯電話は 織田裕二が使っている IDOなんだよね 4

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT IDO公式メニューサイトを作りましょう 5

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT その名も EZaccess !! 6

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT そのためにはHDMLの知識が必要です！ 7

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT What’s HDML? 8 ● Handheld Device Markup Languageの略です。 ● から始まります。（デッキと呼びます） ● 1つのデッキには複数のカードがあります。 ● DISPLAY、CHOICE、ENTRY、NODISPLAYカードがあり ます。 ● 変数があります。 ● それではHDMLを書いてみましょう！

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT デッキとカードの説明 9 Hello EZaccess!
続き 恐怖の大魔王！
続き 来なかったね！
戻る ● 全体がデッキです。 ● DISPLAYタグに囲まれたのがカード です。 ● この例では3枚のカードがあります。 ● 上から順番に表示されます。 ● 1のカードが表示され、続きのリンク をクリックすると、2のカードが表示 されます。 ① ② ③

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT これでサーバーにアップしましょう！ 10

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT ちょっと待った！まずは .htaccessの修正！ ● 修正しないと .hdml はプレーンテキストと判定されてし まいます。 ● 画像はBMPなので、その対応をします。 ● そのため、公開するサーバーの .htaccess に以下記述を 記載します。 ○ AddType text/x-hdml;charset=Shift_JIS .hdml ○ AddType image/bmp .bmp ○ DirectoryIndex index.hdml ● おまけでデフォルトファイルを index.hdml に変えます。 11

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT 確認にはシミュレーターが便利 ● シミュレーターをダウンロードします。 ○ http://web.archive.org/web/20041230214346/http://developer.o penwave.com/ja/tools_and_sdk/openwave_mobile_sdk/SDK62K/Op enwave_SDK_62K.exe ● Windowsで動きます。 ● Mac版欲しいなぁ。 12

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT インストーラー Openwave_SDK_62Kを起動 13

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT 基本「Next」でいけます 14

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT インストール完了！ ● 起動したら、ファ イアウォールで 「アクセスを許可 する」をクリック する。 ● 閲覧したいURLや ファイルを指定し ます。 15

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT これで上手く表示されたはず！ 16

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT 次は変数を使いましょう！ 17

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT 変数の使い方 18 好きな文字を入力してね あなたが入力した文字は
$moji です！
● ENTRYタグのkeyに変数名を指定しま す。 ● 入力モードで表示されます。 ● 文字入力後、画面遷移すると、次画 面の変数名に、入力した文字が表示 されます。

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT フロントだけで インタラクティブな画面が作れる 次世代仕様！ 19

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT 最後に入力フォームを作ろう！ 20

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT サブアクティビティを使います 21 名前:$(name) email: $(email) リセット $(title): ● CHOICEで3つの入力を受け付け て、上二つは1というカードに移 動してます。 ● gosubとreturnで移動し、変数 はreceiveで受け取りretvalsで 返す。 ● varsをサブアクティビティに渡 す変数を設定します。 ● resetサブアクティビティでは friend=trueに指定されたカー ドになっていて、clear=trueで カレントアクティビティの変数 をクリアできます。

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT JavaScript不要だね？！ 22

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT Tips! 23 ● タグの名前は間違えない！ ● シングルタグに/は付けないで！
はダメ！ ● 対になるタグは、ちゃんと閉じる！ ● 引用符も、ちゃんと閉じる！ ● 上記を守らないと、コンパイルエラーが出てWebには一 切でない！ ● エラーの行番号も出ません。 ● .htaccessの設定を忘れずに！

インターネット老人会 #3 1999年12月19日（日） #インターネット老人会LT まとめ ● HDMLは次世代のHTMLだ！ ● カード単位で画面遷移が楽々！ ● 変数が使える！ ● サブアクティビティ最強！ ● みんなもHDMLを使ってIDOの公式メニュー に登録されよう！ 24