授業内容・計画(詳細)の情報


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

【基本情報】
2018年度 春学期  
授業科目名 WEBクリエイション入門
曜日 時限 木-2
テーマ Webデザインの技術と表現の基礎
キーワード HTML CSS Webデザイン


【授業要旨または授業概要】
インターネットの普及により、個人が手軽にWebサイトを公開し、情報を発信できるようになりました。Web ページを利用して情報発信するためには、見やすくて分かりやすいWebページをデザインする知識や技術を身に付けておくことが大切です。
このようなWebページをデザインする際に、基本的な技術である「HTML」と「CSS」を用います。HTMLはWebページの文書構造を指定する。一方、CSSはWebページの見た目(スタイル)を指定します。
この授業では、下図のような教材を使ってHTMLとCSSの初歩を学びながら、実際に自分のオリジナルWebページ(My Webpage)を制作します。また、「Webデザイン」のテーマでインターネット、著作権などの基礎知識ならびに表現についても学習します。授業の後半では、DreamweaverというWebページ作成ソフトウェアを紹介します。
この授業で育成する力、スキルは「自ら考える力」、「情報リテラシー力(情報技術の基礎力)」および「情報発信するための創造力・表現力」です。

 


【学修の到達目標】
①インターネット、Web、情報セキュリティや著作権などについて理解する。[情報リテラシー力]
②HTML5やCSS3を理解し、Webページを作成できる。[情報リテラシー力]
③Webデザインによる情報発信の考え方や表現を習得する。「自ら考える力」「情報発信するための創造力・表現力」
上記の学習内容および評価基準の詳細については、別紙「成績評価基準」参照。
添付ファイル:評価基準_Webクリエイション入門2018 .pdf

【授業計画】
◆スケジュール
■第1回
ガイダンスおよびインターネットとWebページの仕組みなどについて概説する。
■第2回
HTMLの基礎:見出し・段落・箇条書きなどの文書構造を解説し、文字中心のWebページを制作する。
Webデザイン:Webページ制作の流れを解説する。
■第3回
HTMLの基礎:表組について解説し、テーブル(表)を使ったWebページを制作する。
Webデザイン:Webページ制作のための情報の収集と編集について解説する。
■第4回
HTMLの基礎:画像のリンクを解説し、画像を使ったWebページを制作する。
Webデザイン:画像を加工し、Webページに配置する。
■第5回
HTMLの基礎:Webページのリンクについて解説し、Webページをリンクさせる。
Webデザイン:Webページの制作に関連する著作権・引用などについて解説する。
■第6回
Webデザイン:My Webpage(HTML版)の制作。WinSCP というftpソフトを使ってHTMLファイルをWebサーバーにアップロードする。
■第7回
Webデザイン:My Webpage(HTML版)の発表・相互評価・講評・表彰など。
CSSの基礎:CSSの役割や仕組みについて概説する。
■第8回
CSSの基礎:文字、色をCSSで指定する。またボックスについて解説する。
Webデザイン:Webページの表現について解説する。
■第9回
CSSの基礎:画像、背景、テキストの回り込みなどをCSSで指定する。
Webデザイン: Dreamweaver(Webページ作成ソフト)を紹介する。
■第10回
CSSの基礎:テーブル、クラスセレクタ、IDセレクタなどをCSSで指定する。
Webデザイン:Webインタフェース①
■第11回
CSSの基礎:ボックスのグループ化について解説し、Webページをレイアウトする。
Webデザイン:Webインタフェース②
■第12回 CSSの基礎:疑似クラスについて解説し、ナビゲーションをデザインする。
Webデザイン:My Webpage(CSS版)の制作。
■第13回
Webデザイン:My Webpage(CSS版)の制作およびアップロード。
■第14回
My Webpage(CSS版)の発表・相互評価・講評・表彰、および授業全体のまとめ。
◆予習・復習
■第1回 ガイダンスおよびインターネットとWebページの概説。
事前学習:シラバスを確認すること。
事後学習:My Webpageの制作を目的としたWebデザイン課題1「My Webpageテーマと概要」およびWebデザイン課題2「情報の収集と編集」をそれぞれの締切日までに授業支援システムで提出する。
■第2回 HTMLの基礎(文字中心のWebページ)
事前学習:授業前に配布する「第2回配布教材」を予習しておく。
事後学習:HTML課題1「文字中心のWebページ」を完成させ、授業支援システムで提出する。
■第3回 HTMLの基礎(テーブルの制作)
事前学習:事前に配布する「第3回配布教材」を予習しておく。
事後学習:HTML課題2「テーブルを使ったWebページ」を完成させ、授業支援システムで提出する。 
■第4回 HTMLの基礎(画像の配置)およびWebデザイン(画像の加工)
事前学習:授業前に配布する「第4回配布教材」を予習しておく。
事後学習:HTML課題3「画像の配置」を完成させる。またWebデザイン課題3「画像の加工」を授業支援システムで提出する。
■第5回 HTMLの基礎(ページリンク)およびWebデザイン(My Webpageの制作、著作権)
事前学習: 授業前に配布する「第5回配布教材」を予習しておく。
事後学習: HTML課題4「ページリンクの設定とHTMLファイルのアップロード」に従って教材「湘南UFO研究会(HTML版)」のサイトを完成させる。また著作権に配慮して、Webデザイン課題4「My Webpage(HTML版)の制作」を進め、次週の質問事項を列挙しておく。
■第6回 Webデザイン(HTMLファイルのアップロードおよびMy Webpageの制作)
事前学習:授業前に配布する「第6回配布教材」を予習しておく。
事後学習:発表に備えてWebデザイン課題4「My Webpage(HTML版)の制作」を完成させ、HTMLファイルを授業用Webサーバーへアップロードしておく。
■第7回 Webデザイン(My Webpage(HTML版)の発表会)およびCSSの基礎
事前学習:授業前に配布する「第7回配布教材」を予習しておく。
事後学習: 発表会の相互評価・講評を参考にMy Webpage(HTML版)を見直す。
■第8回 CSSの基礎(文字、色の指定およびボックス)
事前学習:授業前に配布する「第8回配布教材」を予習しておく。
事後学習:CSS課題1「文字のスタイル」およびCSS課題2「ボックスのCSS指定」を完成させ、授業支援システムで提出する。
■第9回 CSSの基礎(画像、背景など)およびWebデザイン(Webページの表現)
事前学習:授業前に配布する「第9回配布教材」を予習しておく。
事後学習: CSS課題3「テキストの回り込みのCSS指定」を完成させ、授業支援システムで提出する。
■第10回 CSSの基礎(テーブル、クラスセレクタなど)およびWebデザイン(Webインタフェース)
事前学習:授業前に配布する「第10回配布教材」を予習しておく。
事後学習:CSS課題4「クラスセレクタのCSS設定」を完成させ、授業支援システムで提出する。
■第11回 CSSの基礎(ページレイアウトなど)およびWebインタフェース
事前学習:授業前に配布する「第11回配布教材」を予習しておく。
事後学習:ページレイアウトを工夫して My Webpage(CSS版)の制作を進める。
■第12回 CSSの基礎(ナビゲーションなど)
事前学習:授業前に配布する「第12回配布教材」を予習しておく。
事後学習:ナビゲーションを工夫してMy Webpage(CSS版)の制作を進める。
■第13回 Webデザイン(My Webpage(CSS版)の制作)
事前学習:My Webpage(CSS版)の制作を進め、次週の質問事項を列挙しておく。
事後学習: Webデザイン課題5「My Webpage(CSS版)の制作」を完成させ、HTMLファイルとCSSファイルを授業用Webサーバーへアップロードしておく。
■第14回 My Webpage(CSS版)の発表会および授業全体のまとめ
事前学習:Webページのリンクや動作などを確認しておく。
事後学習:発表会の相互評価・講評を参考にMy Webpage(CSS版)を見直す。この授業の目標、学んだ知識・技術、応用分野などを復習する。
◆集中授業の期間
 

【履修上の注意点】
先修条件はありません。
履修者の授業内容の理解度・到達度によって、スケジュールが変わることがあります。
定員オーバーの場合は初回ガイダンスで抽選(遅れてきた学生は次週の抽選)。
My Webpageの制作には、授業時間だけでは足りないので、充分に自習時間をとってください。
データ保存のために、外部メモリ(USBメモリなど)を用意してください。

【成績評価の基準および方法】
成績評価は、授業内課題(合計100%)で評価します。 
課題の評価基準の詳細については、別紙「成績評価基準」参照。
ただし、2/3以上の出席がない場合には成績評価の対象としません。
到達度90%以上でS,80%以上でA、70%以上でB、60%以上でC、60%未満をEとします。


【教科書・参考書】
区分 書名 著者名 発行元 定価
参考書 ICT入門 東海大学 技術支援課 780円
参考書 入門Webデザイン 若林 尚樹・他 CG-ARTS協会 2700円


【その他の教材】
Webデザインの基礎および課題の説明などを記した教材(PDF)を授業支援システムで毎週配布します。ファイルの数が多いので、USBメモリなどに整理・保存してください。


【担当教員への連絡方法】
電子メールで受け付けます。アドレス:mhirokawa@tokai-u.jp
メールには【件名】に「講義名」「質問内容の要旨」,【本文】に質問者の「学番」「氏
名」「質問内容」を記載してください。

PAGE TOP