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

シラバス

モバイルアプリケーション開発科 2024年度入学生

科目名 Web基礎 作成日 2024/04/08
区分 必修 講義/実習
開催時期 1年次 前期
講義・演習駒数/週 1駒
実習・実験駒数/週 1駒
合計駒数/週 2駒
総時間数 60時間
総単位数 3単位
企業連携
授業の目的 HTMLとCSS用いたWebページの制作の方法について学習する。
到達目標 Web制作の基本技術となるHTMLとCSSを理解して基本的なWebページの制作が出来る。

評価項目 ①定期テスト ②小テスト ③レポート ④課題 ⑤作品 ⑥ポートフォリオ ⑦成果発表 ⑧その他
割合 60%  %  % 40%  %  %  %  %
評価基準
・HTMLの基本構成に則ったWebページの作成が出来る ・CSSを記述してWebページのデザインを変更出来る
※上記に示した評価項目の割合(%)を基準に、総合評価点を算出して成績評価を行う。
※出席率が80%未満の場合は、評価対象としない。

担当教員 石黒 元康
テキスト・参考文献 世界一わかりやすいHTML5&CSS3コーディングとサイト制作の教科書(株式会社マジカルリミックス 赤間公太郎 狩野咲 鈴木清敬 著/技術評論社)、プリント
実務経験有無  
システムエンジニア・プログラマとして、Webシステム開発に従事した実務経験がある。その経験から取得した知識とスキルを活かして、本科目のWebサイト作成技術に対する職業実践的な教育を行う。 
関連科目 Androidプログラミング、iOSプログラミング、コンテンツ制作、Webシステム開発  履修前提   

授業計画

回数 学習目標 学習項目
1 HTMLでWebページを作成してWebブラウザで確認することが出来る。  【HTMLの基本構造】HTMLの役割と書式について解説して基本的なWebページの作成方法と作成したWebページにブラウザでアクセスする方法について学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
2 文章以外の要素をWebページ上に表示することが出来る。  【いろいろなコンテンツの挿入】箇条書きリストや表の作成方法と画像の挿入方法について学習する。また併せて別ページへのリンクを作成する方法について学ぶ。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
3 HTML5の文書構成を理解してWebページを作成出来る。  【HTML5の文書構成】ヘッダー/メインコンテンツ/フッターなどを用いたHTML5によるWebページの構成方法について学習する。また併せて連絡先や著作権表示の入れ方について学ぶ。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
4 CSSファイルを使用してWebページのフォントサイズや色の変更をすることが出来る。  【CSSによるデザイン】CSSの役割と記述方法について解説してCSSファイルの基本的な扱い方やWebページのフォントサイズや色の指定方法について学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
5 CSSでWebページ内の文字・リンク・表に装飾することが出来る。  【CSSによるデザイン】CSSの役割と文字・リンク・表の装飾方法について学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
6 ボックスの概念を理解して枠線や余白を付けることが出来る。  【ボックス】ボックスの基本概念である4つの領域について解説してボックスに背景・枠線・余白を付ける方法について学習する。また、CSSの適用先を指定するセレクタについても学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
7 ボックスレイアウトを利用したWebページをデザイン出来る。  【ボックスレイアウト】ボックスを用いたレイアウトの方法について学習してWebページで用いられるボックスレイアウトの手法について学ぶ。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
8 ここまでの内容を基にWebページを制作出来る。  【補足・復習】ここまでの内容についての補足・復習を行い後半の内容を学習するための準備を行う。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
9 Bootstrapの基礎を学んでボタンやテーブルを作成することが出来る。  【Bootstrapの基礎】Bootstrapのボタンやテーブルなどのホームページを構築する上で必要となる機能の枠組みを学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
10 Bootstrapのバージョンや応用事例を学習して画面を作成することが出来る。  【Bootstrapの応用】Bootstrapのバージョンや応用事例を学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
11 フォームの設置を行い、入力されたデータをプログラムで扱うことが出来る。  【フォーム】HTMLによるフォームの設置方法と設置したフォームから入力した値を取得してプログラムでフォームデータを取り扱う方法について学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
12 Webページ内のオブジェクトをマウスで操作する処理を実装出来る。  【イベント処理】マウスなどの操作でWebページ内のオブジェクトを操作する方法について実装を行いながら学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
13 画面サイズに応じてWebページのサイズの切り替えるが出来る。  【メディアクエリ】スマートフォンやタブレットなどのモバイルデバイス向けに画面サイズに応じてWebページのデザインの切り替える方法について学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
14 Webページの画面設計をすることが出来る。  【画面設計】CSSなどを用いたWebページの画面設計について学習する。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。
15 ここまでの内容を基にWebページを制作出来る。  ここまでの内容を確実にするために本講義のまとめと補足説明を行う。 
【理解度確認】学習内容に関する課題を行い、その結果を持って判定する。