ホームページ作成技法

Size: px

Start display at page:

Download "ホームページ作成技法"

たいちかつま
5 years ago
Views:

1 Web ページプログラミング Dr. Anna Yamaguchi Course URL: 1

dr. Anna Yamaguchi 工学博士 : 東京都立大学大学院 ( 現首都大学東京 ) 工学研究科電気工学博士号 Internet Packet Loss

パケット損回復を行う手法ユニキャスト通信マルチキャスト通信へ適応した場合の回復能力及び性能評価学期末には理解して頂けると思いますポーランド国立ヤギェウォ大学数学修士 (

2 dr. Anna Yamaguchi 工学博士 : 東京都立大学大学院 ( 現首都大学東京 ) 工学研究科電気工学博士号 Internet Packet Loss Recovery Using Convolutional Codes and Its Application for Multicast 畳み込み符号化をパケットレベルで適用しパケット損回復を行う手法ユニキャスト通信マルチキャスト通信へ適応した場合の回復能力及び性能評価学期末には理解して頂けると思いますポーランド国立ヤギェウォ大学数学修士 ( ダブルメージャーで東洋学部日本学科に在籍 ) 東欧のポーランド出身日本に来て今年で 26 年になります古都クラクフにあるポーランド最古の大学ですコペルニクスなども卒業生職歴株式会社 CSK ソフトウェア開発桜美林大学オープンカレッジポーランド語とロシア語講師国立東京外国語大学ロシア東欧学科ポーランド語非常勤講師東京都立大学大学院工学研究科客員研究員慶應義塾大学理工学部情報工学科助手現在 : 玉川大学工学部メディアネットワーク学科非常勤講師桜美林大学言語コミュニケーション学科非常勤講師オープンカレッジポーランド語講師 2

3 授業計画 Webサイトとは? インターネットとWWW HTMLとCSSの基礎構造と応用の方法 JavaScriptを使用したWEB 上の動作 ( 教科書とは別に教材を配ります ) FTP を使った WEB ページのアップロード自分の Web サイト作成 3

4 ルールとお願い Rule 自己努力分からないことはそのままにしない自分で調べる聞く! 自習 - 予習復習休んだから分かりませんは禁句です Request for students 私の母語は日本語ではありません説明がわかりにくいときには授業中に私か TA に質問してくださいまた理解が足りない部分があると感じたら気軽にメールで質問してください質問は日本語でも英語でも構いません ( ポーランド語ロシア語, ドイツ語も可 ) annay@obirin.ac.jp 4

5 Objectives 目標 - HTML/CSS/JavaScript を理解することこのコースで習得した WEB 制作の知識をベースにして自ら WEB サイトを作成するスキルを身に着けることいまから自分が作るサイトのテーマを考えておいて下さい自分の WEB サイトをアピールするプレゼンテーションをしてもらいます短期間で出来る限り多くの知識を習得してもらいたいと思います授業を効率よく進めるためにも学生一人ひとりの努力が大切です 5

6 評価方法成績授業課題各授業における取り組み授業態度積極性など Web ページ制作 HTML/CSS 技術習得度制作発表プレゼン 10% 40% 25% 25% 各授業での進行具合 Web プログラミング技術の習得度と学期末のプレゼンテーションを主に評価します 6

7 Textbook 速習 Web デザイン HTML & スタイルシート ISBN 定価 :2.480 円 + 税 7

8 授業の Web ページ課題授業内容やその補足などを毎週授業のホームページにアップロードします毎週チェックするように! 8

9 Web サイトとは World Wide Web 上でひとつのドメイン名の下にある Web ページの集まりが Web サイト Web サイト Web ページ (main) Web ページ (sub) Web ページ (sub) Web ページ (sub) 9

10 インターネットアプリケーションインターネットを介して利用できるソフトウェアのサービスアプリケーションネットワークを介さないローカルのコンピュータのみで動作するソフトウェアやアプリケーションをデスクトップアプリケーションもしくはスタンドアローンと呼ぶインターネットで利用されるアプリケーション : World Wide Web について学びます引用 : 10

11 World Wide Web と Internet WWW とは IP( インターネットプロトコル ) にて用いられるアプリケーションである重要! WWW インターネット複数のコンピュータが互いに情報をやりとりするしくみがネットワーク個々のネットワーク同士を外のネットワークとつないだものがインターネットインターネットアプリケーション (smtp) ファイル転送 (FTP) チャット (IRC) World Wide Web(HTTP) などでは WWW とはどのようなアプリケーションなのか 11

12 World Wide Web とは World Wide Web はマシンやソフトの違いを超えて情報を共有するためのドキュメントシステムとして誕生しました HTML という言語を使うことによってハイパーリンクで文書同士をつなげることができ文書の中に画像などのデータをうめこめる 12

13 World Wide Web とは ( 続 ) World Wide Web とは簡単に説明するとインターネットを通して Web ページというドキュメント ( 文書ファイル ) を共有するためのアプリケーションソフトです 13

14 World Wide Web の誕生 WWW は 1989 年に Tim Berners-Lee によってスイスの CERN( 欧州原子核研究機関 ) にて各国に散らばっている研究者が瞬時に情報にアクセスできるように生み出された 1991 年以降一般に普及現在はインターネットでも最も利用されているアプリケーションである 14

15 Web ページを構成する言語 World Wide Web 上で公開されるドキュメントが Web ページと呼ばれる静的サイトの構築 HTML 構造テキストリンク画像などの構成 CSS( スタイルシート ) 装飾ページのデザインスタイルの構成動的サイトの構築 JavaScript など動作ページに動きを与える要素 15

16 HTML は国際言語? WWW の基礎である文書同士をリンクさせる Hyper-Text や文字の書式埋め込むファイル ( 画像など ) の情報などを定義する言語が HTML(Hyper-Text Markup Language) タグというコンピュータ言語を使用タグの例 <p> </p> <br> <href> <name> タグは <> 山カッコの中に書きます 16

17 Web ブラウザと HTML 私たちがウェブページを見るためのツールがウェブブラウザです ( 下 ) ブラウザで表示された Web ページ上 )HTML ソースで書かれた Web ページ 17

18 HTML 文書を開いてみましょう Internet Explorer 11(IE11) では [ 右クリック ]-[ ソースの表示 ] Fire Fox: [Web 開発 ] - [ 開発ツールを表示 ] Chrome: [ 右クリック ] - [ ページのソースを表示 ] 18

19 マークアップ方式とタグ開始タグ <XXX> と終了タグ </XXX> で要素をマークアップするのが HTML のマークアップ方式である 19

スタイルシートの役割と記述方法スタイルシートを使った WEB デザイン JavaScript

20 Web Page Programming Web サイトの基礎知識インターネットと WWW Web サイト制作の基本と流れ HTML HTML の役割と記述方法 HTML を使い基本的な WEB ページ制作 CSS スタイルシートの役割と記述方法スタイルシートを使った WEB デザイン JavaScript オブジェクト指向プログラミングとは JavaScript を使った動的な WEB サイト構築 FTP ファイル転送と制作した WEB サイトのアップロード Presentation 20

21 NEXT WEEK~ Web ページの基本なぜ HTML/CSS と分けて使うのか HTML とタグの基礎 Web ページのデザインレイアウトを指定する CSS( スタイルシート ) とはなにか? 21

22 Today s KEY WORDS Webページ Webサイト World Wide Web アプリケーションドキュメントシステムハイパーリンク HTML (Hyper-text Markup Language) タグ < > ヤマカッコブラウザ HTML ソースマークアップ方式 22

H.W. 授業のウェブページに自宅でログインする http://www2.obirin.ac.

23 H.W. 授業のウェブページに自宅でログインする課題 1 教科書 : 27p. まで読む授業で制作する自分独自のホームページのテーマを考える 23

ホームページ作成技法

ホームページ作成技法 Webページプログラミング Dr. Anna Yamaguchi Course URL: http://www2.obirin.ac.jp/annay/ 1 Dr. Anna Yamaguchi 工学博士 : 東京都立大学大学院 ( 現首都大学東京 ) 工学研究科電気工学博士号 Internet Packet Loss Recovery Using