|| 英語(English)
学習支援計画書(シラバス) 検索システム
専門教育課程 経営情報学科
授業科目区分 科目名 単位数 科目コード 開講時期 履修方法
専門教育課程
専門科目
専門
Webデザイン
Web Design
2 F102-01 2023年度
1期(前学期)
修学規程第4条を参照
担当教員名
*印は、実務経験のある教員を示しています。
授業科目の学習・教育目標
キーワード 学習・教育目標
1.インターネット 2.WWW 3.HTML 4.CSS  本科目は、経営情報学科の教育目標である情報デザイン基礎力習得を目指す。特に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ページのデザインが独自の発想で実現できる。 自分のノートパソコンからワールドワイドウェブを閲覧するこ とができ、テキストエディタ(Visual Studio Code)を使って 、HTMLにより、文字と静止画を使ったページを作成できる。 また作成したファイルをウェブサーバにアップロードすること ができる。 さらにCSSを使ったページのレイアウトができ、情 報の効果的な表現、使い易さ、誰にでも使えることを配慮して ホームページを作成できる。
CLIP学習プロセスについて
一般に、授業あるいは課外での学習では:「知識などを取り込む」→「知識などをいろいろな角度から、場合によってはチーム活動として、考え、推論し、創造する」→「修得した内容を表現、発表、伝達する」→「総合的に評価を受ける、GoodWork!」:のようなプロセス(一部あるいは全体)を繰り返し行いながら、応用力のある知識やスキルを身につけていくことが重要です。このような学習プロセスを大事に行動してください。
※学習課題の時間欄には、指定された学習課題に要する標準的な時間を記載してあります。日々の自学自習時間全体としては、各授業に応じた時間(例えば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分