観光情報論 第6講 (着地情報)トラベルキオスク & 画像を入れる

Similar documents
観光情報論 第6講 (着地情報)トラベルキオスク & 画像を入れる

スライド 1

観光情報論 第6講 (着地情報)トラベルキオスク & 画像を入れる

観光情報論 第6講 (着地情報)トラベルキオスク & 画像を入れる

スライド 1

(3) 本文を書く 実際にページを開いたときに表示される本文を書いてみましょう から の間に書きます <html > <head > <title > 武のホームページ </title > </head > </html > (4) ページを保存する ここで一度ページを保存してみましょう テキストエ

<4D F736F F D A957A A A8FEE95F18F88979D DEC90AC E646F63>

情報C 4月スクーリング プリント

情報C 4月スクーリング プリント

Web

■新聞記事

Taro-ホームページB5.jtd

観光情報論  2018年6月5日 第9講 ブリストル・スタイルシート

Web データ管理 JavaScript (3) (4 章 ) 2011/12/21( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/18

websample 1 2 websample index.html

ISコースプロジェクト実習 前期(第1回 ガイダンス)

Taro-02_Web_html自習テキストⅡ.

スライド 1

1

untitled


広告掲載規定

2009年 観光情報論 第11講 画像・ビデオ・ファイル

立ち読みページ

2 / 16 HTML=HyperText Markup Language( ハイパーテキストマークアップランゲージ ) ブラウザ (Chrome) での表示 ソースの表示 ( メモ帳 /TeraPad) HTML <========= =========>

1/2

6 2 1

Web プログラミング 1 JavaScript (3) (4 章 ) 2013/7/3( 水 ) 日時 講義内容 4/10 ( 水 ) ガイダンス Web (1 章 ) 4/17 ( 水 ) HTML+CSS (1) (2 章 ) 4/24 ( 水 ) HTML+CSS (2) (2 章 ) 5/

Web データ管理 HTML+CSS (6) (2 章 ) 2011/11/9( 水 ) 湘南工科大学講義資料 Web データ管理 (2011) 阿倍 1/21

フォームとインナー HTML を使って動的にページ内の文章を変更しよう 問題 1. つぎの指示と画面を参考に HTML を組みなさい 仕様 テキストボックスに任意の文字を入力し [ コメント ] ボタンをクリックすると 下部の文章がテキストボックスの内容に置き換わる フォーム名 : f1 テキストボ

<48746D6C8AEE91628D758DC02E786C73>

Webデザイン論

6 2 s µ µµµ µµµµ µ µ h µs µ µµµµ µ µ µ s mµµµµµ µµµ µµ µ u m µmµµµµµ µµ µ µ µ µ µ µ µ µ s 1

Web プログラミング 1 HTML+CSS (6) (2 章 ) 2013/5/29( 水 ) 演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください (Z ドライブとして使用

コンピュータ中級B ~Javaプログラミング~ 第3回 コンピュータと情報をやりとりするには?

~/WWW-local/compIID (WWW IID ) $ mkdir WWW-local $ cd WWW-local $ mkdir compiid 3. Emacs index.html n (a) $ cd ~/WWW/compIID

画像の確認 ブラウザで確認しましょう 写真が表示されました ファイルは引き続き使用します 画像にリンク挿入 画像にリンクを指定する場合は <img> タグをアンカータグ <a> で囲います 通常のリンクと同じようにアンカータグに href="" や target="" などの属性を指定できます 画像

Word によるホームページ勉強会第 10 日目フレームページの製作 Ⅰ.menu.html の製作 改定三宅節雄 1. Word を起動し 表示 印刷レイアウトを選択します ページレイアウト ページ設定の をクリックし フォントの設定からフォントサイズは 12p とします 2

文京女子大学外国語学部

子ボックスや孫ボックスなどに position: absolute; と指定すると それぞれ親ボックスに対する絶対位置で配置できるので親ボックスの上に複数の子ボックスや孫ボックスを重ねて配置することができます トランジションやアニメーションを作成するときに非常に便利なので覚えておきましょう top

Web情報システム 第1章~第5章

overflow プロパティの指定は 親ボックスのスタイルに記述します overflow プロパティは position プロパティ (position: static; 以外 ) の指定がされていなと適用されません ボックスの外にはみ出た部分を表示させたくないときに hidden を使用します サ

1/2

ホームページ・ビルダー16

Microsoft Word IL3_3.doc

Webデザイン論

2 / 25 複数ソフトの組み合わせ テキストファイルを Excel で開く テキスト形式 (.txt) で保存したファイルを Excel で利用しましょう 第 14 講で保存した west.txt を Excel で開きます 1. Excel を起動します 2. [Office ボタ

~モバイルを知る~ 日常生活とモバイルコンピューティング

TD-C56D.indd

目次 概要... 2 フォームレイアウトデザイナー機能の設定... 3 設定したフォームレイアウトデザイナーの確認...14 その他スタイルの設定...15 フォームレイアウトデザイナーをエクスポート...17 フォームレイアウトデザイナーをインポート...18 インポート時の制限事項...19 リ

触覚マウスライブラリを使った 触覚付き Web ページの作り方 ver 富士ゼロックス株式会社 -1-

演習室の PC のハードディスクには演習で作成したデータは保管できません 各 PC の ネットワーク接続 ショートカットからメディア情報センターのサーバーにアクセスしてください 演習名 使用するフォルダ 演習 1 Z: Web データ管理 演習 1 演習 2 Z: Web データ管

Microsoft Word - manual.doc

データ解析

PowerPoint プレゼンテーション

Green Site License のご紹介


Webデザイン論

コンピュータ中級B ~Javaプログラミング~ 第3回 コンピュータと情報をやりとりするには?

別紙 町田市観光まちづくり リーディングプロジェクト ( 案 ) 町田市

Microsoft PowerPoint kiso.ppt

第21章 表計算

<4D F736F F D2082D982AD82C882EA C815B D836A B2E646F63>

KeyWeb Creator 概要 What s KeyWeb Creator? 動的なホームページを作成するためのツール!! 従来の Web ページ DB を利用した Web ページ <HTML> <HEAD> <TITLE>show_book</TITLE> </HEAD> <BODY> <DI

訪日外国人旅行者の国内における受入環境整備に関するアンケート 調査の概要 訪日外国人旅行者を対象に 旅行中に困ったこと 受入環境 ( 多言語対応 通信環境 公共交通等 ) へのニーズ 満足度等に係るアンケートを実施した 訪日外国人利用者の多い成田国際空港 東京国際空港 関西国際空港を中心とした空港

準備 ❶ ちいき本棚への 参加申込方法 1. お申し込みはお電話 FAX メールで TEL: 運営会社東京インタープレイ株式会社営業時間平日 10:00 ~ 18:00 FAX: 以下の内容をお知ら

情報システム設計論II ユーザインタフェース(1)

padding( パディング ) padding プロパティでボックスの内側の余白を指定します この部分の内側には背景 ( 背景色や背景画像 ) を表示できます border( ボーダー ) border プロパティでボックスの境界線を指定します ボーダーには色 太さ 線の種類を指定できます 画像で

スタイルシートでデザインを整えよう

a.net LePo 利用の手引き

World Wide Web =WWW Web ipad Web Web HTML hyper text markup language CSS cascading style sheet Web Web HTML CSS HTML

transform: skewx(x 軸の傾斜角度 ) transform: skewy(y 軸の傾斜角度 ) transform: skew(x 軸の傾斜角度, Y 軸の傾斜角度 ) skewx( ) は X 軸に沿って傾斜します skewy( ) は Y 軸に沿って傾斜します skew( ) は

教材ドットコムオリジナル教材

トリガーをわかり易くする方法

Microsoft Word - ラベルマイティStep1.doc

モバイルビジネスアプリチュートリアル どこでも使えるあなたのビジネスパートナー On-the-Go!

Oracle HTML DBのテンプレート・カスタマイズ

OHP シートの作成 OHP でプレゼンテーションをする際に必要な OHP シートを作成できます 配布資料の作成プレゼンテーションの参加者に配布する資料を簡単に作成できます 参加者はメモ等この資料に書き込むことができ 理解を深めることができます 発表者用資料の作成プレゼンテーション中に発表者が参考に

サンプル CSS1 入力フィールドの輪郭 (outline) のトランジション 入力フィールドをクリックすると変化します InputOutlineTransition の説明 HTML の記述 (InputOutlineTransition.html) id 属性 field の div 要素を作り

</div> </div> </body> </html> CSS の記述 (3DCubeAnime1.css) #stage ステージのスタイルを指定します 背景色を黒色で指定します 画像に軽く遠近感を出すために perspective: 1000px; と指定し perspective-orig

Microsoft Word DOC

! "#$%&'()*+,-. STUV WXYZ[\]^_`abcdefghijklmno pqrstuvwxyz{ }~ ƒ ˆ Š Œ Ž š œ žÿ ª«±²³ µ ¹º»¼½¾ ÀÁÂÃÄ ÅÆÇÈÉÊËÌÍÎÏÐ

2 / 18 ページ 第 13 講データの活用とデータマップの作成 13-1 ホームページの保存 ホームページ (Web ページ ) に表示される様々な情報を ファイルとして保存することができます

_IMv2.key

第 2 回 (4/18) 実力診断の解説と表作成の復習

transform: translatex(x 方向の移動距離 ) transform: translatey(y 方向の移動距離 ) transform: translate(x 方向の移動距離, Y 方向の移動距離 ) transform: translate 関数は 移動する位置ではなく 移動

フレーム ページの作り方 那須シニアネット三宅節雄 今回は那須シニアネットのホームページと同様に 1バナーとホームページのタイトルなどを入れた top.html 2スライドショーなど構成するページの名前の一覧から各ページへリンクさせた menu.html 3 取り敢えず表紙を飾った main.htm

WWW(World Wide Web) 世界中に張り巡らされた クモの巣 という意味 CERN( 欧州合同原子核共同研究機関 ) の研究者が開発した ハイパーテキスト形式 ( HTML ) の分散情報システム WWW サーバーのアドレスを指定するのに URL(Uniform Resource Loc

Web のしくみと応用 ('15) 回テーマ 1 身近なWeb 2 Webの基礎 3 ハイパーメディアとHTML 4 HTMLとCSS 5 HTTP (1) 6 HTTP (2) 7 動的なWebサイト 8 クライアントサイドの技術 回 テーマ 9 リレーショナルデータベース 10 SQL とデータ

第 14 講複数ソフトの組み合わせ テキストファイルを Excel で開く 2 / 17 テキスト形式 (.txt) で保存したファイルを Excel で利用しましょう 第 13 講で保存した west.txt を Excel で開きます 1. Excel を起動します 2. [Off

Microsoft PowerPoint - 04WWWとHTML.pptx

03インターネット活用講座ch01.indd

Moshimo Challenge Report

PowerPoint プレゼンテーション

Contents Contents( 目次 ) 1 重要 編集の際の注意事項 2 編集可能なページ 部分 3 トップページ 4 トップFlashの内容変更 ( 画像変更 ) 5 トップFlashの内容変更 ( 設定変更 ) 6 おすすめ情報 ( カタログギフト等 ) 7 サイドバー バナー部分 8

情報システム設計論II ユーザインタフェース(1)

Color Change

Microsoft Word - ファイル管理Win10 (1版)

PowerPoint プレゼンテーション

3 CSS について Cascading Style Sheets(CSS カスケーディング スタイル シート カスケード スタイル シート) とは HTML や XML の要素をどのように修飾 ( 表示 ) するかを指示する W3C による仕様の一つ 文書の構造と体裁を分離させるという理念を実現す

Transcription:

観光情報論 第 6 講着地情報のまとめ マンチェスターの復習 シビックプライドの起点 URBIS ハンブルグ まちがつくられるライブ感 画像入り! ファイル 私の選んだ観光の着地情報

演習編 (A) 写真と画像をホームページに入れよう! <html> <head> <meta http equiv= Content Type content= text/html;cha555rset=shift=jis > <title> 私の選んだ観光の着地情報 2009 </head> <body> <h1> 私の選んだ観光の着地情報 </h1> <h2> 私の紹介 </h2> <img src= mypicture.jpg > </body> </html> </title> 1. onsite_info.html と名前をつけて保存しましょう 2. 保存したら 出来上がりを見ましょう

演習編 (B) 写真と画像をホームページに入れよう! <html> <head> <meta http equiv= Content Type content= text/html;cha555rset=shift=jis > <title> 観光情報論第 6 講私の選んだ観光の着地情報 2009 </title> </head> <body> <h1> 私の選んだ観光の着地情報 </h1> <h2> 私の紹介 </h2> <img src= mypicture.jpg height= 320 width= 240 > </body> </html> 今の写真の大きさは 640x480 適当な大きさ 例えば 320X240 にしてみてください

演習編 (1) 写真と画像をホームページに入れよう! <html> <head> <meta http equiv= Content Type content= text/html;cha555rset=shift=jis > <title> 私の選んだ観光の着地情報 2009 </title> </head> <body> <h1> 私の選んだ観光の着地情報 </h1> <h2> 私の紹介 </h2> <img src= mypicture.jpg > <h2> 1. 街のTourism Information Center</h2> <img src= nahatim.jpg align= left > 私は国際通りと交差する美栄橋通りにある那覇観光案内所を選びました この案内所では 無料の観光情報誌 ホテルやレンタカー オプショナルパッケージツアー等のパンフレットを用意しています また 観光客のためのトイレや車いす ベビーカー等のサービスも用意しており 便利です 常駐の二人の職員が観光地のアドバイスもしてくれます ぜひ 訪れてみてください </body> </html>

演習編 (2) 写真と画像をホームページに入れよう! <h2> 1. 街の Tourism Information Center</h2> <img src="nahashitim1.jpg" alt= 那覇市観光案内所 " align="right"> 私は国際通りと交差する美栄橋通りにある那覇観光案内所を選びました <br> この案内所では 無料の観光情報誌 ホテルやレンタカー オプショナルパッケージツアー等 <br> のパンフレットを用意しています また 観光客のためのトイレや車いす ベビーカー等のサービスも <br> 用意しており 便利です 常駐の二人の職員が観光地のアドバイスもしてくれます ぜひ 訪れてみてください <br clear="all"> <h2> 2. 観光者向けの地図 </h2> <img src="rojo_map_okinawa1.jpg" alt= 沖縄の路上マップ " align="center" height="240" width="320"> これは 国際通りの路上で見つけた 観光客に 沖縄 という場所を感じさせることのできる芸術的な地図です <br clear="all">

演習編 (3) 写真と画像をホームページに入れよう! <h2> 2. 観光者向けの地図 </h2> <img src="rojo_map_okinawa1.jpg" alt= 沖縄の路上マップ " align="center" height="240" width="320"> これは 国際通りの路上で見つけた 観光客に 沖縄 という場所を感じさせることのできる芸術的な地図です <br clear="all"> <h2> 3. 観光者を視野に入れた道路標識 </h2> <img src="hyoshiki_shuri.jpg" alt= 観光者を視野に入れた道路標識 " align="right"> これは沖縄県首里にある道路標識です リピーター観光客が利用して周辺を散策できるので <br> 地域の 情報のリンケージ として機能していると思います <br> この標識の素材は琉球石灰岩で造られており 地域の建物と違和感のない素材で作られており <br> 来た人にこの土地の雰囲気を醸し出す美しい造りであることから 構造物のリンケージ としても <br> 機能しています <br clear="all">

演習編 (4) 写真と画像をホームページに入れよう! <h2> 街の Tourism Information Center</h2> <img src= nahatim.jpg align= left > 私は国際通りと交差する美栄橋通りにある那覇観光案内所を選びました <br> この案内所では 無料の観光情報誌 ホテルやレンタカー オプショナルパッケージツアー等 <br> のパンフレットを用意しています また 観光客のためのトイレや車いす ベビーカー等のサービスも <br> 用意しており 便利です 常駐の二人の職員が観光地のアドバイスもしてくれます <br> ぜひ 訪れてみてください <h2> 街にある無料の観光情報誌 </h2> <img src= nahatim.jpg align= right > 私は県内のホテルやレンタカー 観光案内書で自由にピックアップできる たびんちゅ <br> を選びました たびんちゅ は年 4 回発行されており 沖縄のおみやげやレストランについての <br> 情報が満載されています 大きさも持ちやすい縦 21センチ 横 25センチのものなので 荷物を <br> 多く持ちたくない旅行者にもちょうどいい大きさです <br> </body> </html>

演習編 (5-1) 写真と画像をホームページに入れよう! 画像ボタンを CD-ROM から <h2> <img src= icon092.gif > 私の選んだハンブルグのコミュニケーションポイント </h2> <img src="tabinchu.jpg" align="right"> この文章にあう絵をひとつ入れてみてください できるホームページ P265 以降を参照 私は県内のホテルやレンタカー 観光案内書で自由にピックアップできる たびんちゅ <br> を選びました たびんちゅ は年 4 回はっこうされており 沖縄のおみやげやレストランについての <br> 情報が満載されています 大きさも持ちやすい縦 21センチ 横 25センチのものなので 荷物を <br> 多く持ちたくない旅行者にもちょうどいい大きさです <br clear="all">

演習 (5-2) 列と行のタグ <h2> <img src="icon092.gif"> 5. 私の評価 </h2> <table> <tr><td> 観光情報の区分 </td><td> 名称 </td><td> 評価 (5 つ星まで )</td> </tr> <tr><td>1. 街の Tourism Information Center</td><td> 那覇観光案内所 </td> <td> </td> </tr> <tr> <td>2. 観光者向けの地図 </td><td> 国際通りの路上地図 </td> <td> </td> </tr> <tr> <td>3. 観光者を視野に入れた道路標識 </td><td> 首里城近辺の琉球石灰岩造の標識 </td> <td> </td> </tr> <tr> <td>4. 無料情報誌 </td> <td> たびんちゅ </td> <td> </td> </tr> </table> 4 列目はハンブルグについてまとめてください

演習編 (5-3) 写真と画像をホームページに入れよう! 列と行のタグ + ボーダー <h2> <img src="icon092.gif"> 感想 </h2> <table> <tr><td> 観光情報の区分 </td><td> 名称 </td><td> 感想 </td></tr> <tr><td> 無料情報誌 </td><td> たびんちょ </td><td> レストランやお土産品の情報が満載 </td></tr> <tr><td> 街にある観光オブジェ </td><td> 首里城近辺の石灰岩性標識 </td><td> 街の雰囲気に合っている Sense of Place を感じることができる </td></tr> </table> <br> <br> <table border="3"> <tr><td> 観光情報の区分 </td><td> 名称 </td><td> 感想 </td></tr> <tr><td> 無料情報誌 </td><td> たびんちゅ </td><td> レストランやお土産品の情報が満載 </td></tr> <tr><td> 街にある観光オブジェ </td><td> 首里城近辺の石灰岩性標識 </td><td> 街の雰囲気に合っている Sense of Place を感じることができる </td></tr> </table> </body> </html> 来週は Bordeaux 第 6 講私の選んだ着地情報 という件名でメールに添付し提出してください

中間テストの内容 中間試験 6 月 15 日 期末発表の下書きhtml 文書をつくる (open book test) 授業の終わる10 分前にメールで提出 - 表紙の例 (HTML 文書をメモ帳に保存 ) -どのようなホームページになるかコンセプトを4,5 行でまとめる (30 点 ) -リンクする項目を6つ作る (10 点 ) - 画像を一つ入れる (10 点 ) -リンクする項目の一つを選び表紙とは別のhtml 文書を作る -このページの説明 (30 点 ) - 画像を一つ入れる (10 点 ) - もとにもどる リンクをつくる(10 点 ) ホームページの題材 ( 例 ) 地域における6つの観光リンケージ ( その現状と提案 ) 地域を選ぶ- 平和通り 壺屋 琉球大学周辺 ( 西原町 ) 沖縄市 豊見城 首里 シビックプライド (p.12) 都市のコミュニケーションの 9 つのレンズを通して見る沖縄 観光情報について - 沖縄の無料観光情報誌 街角観光情報マップ Tourism Information Center

マンチェスターのコミュニケーション戦略 1996 年の IRA による爆弾テロで マンチェスターの街は被害を受けた しかしながら それが一つのきっかけとなり マンチェスターは衰退していた街の再生都市計画を本格的に始めた その復興計画の中心およびシンボルとして ラテン語で 都市 を意味する URBIS という都市ミュージアムを建設した URBIS では展示だけでなく イベントやワークショップ等も行っている 1 階には地方テレビ局のスタジオやカフェなどの他 ホワイエ と呼ばれる 500 人を収容できるスペースがあり 様々なイベントを開催することができる また 現在は入場無料となっており 誰でも URBIS を訪れることができるようになっている 有料ではあるが マンチェスターのまちや URBIS の活動を紹介する様々なツアーも行っている このマンチェスターの事例を読み 自分も URBIS を訪れたいと思った まずその特徴的な外観に魅かれた 外壁が前面ガラス張りで 尖塔がマンチェスターの街を指すという設計は 新しく生まれ変わろうとするマンチェスターのシンボルにふさわしい 展示 ( テキストではイギリスのロックバンド クイーンの写真が展示されており それにそそられた ) も見てみたいし ツアーにも参加してみたいと感じた また 若者や移民 ホームレスなど 社会的に弱い立場に置かれている人々との対話に力を注いでいるという点も興味深いと感じた ( 比嘉正太君 )

マンチェスターのコミュニケーション戦略 マンチェスターは特にワークショップのコミュニケーション戦略を重要視しています その次には都市情報センター 公共空間 都市景観 建築のコミュニケーション戦略を行っております マンチェスターという都市でこの様なコミュニケーション戦略を行う際に非常に重要な役割を担っているのが URBIS といわれる総ガラス張りの建物です URBIS は都市ミュージアム また マンチェスター ミレニアム プロジェクト の中心施設として中心市街地の再生の基点であり 近代都市の先駆者マンチェスターのシビックプライドの象徴であります 総ガラス張りの建物の外観は シンボリックに際立っており こうした外観のアピールは都市生活のミュージアムという新しい活動の重要なプロモーターの役割を果たしているのです さらにこの建物は 都市における生活やそこに生じる課題など リアルタイムに変化していくテーマを扱うことによって 都市の新しい文化を知るための場 といての役割を果たしているほか 社会的に立場の弱い また 立場の異なるさまざまな人々 ( 子供 若者 貧困層 ホームレスなど ) の存在に向き合い 彼らとの対話の場を作ることから始める必要があるため 館内や屋外広場など あらゆる場所を自由に利用できるようにして さまざまなワークショップを行っています マンチェスターという都市には私の大好きなサッカークラブ マンチェスター ユナイテッド という欧州最高レベルのクラブがあり 私は昔からそのクラブを応援していて そのクラブの試合がテレビ放送されているときに時たま都市の紹介などがあったので マンチェスターという都市は大好きで 絶対に行きたいと日々思っています 今回この都市の勉強をして 私の知らなかったマンチェスターの現状やコミュニケーション戦略 プロモーション戦略を学習できて大変勉強になりました これからもこ

マンチェスターのコミュニケーション戦略 また URBIS のターゲットが 社会的に弱い立場に置かれている人々であることや 利害関係の異なる人々との対話を重視したスペースとして運営されていることは 例外なく全ての市民がその都市に誇りを持つことをサポートすることになり 素晴らしいと感じた 沖縄もこの事例に倣い 全ての県民が沖縄に誇りを持つことができるような都市コミュニケーションの仕組みを作ることができれば 観光地としての質を高めることができるのではないかと思った ( 益山貴枝さん ) 私はこのマンチェスターの事例を読んで 今まで持っていたミュージアムの概念が大きく変わりました ミュージアムと言えば 一方的に発信された情報を受け取るというどこか受身的なイメージがありました しかし マンチェスターの URBIS は市民 観光客に対して 常に新しい情報を発信するだけでなく コミュニティの中心として 住民にとって身近な問題 観光客に対して知ってほしい問題を発信し 解決策を共有するという重要なコミュニケーションの手段であることが分かりました ( 門田亜矢さん )