2026/04/07 3・4限 DL501
Webコンテンツデザインに関わる基礎技術の習得を目的とした演習で、標準技術としてのHTML・CSS・JavaScriptを用いたWebサイトの構築を行います。
スケジュール
1Q
- オリエンテーション、Webデザインの基本用語、HTMLの記述体験、
- HTML 基本の記述方法、FTP、GitHub
- HTML 文法・構造
- CSS 基本の記述方法、文字と余白
- CSS ボックスモデル
- CSS レイアウト
- CSS レスポンシブデザインの考え方
2Q
- CSS レスポンシブデザインの実装
- JavaScript 記述体験、HTML・CSSとの組み合わせ
- Webサイト構築1 ユーザビリティ、サイトマップ、ワイヤーフレーム
- Webサイト構築2 プロトタイプ制作
- Webサイト構築3 HTML + CSS テンプレート
- Webサイト構築4 機能追加
- プレゼンテーション・ブラッシュアップ
※進捗により調整することがあります
授業資料の提示方法
- 授業用サイト（本サイト）
- Microsoft Teams（授業に関するお知らせ）
- 学科サイト（課題の公開）
評価方法
Webサイト成果物(内容、ビジュアル、ユーザビリティ、技術水準）を70%
企画報告・中間報告等のプレゼンテーションを30%として総合的に評価
出席登録
出席簿 ※要ログイン・確認用
授業録画
授業の解説部分は録画して後日配信予定です
初回アンケート
今日の内容
- デジタルラボの使い方
- ログイン方法
- 授業時間以外に部屋を使いたい場合
- 作業環境の確認
- Web制作に関する基本用語・技術
- Webページ制作の練習
- Visual Studio Codeの基本操作
作業環境について
作る（書く）→ （テキスト）エディタ
※授業ではVisual Studio codeを使います
見る→（ウェブ）ブラウザ
- Safari
- Google Chrome
- Firefox
- Microsoft Edge
…など
コンピュータ、タブレット、スマートフォンなど、様々な端末で閲覧します
アップロードする→ FTPクライアント
…など
素材制作のためのソフト
- Adobe Illustrator
- Adobe Photoshop
- Adobe XD
- Figma
…など