HTMLの復習)(表の挿入・列)

観光情報論
2014年6月3日
第6講 表作成と画像挿入の応用
Civic Prideの事例:ニューキャッスル・ゲイツヘッド
着地情報:観光情報センター(嘉手納)
HTMLの復習(フォルダー作成・HTMLの表・絵の挿入・
オリ ジナルの絵作成・リンク)
期末発表のグループ編成
New Castle / Gateshead (Summary)
ニューキャッスルは、石炭に恵まれ、タイン川を隔てて隣接するゲイツ
ヘッドとともに イギリス重工業の中心のひとつであったが、第2次世界
大戦以降に衰退した。 そこで1990年代前半に、文化プログラムを活用
した都市再生モデルを模索しており、 協働する自治体を探していたノー
ザン・アーツが、公共空間とパブリック・アートを 結びつける施策をもっ
ていたゲイツヘッドと組み、イギリス最大の彫刻「エンジェル・オブ・ザ・
ノース」(1998)を計画した。 ニューキャッスルも巻き込み、可動歩行者橋
の「ミレニアム・ブリッジ」(2001)、現代美術センターの「バルティック」
(2002)、 音楽ホール「ザ・セージ」(2004)が次々と実現し、それらが立ち
並ぶタイン川沿いの景観は一変した。この4つのプロジェクトに一貫し
ているのは 無数のワークショップであり、子ども向けの教育プログラム
であり、それを支える文化政策の積み重ねである。それがなければ、都
市再生 という変革はここまで浸透しなかっただろう。 (Ai Uehara)
New Castle / Gateshead (Reflection)
建築やパブリックアートを市民にメッセージを届ける手段
にした方法が芸術的で面白いと思いました。しかし、その
物だけで市民がメッセージを受け取るのは難しく、市民に
浸透するよう、ワークショップや教育プログラムも融合させ
る必要もあると分かりました。街のアイデンティティを持つ
建築物があることで、オリジナルの景観ができるのはもち
ろんですが、それにプラスしてワークショップなどを行うこと
で、市民に誇りをもってもらうきっかけになると感じました。
私は沖縄でいうと名護市庁舎がその可能性を持っている
と思います。市民のコミュニティや、風の通り道など、様々
な要素を緻密に計算して作られており、沖縄が誇れる建
築物であると思います。この考えを名護市から沖縄県全
体に広げていけたらいいなと思います。(Arisa Kinjo)
New Castle / Gateshead (Reflection)
一度は工業都市として栄え、衰退していった都市
を、全く違う文化都市に変え たことはとてもすごい
ことだと思いました。市民から多くの避難を受けな
がらも50回に及ぶ教育プログラムやワークショップ
を積極的に行うことにより、賛成 派が増え8割の市
民が街のシンボルとしてエンジェルを支持するまで
にしたことは並な苦労では無かっただろうし、それ
を諦めなかった政府の努力の結晶だなと 思いまし
た。また、このように市民とコミュニケーションをとる
ことが、都市計画への理解や共感を促進させる上
でとても大切だと感じました。 (Wataru Sunagawa)
New Castle / Gateshead
(Reflection)
自分の住んでいるまちが映画のロケ地になったり、多くの観
光客が訪れると、 私たちは住んでいる街に誇りを持ちます。
この章を読んで、それをうまく利用することが大切なことに改
めて気が付きました。沖縄には沖縄らしく、大阪には大阪ら
しい景観やオブジェを置くことはとても必要なことです。そう
することで、市民たちは自分のまちに特別な感じを抱くのだ
と思います。観光客の立場になっ てみても、そういったまち
に訪れたいと考えるはずです。市民が誇りの持てるまち、観
光客がたくさん訪れるまちにするためには、その場所だけ特
有のものが存 在しなければいけないのです。今回は、この
一見当たり前のことを深く実感することができました。
(Io Nishimoto)
New Castle / Gateshead /東日本大震災(女川町)
観光情報センター
沖縄のTourism Info Center 「道の駅」
(情報のLinkage)
道の駅 地図
機能:
• 休憩
• 情報発信
http://www.car489.info/information/station/o
• 地域の連携
gm/#page_ttl
サービス:
• 道路情報
• 物産センター
• 24時間対応
• 案内人
2014/6/17
8
誕生:平成14年度 (2002)
時間
■学習展示室
9:00~18:00
(年中無休)
■展望場
8:00~22:00
■特産品展示販売場
(特産品調理コーナー)9:00~19:00
■農産物直売所 10:00~18:00
■レストラン
24時間OPEN
駐車場/全体:66台
(大型10台、普通車54、身障者2)
トイレ/全体:19
(男9 女9 多目的用1)
使いやすさへの配慮:
・駐車場から施設間の点字ブロッグ設置
・通路の傾斜を8%以下で整備
・11名乗りのエレベーターを整備
・エレベーターの間口を80cm以上を確保
・玄関口に自動ドアで整備
・駐車場とトイレなど施設問を結ぶ主要な歩
行経路のバリアフリー化
・施設の入口に信号機を設置
道の駅 国頭 大宜味 許田
喜名番所
豊崎
いとまん
かでな
誕生
2005
2008
2009
2002
1999 2000
1994
4F
展望場
Sky Lounge
3F
学習展示室
Learning
Exhibition
Room
2F
Restaurant
ホームページ
見本ページ:
演習編 6-1.フォルダーを作ろう。
• USBに hp_kaorukomiyakuni (あなたの氏名) というフォル
ダーを作ってください。
英数小文字
• 今までに作った html ファイルと、それに使う画像ファイルを
すべて、このフォルダーに、入れてください。
civicpride.htm
onsite_info.htm
ideal_trip.htm
列と行のタグ
表の作り方 (タグの意味)
• table テーブル(表)を作ること宣言する
• tr 表の行を表す (table row)
• td 表のセル表す (table data cell)
• th 表の見出しを表す (thread)
先週(5-1) 列と行のタグ
<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>
先週(5-2)-列と行のタグ+ボーダー
<table border="3">
<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>
</body>
</html>
演習編(6-2) 列と行のタグ (挿絵をセルに入れる)
<table border="3">
<tr><th>観光情報の区分</th><th>名称</th><th>評価(5つ星まで)</th></tr>
<tr><td>1.街のTourism Information Center</td><td>那覇観光案内所
</td><td>★★★</td>
<td> <img src=“nahashitim1.jpg” width=“100” height=“100”> </td> </tr>
<tr><td>2.観光者向けの地図</td><td>国際通りの路上地図</td><td>★★★</td>
<td> <img src=“rojo_map_okinawa1.jpg” width=“100” height=“100”> </td></tr>
<tr><td>3.観光者を視野に入れた道路標識</td><td>首里城近辺の琉球石灰岩造
の標識</td><td>★★★★</td>
<td> <img src=“hyoshiki_shuri.jpg”“ width=”100“ height=”100“> </td></tr>
<tr><td>4.無料情報誌</td><td>たびんちゅ</td><td>★★★★</td>
<td> <img src=“tabinchu.jpg” width=“100” height=“100”> </td></tr>
</table>
演習(6-3):ファイル間でリンクをつける
(参考書:72ページ)
onsite_info.htmの一番下に(前スライドの </table> の
下に続けて、下記のようにタイプする。
「シビックプライドにまとめ」を見たい方は
<a href=“civicpride.htm"> <img src =“banner1.gif”> </a>をクリック
「理想の海外旅行」を見たい方は
<a href=“ideal_trip.htm”> <img src=“picture1.gif”> </a> をクリッ
ク!
(演習6-5) オリジナルの絵・バナーを
onsite_info.htmに入れる
メモ帳
ファイル名の例
<img src=“picture1.gif”>
<img src=“banner1.gif”>
ペイント
1. キャンバスを決める
2. 絵をかく
3. わかりやすい名前(英字・・・日
本語でも良いかローマ字を使
う・小文字)で保存する。
4. 保存をするときは、
保存する場所であなたのUSB
(removable disk)を選び、
「hp_kaorukomiyakuni(あなたの名
前)」フォルダーを指定し、ファイル
の種類を「gif」にして保存。
5. 同様に、シビックプライドのバ
ナーを描く。
演習(6-4):同じページ内でリンクをつける
(参考書:76ページ)
onsite_info.htmlの一番下に(前スライドの</table>の下に続け
て、下記のようにタイプする。
「ページトップ」に戻りたい方は
<a href=“#top">ココ</a>をクリック
onsite_info.htmlの始めにもどり、下記のように加える。
<body>
<h1 id=“top”>私の選んだ観光の着地情報</h1>
期末発表 Schedule (グループ:4~5名)夜間主
発表日
グループテーマ
7月1日
7月8日
7月15日
班長と副班長
その他のメン
バー
1.
島袋典子
金城愛未
高安潤
仲宗根康二
塩濱慶
2.
柏木巧
池味陽太
羽地祥紀
山城耕平
3.
宮城真実
仲村かおり
上原佳子
多嘉良麻美
4.
上原健治
上原愛
比嘉支帆里
嘉陽夏希
5.
米田菜緒
平良美知
岸本華衣
6.
7月22日
7.
8.
表紙ページの
File Name
課題
1.Civic Prideの事例 「Manchester」についてまとめと感想を
civicpride.htmに付け加えて、メールで提出。
まとめ(400字程度)
感想(300字程度)。
2.期限:6月8日(日) 11:59pm
5.件名:観光情報論_Manchester
6.メール先:kaorukom@eve.u-ryukyu.ac.jp
2014/6/17
52
期末発表 Schedule (グループ:4~5名)昼間主
発表日
グループテーマ
7月1日
1.
表紙ページの
File Name
班長と副班長
その他のメン
バー
柳俊と上原崇利
金龍海とソウモ
ゲン
2.
7月8日
7月15日
7月22日
3.ようこそ!沖縄へ! Youkosookinawa
he.htm
4.ゆうむ
Yuumu.htm
宜保百絵、比嘉
優夢
もえ、ゆうむ、ゆ
う、だいすけ
5.さっきょーー
Sakkyoo.htm
又吉誠と西本い
お
りょうたろうとた
いせいとさきょう
6.沖縄の○○!
oki_maru.htm
奥浜敏哉、竹内
曜寛
募集中!
7.沖縄の観光情報
Okinawa.htm
宮里健太郎
山城由紀子
宮里和希
ファブリスノエミ
8.
道の駅
駐車
場
国頭
大宜味
許田
喜名番所
豊崎
いとまん
かでな
1999
2000
1994
2005
2008
2009
2002
61+4+
3
30
97+6
+3
35+2+2
159+13+ 473+10+1
14
5
66
10(B)+55+2
9:00~
6:00
面積
建築
面積
公衆
電話
30,000 m2 7,730 m2
735 m2
2
1
4
2
レスト
ラン
なし
パーラー
(ハンバー
ガー・アイス)
物産
店
なし
特産品売り
場
情報・
パンフレッ
学習展示室