Webデザイン演習

講義概要

 Webデザインとは、単なる見かけのデザインだけを指すのではなく、優れたHPの内容全般を設計(デザイン)する事を意味する。
 本講義では魅力あるHPを目指し、WEBサイトを「自ら作るもの」としてとらえられるように既存サイトの背景・文法を紹介し、そこからWEBサイトにおける表現技法や制作技法を学ぶ。 また、この科目の習得によってインターネット上での自己表現やプレゼンテーション能力の向上を図る。

評価方法

2回の課題作成とレポート提出(企画書)により講義の理解度を判断するとともに,Webテストを含め総合評価とする

課題提示

 2017年10月6日 第一回課題制作テーマ決定、オリジナル写真収取、Webサイト用テンプレート活用

講義計画

  1. 第一講【授業の全体概要説明とDreamweaverについて】
  2. 第二講【画面構成とレイアウト (基礎レイアウト練習)】
  3. 第三講【Web全体の基礎知識/HTML(XHTML)の基本、Webページ作成の手順 Web設計と配色・バランス】
  4. 第四講【Webサイトの装飾・レイアウトの管理に有用なCSSの基礎知識 】
  5. 第五講【CSS 情報の意味構造と表現のデザイン(Dreamweaver基礎1)】
    • このサンプルをダウンロードしてください。実際の画像張替え、文字入れ替え演習を行います
    • 来週の中間発表に向けての作業
    • Dreamweverとの連携できる画像処理ソフト(文字デザイン)
  6. 第六講【課題制作(1)】 課題提出締め切りは11月9日18時!厳守!未提出者は成績評価しません
    • このサンプルをダウンロードしてください。(WEBテンプレート)
    • このサンプルをダウンロードしてください。(WEBテンプレート)
    • サンプルを使って実際の画像張替え、文字入れ替え演習を行います
    • ZIP形式でデータを下記掲示板へUPするか、USB持参で発表してもらいます
  7. 第七講 2017年 11/10(金)【第一回グループWebサイト発表会】
    • ●1時限クラス投稿掲示板  ID PASSは黒板を見るように
    • !(ZIP形式で投稿すること!(フォルダー名は漢字、カタカナは使用しないこと)
    • 作品のデータは、全て半角英数文字使用、ホルダーに入れて
    • 圧縮形式にして投稿する(10MB以内)
    • ●2時限クラス投稿掲示板  ID PASSは黒板を見るように!
    • (ZIP形式で投稿すること!)(フォルダー名は漢字、カタカナは使用しないこと)
    • 最終締め切りは11月9日18時でロックします!
    • 作品のデータは、全て半角英数文字使用、ホルダーに入れて
    • 圧縮形式にして投稿する(10MB以内)
    • 11/10に、1グループ。個人で1-2分程度でWebサイト内容の説明をしてもらいます
    • (投稿掲示板には、テーマ、学籍番号、作品内容、担当役割、工夫した点、見てもらいたいところなどを記述!)
  8. 第八講【課題制作2入ります。CSSとHTMLの連携】
    • 最終課題、単独制作、グループでの制作 
    • はじめてのCSS1 教材1
    • 後半 課題サイトのテーマ決定
    • 10種類のテンプレート!サンプルデータ  
  9. 第九講【HTML.CSSサイト構築)1】
  10. 第十講【HTML.CSSサイト構築 )2】
  11. 第十一講【動的なWebサイト構築】
    • サンプルを渡します
  12. 第十二講【HTML/CSS3/JQuery/JabaScript】
  13. 第十三講【最終課題作成日】
    • Phoshop講座その他
  14. 第十四講 最終課題〇月〇日発表会(圧縮ファイルは、ZIP形式10-15MB以内)(不要な画像データは削除すること!)  
    • 2017年 第二回課題 〇締め切り予定です!
    • 過去第二回課題 12/21締め切り!3時限クラス投稿掲示板  ID PASSは黒板を見るように!
    • 過去第二回課題 12/21締め切り 4時限クラス投稿掲示板  ID PASSは黒板を見るように!
    •  
    • *最終締め切り!は〇〇サーバは投稿は停止にします!
    • (ZIP形式で投稿すること!)(フォルダー名は漢字、カタカナは使用しないこと)
    • 作品のデータは、全て半角英数文字使用、ホルダーに入れて
    • 圧縮形式にして投稿する(15MB以内)
    • 〇〇に、1グループ。中間モニターで作品を提示します。発表
    • (テーマ、学籍番号、作品内容、担当役割、工夫した点、見てもらいたいところなど)
    • 同時期に Webclassテストを発表前に実施します。
  15. 第十五講 補足説明日    
    • 未定