Download - インターネットの歴史とWWWの成立 - CUC Web表現1
![Page 1: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/1.jpg)
Web表現ガイダンス
千葉商科大学政策情報学部2011年9月28日担当:田所 淳
![Page 2: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/2.jpg)
自己紹介‣ この授業の担当:田所 淳 (たどころ あつし)‣ 千葉商科大学での非常勤講師の他‣ 多摩美術大学 情報デザイン学科情報芸術コース 非常勤講師‣ 東京藝術大学 芸術情報センター非常勤講師
‣ プログラミングの出会いは、コンピュータ音楽から‣ 徐々に、音の視覚化や、生成的なグラフィックス表現へ
![Page 3: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/3.jpg)
‣ 去年、本を出しました !!
自己紹介
Beyond InteractionメディアアートのためのopenFrameworksプログラミング入門
田所 淳, 比嘉 了, 久保田 晃弘ビー・エヌ・エヌ新社 (2010/2/21)
※ openFrameworks については、後期に開講される「グラッフィクスプログラミングB」で扱う予定です
![Page 5: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/5.jpg)
今日の内容‣ WWWの歴史を駆け足で‣ インターネット ≠ WWW‣ インターネットの簡単な歴史‣ WWWへ至る道
‣ WWWとはなにか‣ ハイパーテキスト‣ マークアップ
‣ WWWを支える3つの仕組み‣ URI‣ HTTP‣ HTML
![Page 6: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/6.jpg)
WWWの歴史‣ 「インターネット = WWW」ではない‣ WWWは、インターネット上の一機能でしかない‣ WWW以前のインターネットの主要機能‣ telnet:遠隔にあるサーバを端末から操作‣ ftp:ホスト間のファイル転送‣ email:メール‣ UUCP:ネットニュース‣ archie:ファイル検索
‣ WWW以前にもインターネットには長い歴史がある
![Page 7: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/7.jpg)
インターネットの歴史‣ インターネットの簡単な歴史‣ 1957:ARPA創設‣ 1960:Joseph Carl Robnett Licklider、タイムシェアリングシステムの概念の発表
‣ 1969:ARPANET始動、UCLAとスタンフォード大‣ 1971:初のemailを送受信‣ 1979:USENET開始‣ 1983:TCP/IPの採用‣ 1990:ARPANET終了‣ 1991:Tim Berners-Lee、WWW発表‣ 1993:Mosaic発表 (後のNetscape)‣ 1995:Yahoo! 設立‣ 1998:Google設立
![Page 8: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/8.jpg)
WWWに至る道‣ WWWの成立に貢献した発明‣ インターネットの技術の他にもう一つ重要な発明
‣ ハイパーテキスト(hypertext)‣ 複数の文書を相互に関連付け、結び付ける仕組み‣ ハイパーリンク:テキスト間を結びつける参照のこと
![Page 9: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/9.jpg)
WWWに至る道‣ ヴァネバー・ブッシュ (Vannevar Bush)‣ 論文 “As We may think (我々が考えるように)” (1945)‣ 図書館的な情報検索システムは情報の増加に追いつかない‣ 連想の網の中で多くの知識を格納する → ハイパーテキスト
![Page 10: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/10.jpg)
WWWに至る道‣ memex (1945)‣ ヴァネバー・ブッシュが"As We May Think" で発表したコンピュータシステムの概念
‣ 一種の図書館と電気的に接続され、その図書館の本やフィルムを表示でき、自動的に相互参照をたどって他の作品(本やフイルム)を表示するデバイス
![Page 11: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/11.jpg)
WWWに至る道‣ テッド・ネルソン(Theodor Holm Nelson)‣ Project Xanadu:コンピュータネットワーク上にハイパーテキストを実現する計画 (1960)
‣ 「ハイパーテキスト」という用語を初めて使用 (1965)‣ 後のWWWに多大な影響
![Page 12: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/12.jpg)
WWWに至る道‣ ダグラス・エンゲルバート(Douglas Carl Engelbart)‣ NLSシステム(1968)‣ ハイパーテキストインタフェース(と初の実用的なGUI)のデモを公衆の前で初めておこなう
‣ "The Mother of All Demos"「すべてのデモの母」
![Page 13: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/13.jpg)
WWWに至る道‣ アスペン・ムービーマップ (1977)‣ 初のハイパーメディアアプリケーション‣ アスペンの街をバーチャル旅行することができる‣ コマ撮りされた大量の写真がリンクされている
![Page 14: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/14.jpg)
WWWに至る道‣ HyperCard (1987)‣ Apple Compuerのビル・アトキンソン(Bill Atkinson)‣ ハイパーテキストを実現した初の商用ソフトウェア‣ リンクで結合されたカードの集積をスタックとして扱う‣ ネットワークには未対応
![Page 15: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/15.jpg)
WWWに至る道‣ HyperCardカードのスタックの例‣ “The Manhole” (1989)‣ ハイパースペース上でのインタラクティブ小説
![Page 16: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/16.jpg)
WWWの誕生‣ ティム・バーナーズ=リー(Timothy John Berners-Lee)‣ WWWの生みの親
![Page 17: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/17.jpg)
WWWの誕生‣ ティム・バーナーズ=リーの ”World Wide Web”‣ WWW開発の動機‣ 欧州原子核研究機構(CERN)で数千人の研究者同士の情報を行きわたらせるためのシステム構築を命じられる
‣ CERN - スイスのジュネーヴ郊外にある、世界最大規模の素粒子物理学の研究所
![Page 18: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/18.jpg)
WWWの誕生‣ ティム・バーナーズ=リーの ”World Wide Web”‣ 各国に散らばっている実験者が瞬時に情報にアクセスしたい‣ 同時に多くのコンピュータ間で同じ情報を共有したい‣ 1990年、初のWWWブラウザ “WorldWideWeb” を発表
![Page 19: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/19.jpg)
WWWの誕生‣ ティム・バーナーズ=リーの ”World Wide Web”
‣ 開発にはNeXTコンピュータを使用‣ Appleを追放されたスティーブ・ジョブスが設立した‣ 先進的で洗練されたGUIと開発環境
![Page 20: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/20.jpg)
Webブラウザの発展‣ VioliaWWW (1991)
![Page 21: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/21.jpg)
Webブラウザの発展‣ NCSA Mosaic (1993)
![Page 22: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/22.jpg)
Webブラウザの発展‣ Netscape Navigator (1994)
![Page 23: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/23.jpg)
Webブラウザの発展‣ Internet Explorer (1995)
![Page 24: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/24.jpg)
Webブラウザの発展‣ Opera (1996)
![Page 25: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/25.jpg)
Webブラウザの発展‣ Mozilla (2002)
![Page 26: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/26.jpg)
Webブラウザの発展‣ Firefox (2002)
![Page 27: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/27.jpg)
Webブラウザの発展‣ Safari (2003)
![Page 28: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/28.jpg)
Webブラウザの発展‣ Google Crhome (2008)
![Page 29: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/29.jpg)
‣ 自分のPCでWebページを見ているとき、何が起っているのか
2.閲覧したいWebページのアドレスを入力‣ 例:http://www.geidai.ac.jp/facilities/infocenter.html
WWWのしくみ
![Page 30: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/30.jpg)
‣ 自分のPCでWebページを見ているとき、何が起っているのか
1. Webブラウザは、アドレスからサーバの場所を探しだす‣ “http://www.geidai.ac.jp” の部分がこれに相当
WWWのしくみ
http://www.geidai.ac.jp
![Page 31: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/31.jpg)
‣ 自分のPCでWebページを見ているとき、何が起っているのか
2. アドレスの残りの部分から、サーバ内の該当データを特定• “/facilities/infocenter.html” の部分がこれに相当
WWWのしくみ
/facilities/infocenter.html
![Page 32: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/32.jpg)
WWWのしくみ‣ 自分のPCでWebページを見ているとき、何が起っているのか
3. Webページのデータをサーバから手元のPCに送信
![Page 33: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/33.jpg)
WWWのしくみ‣ 自分のPCでWebページを見ているとき、何が起っているのか
4. PC側で受信した情報から、Webページを生成し表示
![Page 34: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/34.jpg)
WWWを支える3つの仕組み‣ URI (もしくは URL)‣ Uniform Resource Identifier‣ ネットワーク上の情報を一意に特定するアドレス指定方法
‣ HTTP‣ HyperText Transfer Protocol‣ コンピュータ同士が情報をやりとりするルール
‣ HTML‣ HyperText Markup Language‣ 環境にかかわりなくWWWを記述するための文書記述言語
![Page 35: インターネットの歴史とWWWの成立 - CUC Web表現1](https://reader033.vdocuments.pub/reader033/viewer/2022052223/5582fcdfd8b42a2c168b51fd/html5/thumbnails/35.jpg)
WWWのしくみ‣ 先ほどの例でいうと‣ 3つのしくみ(URI, HTTP, HTML) について理解する
HTTP
HTTP
HTML
http://www.idd.tamabi.ac.jp/art/index.phpURI