授業内容・計画（詳細）の情報

ページを読み終えましたら、ブラウザを終了させてください。

【基本情報】

2018年度	秋学期

授業科目名	ＷＥＢクリエイション

曜日　時限	木-2

テーマ	ダイナミックコンテンツ

キーワード	WWW	ＪａｖａＳｃｒｉｐｔ	PHP

【授業要旨または授業概要】

HTML5への移行に伴い、JavaScriptの重要性が高まってきている。JavaScriptを利用する
ことにより、音声・動画をプラグインを扱ったり、スマートフォンに対応すサイトを作成
することができるようになる。さらに、JavaScrriptのライブラリである、jQueryを利用
することにより、ユーザビリティに優れたページを容易に作成することが、可能となって
きた。また、現在のWeb ページは最新の情報、充実した情報、閲覧者毎の情報発信を実現
するスクリプトを用いた動的なページの需要が高くなっています。動的なページは大きく
分けてクライアントサイドスクリプトとサーバサイドスクリプトがあり、どちらかもしく
は両方を使用することが可能です。この授業では、インタラクティブなＷｅｂコンテンツ
を作成するために必要となる基礎知識および技術の習得を目標とします。
具体的には、クライアントスクリプト型のスクリプト言語であるJavaScriptをコンピュー
タ実習を通して学びます。

授業で取り上げた内容については、応用課題を課します。

【学修の到達目標】

◆授業で育成する力スキル
全学共通：自ら考える力
センター：創造と表現力（情報技術の応用力）

 
 

◆学修の到達目標
(１）スクリプトを利用したダイナミックコンテンツの動作のしくみが理解できる。
　　　【自ら考える力】
（２）JavaScriptによる基本的なスクリプトを作成できる。
　　　【自ら考える力・創造と表現力】
（３）PHPによる基本的なスクリプトを作成できる。
　　　【自ら考える力・創造と表現力】

【授業計画】

◆スケジュール

第１回　ガイダンス
　　　（履修希望者が多い場合は、選抜試験を行うので必ず出席すること）
第２回　ＷＷＷに関する基礎知識・ダイナミックコンテンツ
第３回　音声・動画を取り込んだWebページの作成
第４回　HTML5,CSS3
第５回　JavaScriptの基礎１：記述ルール・オブジェクト・イベント
第６回　JavaScriptの基礎２：変数・配列
第７回　JavaScriptの基礎３：関数
第８回　JavaScriptの基礎４：条件分岐・繰り返し
第９回　スクリプト作成実習１
第１０回　JavaScriptの基礎５：フォームとの連携
第１１回　jQueryの基礎１
第１２回　jQueryの基礎2
第１３回　PHPの基礎1
第１４回　PHPの基礎2とスクリプト作成実習

なお、授業内容は、授業の進捗や学生が必要とする内容に応じて、修正することがあ
る。

◆予習・復習

◆毎回、課題を課す。次週までに課題の作成を含めて予習（2時間）復習（2時間）をすること。

第１回　ガイダンス
事前学習：シラバスを確認すること
事後学習：身の回りで使われているWEBやHTML・CSSを調べる。

2回　ＷＷＷに関する基礎知識・ダイナミックコンテンツ
事前学習：Ｗｅｂページ作成のHTML5とCSSを確認・調査する。
事後学習：ダイナミックコンテンツを作成するためのHTML5とCSS3の復習を行う。

3回　音声・動画を取り込んだWebページの作成
事前学習：CSS3による動画の表現手法を調べる。
事後学習：初めてのダイナミックコンテンツ作成から、マニュアルを見なくてもCSS3で作成できるようにする。

4回　HTML5,CSS3
事前学習：CSS3による洗練された表現とダイナミックコンテンツのデザインを調べる。
事後学習：数種類のダイナミックコンテンツ作成を、マニュアルを見なくてもできるようにする。

5回　JavaScriptの基礎１：記述ルール・オブジェクト・イベント
事前学習：JavaScriptによるデザインを調べる。
事後学習：記述ルール・オブジェクト・イベントの記述を、マニュアルを見なくてもできるようにする。

6回　JavaScriptの基礎２：変数・配列
事前学習：JavaScriptの変数・配列などによるデザインを調べる。
事後学習：JavaScriptの変数・配列などの記述を、マニュアルを見なくてもできるようにする。


7回　JavaScriptの基礎３：関数
事前学習：JavaScriptの関数によるデザインを調べる。
事後学習：JavaScriptの関数を活用する記述を、マニュアルを見なくてもできるようにする。

8回　JavaScriptの基礎４：条件分岐・繰り返し
事前学習：JavaScriptの条件分岐・繰り返しによるデザインを調べる。
事後学習：JavaScriptの条件分岐・繰り返しを活用する記述を、マニュアルを見なくてもできるようにする。

9回　スクリプト作成実習１
事前学習：JavaScriptを活用するコンテンツを考える。
事後学習：JavaScriptを活用するコンテンツの改良を考える。

10回　JavaScriptの基礎５：フォームとの連携
事前学習：JavaScriptのフォームとの連携を調査する。
事後学習：JavaScriptのフォームとの連携の改良を考える。
 
11回 jQueryの基礎１
事前学習：jQueryのデザインを調査する。
事後学習：jQueryを活用する記述を、マニュアルを見なくてもできるようにする。

12回 jQueryの基礎2
事前学習：jQueryの高度なデザインを調査する。
事後学習：jQueryの高度なデザインを活用する記述を、マニュアルを見なくてもできるようにする。

13回　PHPの基礎1
事前学習：PHPのデザインを調査する。
事後学習：PHPを活用する記述を、マニュアルを見なくてもできるようにする。
　
14回　PHPの基礎2とスクリプト作成実習
事前学習：PHPの条件分岐・繰り返しによるデザインを調べる。
事後学習：PHP条件分岐・繰り返しを活用する記述を、マニュアルを見なくてもできるようにする。
　　
なお、授業内容は、授業の進捗や学生が必要とする内容に応じて、修正することがあ
る。

◆集中授業の期間

【履修上の注意点】

プロになることができる技術であるので、自律的に技術の研鑽を積むと未来を開くこともできる。


授業を欠席した場合には、速やかに担当教員に必ず連絡をとること。
担当教員の指示のもと、講義資料を受け取り、次回の授業までに課題に取り組むこと。

【成績評価の基準および方法】

授業態度（20％）授業内課題およびスクリプト作成実習課題（80％）で評価をす
る。 
到達度90％以上でＳ，80％以上でＡ、70％以上でＢ、60％以上でＣ、60％未満を
Ｅとする。
ただし、２／３以上の出席がない場合には成績評価の対象としない。

【教科書・参考書】

区分	書名	著者名	発行元	定価
参考書	よくわかるHTML5+CSS3の教科書	大藤　幹	マイナビ	2800円

【その他の教材】

必要な資料は、授業中にプリントで配布するか、または、Ｗｅｂで公開します。

【担当教員への連絡方法】

質問は随時受け付けますので、授業終了時あるいはメール（miyachi@keyaki.cc.u-
tokai.ac.jp）で相談してください。

PAGE TOP