　　　　　

専門教育課程　経営情報学科

授業科目区分	科目名	単位数	科目コード	開講時期	履修方法
専門教育課程専門科目専門	Ｗｅｂデザイン Web Design	2	F102-01	2024年度１期（前学期）	修学規程第4条を参照

担当教員名
齋藤　正史＊

＊印は、実務経験のある教員を示しています。

授業科目の学習・教育目標

キーワード

学習・教育目標

1.インターネット 2.ＷＷＷ 3.ＨＴＭＬ 4.ＣＳＳ

　本科目は、経営情報学科の教育目標である情報デザイン基礎力習得を目指す。特にIT基礎能力の習得のために、コンピュータ、インターネット、マークアップ言語などの基礎知識を身につける。さらに、情報メディアの効果を最大限に生かしたコンテンツを作成する演習を行い、コンテンツの作成・管理・保守の一連の実習を通じて、ITの基本的な素養を習得することを目指す。

授業の概要および学習上の助言

　ウェブページ制作の基礎知識及び基本技能を身に付ける。インターネットとワールドワイドウェブの概要を知り、企画立案、設計・制作、運用・管理といったウェブサイト制作手順全体を理解する。ウェブページを表現するための記述法として、マークアップ言語(タグ付け言語)の基礎的な文法、スタイルシートの使い方を学ぶ。　さらに、情報の効果的な表現、使い易さ、誰にでも使えることなどにも配慮し、ウェブページを通じたコミュニケーションを効果的に行うために考慮すべき事項についても学ぶ。

教科書および参考書・リザーブドブック
教科書：HTML&CSSとWebデザインが1冊できちんと身につく本[増補改訂版][技術評論社] 参考書：指定なしﾘｻﾞｰﾌﾞﾄﾞﾌﾞｯｸ：指定なし

履修に必要な予備知識や技能
履修に当たっての事前の知識は必要ないが、教科書にそった各週の指定箇所を学習しておくこと。なお、理解度に応じて進み方を変更することもあるので、必ずしも学習支援計画書通りに進むとは限らない。

学生が達成すべき行動目標
No.	学科教育目標（記号表記）
①	H	自分のノートパソコンを設定して、ワールドワイドウェブを閲覧することができる。
②	H,J	テキストエディタ（Visual Studio Code）を使って、HTMLを用いて文字と静止画を使ったページを記述できる。
③	H,J	作成したファイルをウェブサーバにアップロードすることができる。
④	H,J	CSSを使ったページのレイアウトができる。
⑤	H,J	情報の効果的な表現、使い易さ、誰にでも使えることを配慮してホームページを作成できる。
⑥

達成度評価
				評価方法
				試験	クイズ小テスト	レポート	成果発表 (口頭・実技)	作品	ポートフォリオ	その他	合計
総合評価割合	30	0	20	0	40	0	10	100
指標と評価割合	総合評価割合		30	0	20	0	40	0	10	100
	総合力指標	知識を取り込む力	20	0	0	0	0	0	0	20
		思考・推論・創造する力	10	0	10	0	10	0	0	30
		コラボレーションとリーダーシップ	0	0	0	0	0	0	0	0
		発表・表現・伝達する力	0	0	10	0	20	0	0	30
		学習に取組む姿勢・意欲	0	0	0	0	10	0	10	20

※総合力指標で示す数値内訳、授業運営上のおおよその目安を示したものです。

評価の要点
評価方法	行動目標		評価の実施方法と注意点
試験	①	レ	ワールドワイドウェブの基本について理解できているかを確認する試験を学期途中に行う。
	②	レ
	③
	④
	⑤
	⑥
クイズ小テスト	①
	②
	③
	④
	⑤
	⑥
レポート	①	レ	ネットワーク上のプライバシー、セキュリティ、著作権、ネチケット等について調査しレポートする。
	②
	③
	④
	⑤
	⑥
成果発表 (口頭・実技)	①
	②
	③
	④
	⑤
	⑥
作品	①	レ	作成したホームページを評価対象とする。
	②	レ
	③	レ
	④	レ
	⑤	レ
	⑥
ポートフォリオ	①
	②
	③
	④
	⑤
	⑥
その他	①
	②
	③
	④
	⑤
	⑥

具体的な達成の目安

理想的な達成レベルの目安

標準的な達成レベルの目安

自分のノートパソコンからワールドワイドウェブを閲覧することができ、テキストエディタ（Visual Studio Code）を使って、HTMLを用いて文字と静止画を使ったページを作成できる。また作成したファイルをウェブサーバにアップロードすることができる。さらにCSSを使ったページのレイアウトができ、情報の効果的な表現、使い易さ、誰にでも使えることを配慮してホームページを作成できる。統一的な操作、配色など、閲覧者のためのWebページのデザインが独自の発想で実現できる。

ＣＬＩＰ学習プロセスについて
一般に、授業あるいは課外での学習では：「知識などを取り込む」→「知識などをいろいろな角度から、場合によってはチーム活動として、考え、推論し、創造する」→「修得した内容を表現、発表、伝達する」→「総合的に評価を受ける、ＧｏｏｄＷｏｒｋ！」：のようなプロセス（一部あるいは全体）を繰り返し行いながら、応用力のある知識やスキルを身につけていくことが重要です。このような学習プロセスを大事に行動してください。
※学習課題の時間欄には、指定された学習課題に要する標準的な時間を記載してあります。日々の自学自習時間全体としては、各授業に応じた時間（例えば2単位科目の場合、予習2時間・復習2時間／週）を取るよう努めてください。詳しくは教員の指導に従って下さい。

授業明細
回数	学習内容	授業の運営方法	学習課題予習・復習	時間：分※
1	・ガイダンス・知っておきたいサイトとデザインのきほん知識	講義	予習：教科書第1章 pp.15-44 復習：授業資料の該当箇所を復習	180分
2	・サイト制作の前に準備しておくこと	講義、実習	予習：教科書第2章 pp.45-64 復習：VS Code, Chromeを使いたおす、授業資料の該当箇所を復習	180分
3	・知っておきたいHTMLのきほんと書き方	講義、実習サイト制作環境の振り返り	予習：教科書第3章 pp.65-92 復習：HTMLに関する知識の振り返り、サンプルサイト共通のHTMLファイルを完成させる	180分
4	・知っておきたいCSSのきほんと書き方	講義、実習	予習：教科書第3章 pp.93-128 復習：CSSに関する基本ページを完成させる	300分
5	・知っておきたいレスポンシブデザインのきほんと書き方	講義、実習	予習：教科書第4章 pp.129-156 復習：レスポンシブデザインに関する基本ページを完成させる	180分
6	・フルスクリーンレイアウトを制作する	講義、演習作成ページの振り返り	予習：教科書第6章 pp.157-192 復習：フルスクリーンレイアウトページを完成させる	300分
7	・フレックスボックスレイアウトを制作する	講義、演習	予習：教科書第7章 pp. 193-224 復習：フレックスボックスレイアウトページのHTMLとCSSを完成させる	300分
8	・シングルカラムで動画コンテンツページを制作する	講義、実習作成ページの振り返り	予習：教科書第8章 pp.225-264 復習：シングルカラムで動画コンテンツページ用のHTMLとCSSを完成させる	360分
9	・グリッドで格子状レイアウトを制作する	講義、実習作成ページの振り返り	予習：教科書第9章 pp.265-296 復習：グリッドで格子状レイアウトされたコンテンのHTMLとCSSを完成させる	360分
10	・確認テストと自己点検	筆記試験と講義	予習：これまでに学習したことの全体を見返す	360分
11	・2カラムでショップページを制作する	講義、実習作成ページの振り返り	予習：教科書第10章 pp.297-340 復習：制作したショップページを完成させる	360分
12	・総合演習：自分のショップページないしはポートフォリオサイトの制作(1) 　制作してきたショップサイトをベースに自分独自のページ軍を作成する	講義、実習作成ページの振り返り	予習：どのようなサイトを作成するかの計画復習：自分のウェブページ制作	300分
13	・総合演習：自分のショップページないしはポートフォリオサイトの制作(2) 　制作してきたショップサイトをベースに自分独自のページ群を作成する　サーバーへのアップロード	講義、実習作成ページの振り返り	復習：自分のWebページを完成させ、サーバへのアップロード	300分
14	・総合力ラーニング　自分のWebページの公開　作成Webページの発表	講義、実習	予習：ページの制作・アップロード（各自ホームページを完成させ、サーバにアップロードしておくこと）．	180分
15	・Googleマップ付きの問い合わせページを制作する・自己点検授業　作品講評　今後の学習に対する助言　質疑応答　アンケート	・講義・演習・IT関連の学習・教育内容に関する質疑応答・振り返り・アンケート	総合復習	90分