1. トップ
  2. 学校紹介
  3. 情報公開
  4. 学科情報
  5. シラバス - 科目一覧

シラバス

高度情報処理科 2023年度入学生

科目名 WebⅠ 作成日 2023/09/22
区分 必修 講義/実習
開催時期 1年次 後期
講義・演習駒数/週 1駒
実習・実験駒数/週 1駒
合計駒数/週 2駒
総時間数 60時間
総単位数 3単位
企業連携
授業の目的 業務系システムの主流がWebシステムとなるなか、Webシステムのフロントエンド技術としてHTMLとCSSによるUIデザインが出来るようになる。
到達目標 ・HTML・CSSを使ってWebシステムのUIデザインが出来る。 ・使いやすいUIとはどのようなものかを説明し、HTML・CSSで表現出来る。

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ポートフォリオ ⑦成果発表 ⑧その他
割合 70%  %  % 20%  %  %  % 10%
評価基準
Webシステムにおける基本的なフロントエンドプログラムを実装出来ること。すべての必須課題をクリア出来ること。 ・応用課題の提出状況を④課題の加点対象とする。 ・指定資格の取得を①定期テストの加点対象とする。 ・加えて、授業態度・出席状況も評価対象とする。
※上記に示した評価項目の割合(%)を基準に、総合評価点を算出して成績評価を行う。
※出席率が80%未満の場合は、評価対象としない。

担当教員 菅原 大翼/糠盛 創/大宮 晃平
テキスト・参考文献 1冊ですべて身につくHTML&CSSとWebデザイン入門講座 配布資料
実務経験有無  
IT企業において各種Webシステム構築の実務経験がある。その経験から取得した知識とスキルを活かして、本科目の技術要素に対する職業実践的な教育を行う。  
関連科目 WebⅡ  履修前提   

授業計画

回数 学習目標 学習項目
1 Web技術の構成、HTMLの概要と基本構造を理解し、基本的なWebページを作成出来る。   HTTP、HTTPリクエストとレスポンス、URL、HTMLの規格と書式、基本構造、DOCTYPE宣言、html要素、head要素、body要素。 
【理解度確認】確認問題、実習課題
2 head要素とbody要素内で利用される主な要素の役割を理解し、それらを使ったWebページを開発出来る。  titile, meta 等の要素の役割と使い方。 hr, 見出し, p, br, em, strong等の要素の役割と使い方。 HTMLのコメント。 
【理解度確認】確認問題、実習課題
3 リストや表組みなど、複雑な要素の階層構造を持つWebページを開発出来る。   要素の階層構造 相対パス、絶対パス。 リストや表組みの要素の役割と使い方。 
【理解度確認】確認問題、実習課題
4 リンクや画像表示などURLを使ったWebページを開発出来る。  img, a等の要素の役割と使い方URLの省略。 絶対パスと相対パス。 
【理解度確認】確認問題、実習課題
5 リンクや入力フォームを使ってWebサーバーに情報を送信するWebページを開発出来る。  URLパラメーターや入力フォーム要素の役割と使い方 HTML5で廃止された要素と属性。 入力フォームの属性とURLパラメーターの関係やHTTPの詳細。 
【理解度確認】確認問題、実習課題
6 適切な構造化を行ったHTMLを記述出来る。  header、main、footer、nav。 section、article、aside。 
【理解度確認】確認問題、実習課題
7 これまでの学習内容を活かして、要件に基づいたWebページを作成出来る  演習問題(HTMLのみ) 
【理解度確認】実習課題
8 CSSの位置づけを理解し、基本的なCSSを使ったWebページを開発出来る。  HTML要素の装飾。 コメントの書式や単位と色の指定。 
【理解度確認】確認問題、実習課題
9 CSSを使ってHTML要素を装飾したWebページを開発出来る。  HTML要素の装飾。 コメントの書式や単位と色の指定。 
【理解度確認】確認問題、実習課題
10 CSSのボックスモデルを理解し、段組でレイアウトされたWebページを開発出来る。  ボックスモデルの構造と要素。 段組を使ったレイアウト(マルチカラム・レイアウト、グリッドレイアウト)。 
【理解度確認】確認問題、実習課題
11 レスポンシブWebデザインの考え方を理解し、デバイスの違いに応じて最適化されるWebページを開発出来る。  メディアクエリとスマートフォンへの対応。 オフラインWebアプリケーション。 
【理解度確認】確認問題、実習課題
12 CSSアニメーションを使って、簡単なアニメーションを表現出来る。  transition、transform を使ったアニメーション・変形。 
【理解度確認】確認問題、実習課題
13 Webページ作成における注意事項を理解し、ユーザビリティの高いUIを作成出来る。  Webページ開発におけるガイドライン 
【理解度確認】確認問題、実習課題
14 これまでの学習内容を活かして、要件に基づいたWebページを作成出来る。  演習問題(HTML・CSS) 
【理解度確認】確認問題、実習課題
15 期末試験を通じて、自身の理解度を確認出来る。  期末試験 
【理解度確認】期末試験