1
Webページプログラミング
Dr. Anna Yamaguchi
Course URL:
2
工学博士：東京都立大学大学院（現首都大学東京）工学研究科 電気工学博士号
“Internet Packet Loss Recovery Using Convolutional Codes and Its Application for Multicast” 畳み込み符号化をパケットレベルで適用し、 パケット損回復を行う手法 ユニキャスト通信、マルチキャスト通信へ 適応した場合の回復能力及び性能評価 ポーランド国立ヤギェウォ大学 数学修士 （ダブルメージャーで東洋学部日本学科 に在籍） 東欧のポーランド出身。日本に来て今年で25年になります。 職歴 株式会社 ＣＳＫ ソフトウェア開発 桜美林大学 オープン・カレッジ ポーランド語とロシア語講師 国立東京外国語大学 ロシア東欧学科 ポーランド語 非常勤講師 東京都立大学大学院 工学研究科 客員研究員 慶應義塾大学 理工学部、情報工学科 助手 現在: 玉川大学工学部メディアネットワーク学科 非常勤講師 桜美林大学 言語コミュニケーション学科 非常勤講師 オープンカレッジ ポーランド語講師
Dr. Anna Yamaguchi
学期末には理解して頂けると思います☺ 古都クラクフにあるポーランド最古の大学です。 コペルニクスなども卒業生。授業計画
Webサイトとは？ インターネットとWWW HTMLとCSSの基礎構造と応用の方法 JavaScriptを使用したWEB上の動作 （教科書とは別に教材を配ります。） FTPを使ったWEBページのアップロード 3自分の
Webサイト作成
ルールとお願い
Rule 「自己努力」 分からないことはそのままに しない。 →自分で調べる、聞く！ 自習- 予習・復習 休んだから分かりません、 は禁句です。Request for students
私の母語は日本語ではありません。 説明がわかりにくいときには授業中 に私かTAに質問してください。 また、理解が足りない部分があると 感じたら気軽にメールで質問してく ださい。 質問は日本語でも英語でも構いません。 （ポーランド語・ロシア語も可☺） email:
[email protected]
45
Today’s plan – 9/19
授業計画・コースの目標など
Webサイト作成の基礎知識
インターネットとWWW WebサイトとWebページと HTML/CSS/JavaScript 教科書：12p.～24p. 本日教科書の無い学生は次の授業までに必ず準備してくださいObjectives
–目標- HTML/CSS/JavaScriptを理解すること。 このコースで習得したWEB制作の知識をベー スにして自らWEBサイトを作成するスキルを 身に着けること。 いまから自分が作るサイトのテーマを考えておいて下さい。 自分のWEBサイトをアピールするプレゼンテ ーションをしてもらいます。 6 ★短期間で出来る限り多くの知識を習得してもらいたいと思います。 授業を効率よく進めるためにも学生一人ひとりの努力が大切です。評価方法
7 成績 10% 40% 25% 25% 授業態度 積極性など Webページ 制作 授業課題 各授業における取り組み HTML/CSS 技術習得度 制作発表 プレゼン 各授業での進行具合、Webプログラミング技術の習得度と 学期末のプレゼンテーションを主に評価します。授業の
Webページ
http://www2.obirin.ac.jp/annay/
課題・授業内容やその補足などを毎週授業のホ ームページにアップロードします。 ※毎週チェックするように！ 8Webサイトとは
World Wide Web上でひとつのドメイン名の
下にあるWebページの集まりがWebサイト 9 Webサイト Webページ(main) Webページ(sub) Webページ(sub) Webページ(sub)
インターネットアプリケーション
インターネットを介して利用できるソフトウェアの サービス、アプリケーション。 10 ネットワークを介さない、ローカルのコンピュータのみで動作するソフトウェアや アプリケーションをデスクトップアプリケーションもしくはスタンドアローンと呼ぶ。 引用：www.way-on.com.tw インターネットで利用される アプリケーション：World Wide Web
World Wide WebとInternet
WWWとはIP（インターネットプロトコル） にて用いられるアプリケーションである。 ※重要！ WWW ≠インターネット 複数のコンピュータが互いに情報をやりとりするしくみがネッ トワーク。個々のネットワーク同士を外のネットワークとつな いだものがインターネット。 インターネットアプリケーション email(SMTP)、ファイル転送(FTP)、チャット(IRC) World Wide Web(HTTP) など11
World Wide Webとは
World Wide Web は、マシンやソフトの違いを超え
て情報を共有するためのドキュメントシステムとし て誕生しました。 HTMLという言語を使うことによって、ハイパーリン クで文書同士をつなげることができ、文書の中に画 像などのデータをうめこめる。 12
World Wide Webとは（続）
World Wide Webとは、簡単に説明すると…
インターネットを通してWebページという
ドキュメント（文書ファイル）を共有する
ためのアプリケーションソフトです。
14
World Wide Web の誕生
WWWは、1989年に Tim Berners-Lee によっ て、スイスのCERN（欧州原子核研究機関）にて 各国に散らばっている研究者が瞬時に情報に アクセスできるように生み出された
。
１９９１年以降一般に復旧し、現在はインターネットでも最も 利用されているアプリケーションである。Webページを構成する言語
World Wide Web上で公開されるドキュメントがWeb ページと呼ばれる。 静的サイトの構築 HTML…「構造」 テキスト・リンク・画像などの構成 CSS（スタイルシート）…「装飾」 ページのデザイン・スタイルの構成 動的サイトの構築 JavaScriptなど…「動作」 ページに動きを与える要素 15
16
HTMLは国際言語？
WWWの基礎である文書同士をリンクさせるHyper-Text
や文字の書式、埋め込むファイル（画像など）の情報な どを定義する言語がHTML(Hyper-Text Markup Language)
「タグ」というコンピュータ言語を使用 タグの例 <p> </p> <br> <href> <name> ※タグは<>山カッコ の中に書きます
WebブラウザとHTML
私たちがウェブページを見るため のツールがウェブブラウザです。 17 （上）HTMLソースで書かれたWebページ （下）ブラウザで表 示されたWebページHTML文書を開いてみましょう
Internet Explorer 11（IE11）では、
［右クリック］－［ソースの表示］
Fire Fox: [Web開発] - [開発ツールを表示]
Chrome: [右クリック] - [ページのソースを表示]
マークアップ方式とタグ
開始タグ ＜XXX＞ と 終了タグ ＜/XXX＞
で要素をマークアップするのがHTMLのマーク
アップ方式である。
Web Page Programming
Webサイトの基礎知識インターネットとWWW Webサイト制作の基本と流れ HTML HTMLの役割と記述方法 HTMLを使い基本的なWEBページ制作 CSS スタイルシートの役割と記述方法 スタイルシートを使ったWEBデザイン JavaScript オブジェクト指向プログラミングとは JavaScriptを使った動的なWEBサイト構築 FTP ファイル転送と制作したWEBサイトのアップロード Presentation 20NEXT WEEK～
Webページの基本 なぜHTML/CSSと分けて使うのか HTMLとタグの基礎 Webページのデザイン・レイアウトを指定す るCSS（スタイルシート）とはなにか？ 予習：教科書 25p.~45p. 21Today’s KEY WORDS
Webページ
Webサイト
World Wide Web
アプリケーション ドキュメントシステム ハイパーリンク HTML (Hyper-text Markup Languge) タグ ＜ ＞ ヤマカッコ ブラウザ HTMLソース マークアップ方式 22
