シラバス参照 |
年度 | 2023 |
---|---|
科目名 | Webデザイン応用 |
担当者名 | 甲斐 隆浩 |
単位 | 2 |
科目目的 Course Objectives |
基礎科目「Webデザイン基礎」の応用科目である。 Web制作の基礎知識を土台にして、CSSを利用した実践的なWebサイトの制作技術を学ぶ。Webサイト制作の実習を行い、サイトコンセプトに応じたWebページを効率よく構築する技法を学習する。これにより今日のWebサイトの仕組みを理解し、仕様に応じたWebサイトを構築する手法を習得する。 |
---|---|
到達目標 Class Goal |
Webサイトを効率よく制作できるようになる。 ユーザビリティ―と保守性を考慮した、CSSを活用したWebサイトを制作できるようになる。 JavaScriptを用いたインタラクティブな機能を、Webサイトに組み入れられるようになる。 パソコンとサーバーの役割の違いを知り、サーバー上でWebサイトを公開する仕組みが理解できるようになる。 |
授業内容 The Content of the Course |
前半はWebサイト制作例題にそって、Webサイトの制作手法と、CSSによる効率的なデザイン手法を中心に学ぶ。後半はWebサイト掲載用の写真編集、JavaScriptなどインタラクティブ要素の導入、CSSレイアウト機能とレスポンシブデザインについて実習する。 (※ライブ配信での遠隔授業に切り替わった場合には、自宅のパソコンにWebサイト制作ソフトをインストールして実習する。) |
授業計画 Class Plan |
対面15回 【対面】第1回 Webサイトの基礎知識の見なおし インターネットとWebサイト、Webサイト制作のながれ、等 基本的なWebページの制作 【対面】第2回 HTMLの基本とCSSの役割 文字の大きさ、フォント、文字色、等 【対面】第3回 CSSの基本 レイアウトとデザイン 基本的な書式の設定手法 【対面】第4回 画像素材の制作 PhotoShopなど画像編集ソフトを用いた基礎的な写真の編集 画像の表示とレイアウト、等 【対面】第5回 オリジナルのWebページ制作 [小課題1] 【対面】第6回 画像素材の活用 画像のレイアウト ロゴマーク、背景画像、等 【対面】第7回 リンクとナビゲーション サブページの効率的な制作とナビゲーション 詳細情報へのリンク 【対面】第8回 インデックスページの制作 トップページの役割 ページ専用スタイルの定義 【対面】第9回 オリジナルの基本構成Webサイト制作 [小課題2] 【対面】第10回 テーブル テーブルの基本デザイン 【対面】第11回 フォーム 投稿フォームの基本デザイン フォームでコードサービスの利用 【対面】第12回 Webサイトの公開 Webサーバの確認 FTPでのファイルアップロード 【対面】第13回 Java Scriptの基本 JavaScriptのWebページへの組込み 【対面】第14回 オリジナルWebサイトの制作(1回目) 【対面】第15回 オリジナルWebサイトの制作(2回目)[総合課題] |
授業方法 Class Method |
対面授業。制作技術の解説講義に基づき、パソコン実習教室でWebサイト制作を実習する。 コンピュータ実習を中心とした授業である。 学習内容をその場でコンピュータ上で実習し作品を制作する。 主にWebサイト制作ソフトを用いて制作を行う。(※ライブ配信での遠隔授業に切り替わった場合には、自宅のパソコンにWebサイト制作ソフトをインストールして実習する。) |
Google Classroom クラスコード Google Classroom - Class Code |
共通教育科目のクラスコードは、「共通教育サイト」に一覧掲示する。 抽選終了後、受講が決まった科目のクラスコードを確認しClassroomへ入室すること。 科目担当者からの招待は行わない。 「共通教育サイト」 https://kyotsu.mukogawa-u.ac.jp/index.html ◆Classroomへの参加登録の遅れや入室間違いは、教員からの指示が得られず課題等が未提出となる。それらが単位修得に係る評価に影響するので、十分に注意すること。 |
アクティブ・ラーニングの形態 Form of Active Learning |
パソコンでの制作実習 |
準備学習(予習・復習等) Review and Preview |
mwu.jpのClassroomにて、講義資料を配信する。 【予習】 Classroomに次回授業の予定を掲載する。関連範囲について参考書籍や参考サイトを閲覧し概要を把握すること。 【復習】 講義内容について模範作品を参考に、授業内で実習した作品を完成させること。 実習内で学んだキーワードについてネットなどを活用して見直しをすること。 実習内容をもとにオリジナル作品を制作して復習すること。 欠席した場合は次回までに、Classroomで配信している欠席回の資料をもとに自習しておくこと。 |
評価方法 Evaluation Method |
・平常点(100点) 平常点等配点内訳:実習作品の提出 30点(3点×10実習)、 小課題 40点(20点×2作品)、 総合課題 30点、 で評価する。 課題の提出締切は厳守すること。 何らかの事情がある場合は、速やかに担当者まで連絡すること。 |
課題(試験やレポート等)に対するフィードバックの方法 Task Feedback |
課題について評価後、授業中に解説を行う。 また必要に応じ個別の評価ポイントをmwu.jpのClassroomで配信する。 |
教科書 Textbook |
mwu.jpのClassroomで講義資料を配信する。 |
参考書 Reference Books |
よくわかる HTML5&CSS3ウェブサイト構築の基本と実践/FOM出版/富士通オフィス機器 世界一わかりやすいHTML&CSSコーディングとサイト制作の教科書/赤間 公太郎/技術評論社 できるポケット Web制作必携 HTML&CSS全事典/加藤善規/インプレス |
地域との連携 Cooperation with the Community |
|
受講上の注意 Notices |
パソコンでのファイルやフォルダーの基本的な操作ができること。 事前に基礎科目「Webデザイン基礎」を履修しておくことが望ましい。もしくは同程度の技能(HTML言語でWebページを作成した経験)を習得しておくこと。 【重要】 令和5年度より、受験資格制度は成績評価対象資格に変更となる。また、学修機会保障制度が始まる(授業公欠制度は廃止となる)。 ★「成績評価対象資格」:共通教育科目も、週1回開講科目は5回以上、週2回開講科目は9回以上欠席すると、成績評価対象資格を喪失し、成績評価が受けられなくなる。 ★「学修機会保障制度」:授業公欠制度は廃止され、新たに学修機会保障制度が始まる。 以上の2点については、Student-Guideを熟読しておくこと。 |
卒業(修了)認定・学位授与の方針との関連 Relation to the Diploma and Degree Policy |
|
実務経験と授業との関連 How the Instructors' Experiences will shape Course Contents |
概ね20年デザイン制作会社にて、広告やWebサイトの制作にあたる。Web制作の現状を踏まえたWeb技術の授業を行う。 |
教科書コメント |
シラバス参照 |