Web20年の歴史～ITは社会にどう応えてきたか？～

Size: px

Start display at page:

Download "Web20年の歴史～ITは社会にどう応えてきたか？～"

うまじことじ
4 years ago
Views:

1 Web20 年の歴史 ~ 社会に IT はどう応えてきたか?~ 静岡理工科大学総合情報学部コンピュータシステム学科 ( 兼 Web デザイン特別プログラム ) 幸谷智紀 ( こうやとものり ) tkouya@cs.sist.ac.jp キーワードは三つ! デジタル化 (=IT(Information Technology, 情報技術 ) 化 ) 情報データのデジタルデータ ( ビット列 ) 化作業手順のプログラムソフトウェア化オープン化情報の開示 ( 要求 & 欲求 ) 情報への自由な接触 ( フリーアクセス ) パーソナル化 ( 新旧で意味が変化 ) (IT) 環境の個人の嗜好への対応 (IT) サービスの個人 ( あなた ) 別の特化個人活動の自由化影響度増大結論 : Web20 年の歴史は, この三つの社会要求に応えた結果である! 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 2 静岡理工科大学 2010 年度前期公開講座 1

2 概要 I. [ 現在 ] Webという技術 II. [ 過去 ] InternetとWebの歴史 III. [ 未来 ] Web 技術からWeb 社会へにて公開参考文献 & 使用ソフト : Wikipedia の画像 (Public Domain) PowerPoint + Visio( 作成画像は全てこれを使用 ) 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 3 I.[ 現在 ] Web という技術静岡理工科大学 2010 年度前期公開講座 2

Web = Web ページ + 通信システム http://www.sist.ac.jp /~tkouya/index.

3 Web = Web ページ + 通信システム /~tkouya/index.html Web ページ ( = ホームページ ) を作るための技術 HTML, CSS, JavaScript Web ページを送り出すための通信システム Web サーバ送り出し (Web) ブラウザ取り出し & 表示 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 5 Web とはどんな技術か? 1 ブラウザから URI(URL) を指定 2Web サーバが指定されたファイルを読み出しヘッダ + ファイルの中身をブラウザに向けて送信 3 受け取った内容に応じてブラウザが Web ページを表示 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 6 静岡理工科大学 2010 年度前期公開講座 3

4 Web は社会のインターフェース ( 境界面 ) 特徴 Web サーバは 24 時間常時動作いつでもどんなユーザの要求に応えられる広報したい側と情報を取得したいユーザ側とのインターフェース! 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 7 Web を構築するためには 1. Webサーバマシン+Webサーバソフトを設定し, インターネットに向けて公開できるようにするネットワーク ( システム ) エンジニアのお仕事 2. Webページを作成し,Webサーバの指定フォルダに転送して公開 Webデザイナー 3. Webサーバ上で動作するアプリケーション (Webアプリ) を作成して公開データベースエンジニア, プログラマー Web 2.0 Web 1.0 作業が高度化分業体制で構築 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 8 静岡理工科大学 2010 年度前期公開講座 4

静岡理工科大学 2010 年度前期公開講座 9 HTML + CSS の例 CSS 指定なし ~CSS で指定したもの ~ タイトル, 見出しに黒のアンダーライン行間隔を広めに取るアドレス ( 連絡先

5 Web ページの構成 = HTML( 構造 ) + CSS( 視覚デザイン ) HTML タグによる Web ページの構造指定 < タグ > </ タグ > CSS( スタイルシート ) Web ページの視覚デザインの指定タグ単位での文字色背景色枠線指定等特定グループ (class) 付きタグの指定個別名 (id) 付きタグの指定 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 9 HTML + CSS の例 CSS 指定なし ~CSS で指定したもの ~ タイトル, 見出しに黒のアンダーライン行間隔を広めに取るアドレス ( 連絡先 ) は黒枠で囲み, フォント ( 文字形式 ) は通常のものを使用 CSS 指定あり 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 10 静岡理工科大学 2010 年度前期公開講座 5

6 [ 宣伝 ] Web デザイン特別プログラム第一期生の作品例 2 年生 11 名 ( 本年度は 21 名 ) 総合情報学部教員 5 名 + 平松和可子先生による指導 Web ページ作成 +Web アプリ作成 + 心理評価産学連携のテーマ募集中! お問い合わせ先へ 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 11 II.[ 過去 ] Internet と Web の歴史静岡理工科大学 2010 年度前期公開講座 6

7 歴史の大まかな流れ 1ENIAC の誕生 3 1 チップ CPU の誕生 4 ダウンサイジングの時代 6Windows95 の発売インターネットブーム加速 2ARPAnet の誕生インターネットへ 5 Web の誕生 7Web 2.0 クラウドコンピューティングの時代へ 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 13 1ENIAC の誕生 (1946 年 ) 世界初ではないが, 一番有名になった初期コンピュータ (Newsweek 誌で全世界に報道される ) ノイマン型コンピュータの原型現在のコンピュータの元祖 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 14 静岡理工科大学 2010 年度前期公開講座 7

8 デジタル回路 ( ハードウェア ) コンピュータの基本 (1/1) 処理手順はプログラム ( ソフトウェア ) として読み込ませるコンピュータ内部で処理されるデータは全て, ビット列 (2 進数 ) で表現される 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 15 コンピュータの基本 (2/2) コンピュータの処理速度周波数ビット数 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 16 静岡理工科大学 2010 年度前期公開講座 8

9 テキスト ( 文字 ) < 画像 << 動画テキスト ( 文字 ) : 1 文字 = 21 ビット (UNICODE) 静止画像 (24 ビットフルカラー ) と動画単純計算では静止画像一枚 120 万文字新聞 1 紙 ( 約 40 万文字 ) 3 データ量はテキスト < 画像 << 動画の順で増加コンピュータ処理能力大画像動画処理が可能 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 17 2ARPAnet の誕生 (1969 年 ) 電話 = 音声通信網コンピュータネットワーク = コンピュータ同士を回線で結ぶ 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 18 静岡理工科大学 2010 年度前期公開講座 9

10 ハワイ大学 1977 年 3 月の ARPAnet 接続図ハーバード大学 UCLA 国防総省 ( ペンタゴン ) ワークステーション (WS) を遠距離通信で接続した分散型コンピュータネットワーク 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 19 ARPAnet インターネット (The Internet) 研究目的 : 核攻撃にも耐えられる分散型コンピュータネットワークの研究開発特徴 : 接続されたコンピュータは対等に通信できる ( 早い者勝ちの側面も ) 中型小型コンピュータ ( ワークステーション, WS) が主役ダウンサイジングのハシリハードウェアとアプリケーションとの仲立ちをする基本ソフトウェアの開発 UNIX MS-DOS, Windows, MacOS へネットワーク上で提供されるサービス (+ プロトコル ) メッセージの共有メール ( ),news ファイル ( デジタルデータの固まり ) FTP Web へ 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 20 静岡理工科大学 2010 年度前期公開講座 10

11 31 チップ CPU の誕生 (1971 年 ) 電卓戦争低コスト化製品開発期間の短縮 Intel 社が i4004 を開発 4 ビット,0.1MHz 高速化が容易パソコンの登場 MHz ビット Pentium 16ビット Pentium IV Pentium III Pentium II Pentium Pro 64ビット Pentium D Core 2 Duo (64 ビット 4 ビット ) (3300MHz 0.1MHz) = 52.8 万倍! Year 4ビット 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 21 4 ダウンサイジングの時代 (1980 年代 ) ダウンサイジング (downsizing) = 大型コンピュータパソコン 1 チップ CPU の高性能化パソコン ( パーソナルに所持可能なコンピュータ,PC) の誕生海外 : IBM PC/AT とその互換機 (PC/AT コンパチ ) 日本 : NEC PC-8001 PC-9801 シリーズの成功 1990 年代に入って,PC/AT コンパチマシンにシェアを奪われる DOS/V = MS-DOS + 画像による日本語表示機能マイクロソフトの創業と発展パソコンの使い勝手を良くする基本ソフトウェア ( オペレーティングシステム, OS) の開発販売 IBM PC-DOS, MS-DOS Windows 3.1 Windows 95 Windows 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 22 静岡理工科大学 2010 年度前期公開講座 11

12 LAN の流行 (1980 年代後半から ) 組織内コンピュータネットワーク (LAN) 遠距離通信網で LAN 同士を接続してインターネットに発展 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 23 5Web の誕生 (1990 年 ) CERN( スイスの国際研究機関 ) において, T.Berners-Lee による提案情報を公開し, 共有できるシステムを! = World Wide Web(WWW) ハイパーテキスト = テキスト + 画像 + リンク HTML = HyperText Markup Language( ハイパーテキスト作成のためのコンピュータ言語 ) 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 24 静岡理工科大学 2010 年度前期公開講座 12

直感的に使いやすい Web の流行 GUI OS の普及インターネットブーム到来 MS-DOS ( テキストベース,CUI) Windows 95 ( 画像ベース, GUI) 大小インターネットプロバイダの出現

13 Web = Web ページ + Web サーバ HTML によるテキスト + 画像の一体表示 = デジタル化の進展データの共有 = オープン化個人が見たいモノを見たい時に見られる = パーソナル化 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 25 6Windows95 の発売 (1995 年 ) CUI ( コマンドプロンプト ) 使いにくい GUI (Windows XP) 直感的に使いやすい Web の流行 GUI OS の普及インターネットブーム到来 MS-DOS ( テキストベース,CUI) Windows 95 ( 画像ベース, GUI) 大小インターネットプロバイダの出現価格競争激化 1990 年代後半, 個人会社等で Web ページ作成が流行 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 26 静岡理工科大学 2010 年度前期公開講座 13

14 静岡理工科大学の Web ページの変遷 (1/2) 1996 年 ( 左 ) 1997 年 ( 中 ) 1999 年 ( 右 ) 重くならない ( テキスト中心画像を使わない ) 工夫 ( それにしても手抜きっぽい ) 2000 年でデザインの改善が図られるまだ職員学生による手作業で保守されていた 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 27 静岡理工科大学の Web ページの変遷 (2/2) 2004 年 ( 左 ) 2006 年 ( 中 ) 2007 年 ( 右 ) デザイン重視路線に転換広報媒体としての重要性が認知本職 Web デザイナーによる凝った & 使いやすい Web ページへ 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 28 静岡理工科大学 2010 年度前期公開講座 14

15 7 Web 2.0 クラウドコンピューティングの時代へ (2000 年代 ~) Web ページの爆発的な増加検索サービスの要求高まるサーチエンジン : Yahoo! Google Google の成功理由シンプルなインターフェース ( 検索キーワード一行 ) 検索結果の人気順 (PageRank ) の出力プログラムによる自動 Web ページ収集膨大な Web ページデータを格納検索する PC クラスタ技術の蓄積クラウドコンピューティングの基盤 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 29 クラウドコンピューティングとは? SIST-NET NIS Domain: cs-pccluster3 11 nodes GbE PC Cluster 1000BASE-SW 1000BASE-SW cs-room443-d Cs-pccluster3 NIS/NFS /home /usr/local cs-room443-d02cs-room443-d03 cs-room443-d cs-room443-d05 cs-room443-d cs-room443-d07cs-room443-d08 cs-room443-d cs-room443-d10 Cs-room443-d LAN 接続されたパソコンを一台のマシンとして集中的に使用する形態 =PC クラスタ大規模な PC クラスタクラウドコンピューティングの実体長所 : 安上がり ( 家電量販店で扱っている普通のパソコンとネットワーク機器 ) 短所 : 部分的には脆弱大量の PC を効率よく動かす技術ノウハウが不可欠 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 30 静岡理工科大学 2010 年度前期公開講座 15

16 音楽配信動画サービスの登場音楽配信 itunes, 着うた動画サービス YouTube, ニコニコ動画生中継 Ustream, ニコニコ生放送 2010 年 6 月 13 日 ( 日 ) 小惑星探査衛星はやぶさ地球到着生放送約 20 万人の視聴者 ( テレビと違って確実に視聴している ) 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 31 III.[ 未来 ] Web 技術から Web 社会へ静岡理工科大学 2010 年度前期公開講座 16

17 デジタル化の進展あらゆる分野で, 情報のデジタル化が進展中音楽 itunes(apple) や着うた ( ケータイ各社 ) での配信の増加 CD 売り上げの激減 ( 不正コピーの影響も ) 書籍活版デジタル製版オンデマンド製本 Google による全世界の本の電子化既に着手, 公開を待つのみ ( 著作権者からのクレームで公開は中断 ) 国立国会図書館電子本への対応 ( 受け入れと貸し出し ) 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 33 オープン化の進展 (1/2) 情報のオープン化無料 or 格安で情報が Web 上で公開される既存メディア ( 新聞, 雑誌, テレビ, ラジオ ) の凋落某大新聞社赤字転落雑誌相次ぐ休刊 ( 実質廃刊 ) Web マガジンへテレビ番組の経費節減 : 大物タレント局アナラジオ : サイマル放送の開始全国展開? 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 34 静岡理工科大学 2010 年度前期公開講座 17

18 オープン化の進展 (2/2) 広告費の移り変わり ( 電通調べ ) 億円広告費の推移日本の広告費の推移 ( 既存メディア vs. インターネット ) 億円総広告費 ( 億円 ) 新聞新聞雑誌雑誌ラジオラジオテレビテレビ衛星メディア衛星メディア 0 インターネット 0 プロモーションメディアインターネット年年年年年年年年年年年度年度ついにインターネット広告が新聞広告を抜く! 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 35 パーソナル化の持つ意味の変化 ( 古 ) パーソナル化サービスを個人に特化する ( 新 ) パーソナル化 Web 上での情報公開能力を武器に, すごい個人 (by 宮台慎司 ) が大手マスメディアを上回る影響力を発揮する (= フラット化 by 佐々木俊尚 ) アルファブロガーの誕生作家単位で出版社合同フェア食える個人 ( 同人 ) 作家ミュージシャンの活躍 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 36 静岡理工科大学 2010 年度前期公開講座 18

19 結論 Web20 年の歴史は, デジタル化オープン化パーソナル化の社会要求に応えた結果である! 現在進行形で,Web はこの 3 つの社会的要求に応えている = Web 社会へ Web で見られるデジタル情報 vs. デジタル化できないモノ 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 37 ご静聴ありがとうございました! 2010 年 6 月 19 日 ( 土 ) 静岡理工科大学 2010 年度前期公開講座 38 静岡理工科大学 2010 年度前期公開講座 19

高性能計算研究室の紹介 High Performance Computing Lab.

高性能計算研究室の紹介 High Performance Computing Lab. 高性能計算研究室 (HPC Lab) の紹介 High Performance Computing Lab. 静岡理工科大学総合情報学部コンピュータシステム学科 ( 兼 Web デザイン特別プログラム ) 幸谷智紀 http://na-inet.jp/ 概要 1. 幸谷智紀個人の研究テーマ 2. 3 年生ゼミ ( 情報セミナー II) 3. 卒研テーマ 4. Webデザイン特別プログラム 5. 今後について

Web20年の歴史 ～ITは社会にどう応えてきたか？～

Web20年の歴史～ITは社会にどう応えてきたか？～