Webデザイン基礎・演習
担当教員
授業の到達目標及びテーマ
World Wide Webサービスの記述言語仕様HTMLには、現在の標準規格が推奨しているWebデザインの思想が存在している。ところが過去の規格との後方互換性や誤ったHTML記述に対するWebブラウザの許容度の高さのため、現在では推奨されていないWebデザインのコンテンツが意外に多く存在している。この科目ではWebの標準規格HTML,CSSの正しい理解とWebページを設計・作成する技術の基礎を演習を通して学ぶ。 この技術の習得は、全てのWebアプリケーションプログラマにとっての大前提なるものなので、多くの学生の1年次での履修が望まれる。
授業の概要と方法
これまでプログラミング言語の経験のない学生も受講可能な学習プログラムに基づき、HTML XHTML、スタイルシートを用いたページデザインついてそれらの基礎を学ぶ。 現時点(シラバス作成時)での最新の正式規格であるHTML4.01,XHTML1.1,CSS2に準拠する。 現在まだ正式勧告に至っていないHTML5についても時間の範囲内で触れる。 また動的なウェブサイトの構築などに用いられるプログラミング言語Javascriptについても取り上げる。 授業は講義と演習を同時並行して進める。
授業計画
| 回 | テーマ | 内容 |
|---|---|---|
| 1 | ガイダンスとHTMLの基礎 | 授業の進め方についてのガイダンスとHTMLの概要 |
| 2 | HTML文章の構造化とブロック要素 | HTMLによる文書の構造記述を行う |
| 3 | リスト、テーブル | リストによる簡潔な情報表現とテーブルによる2次元の情報表現 |
| 4 | インライン要素、 ハイパーリンク、インライン画像 | 主なインライン要素。ハイパーリンクやインライン画像の実現とその留意点。 |
| 5 | head要素 | ユーザエージェントのための情報記述 |
| 6 | アクセシビリティ | ハンディがあっても利用できるページづくり |
| 7 | フォーム | データの入力手段を提供するフォーム |
| 8 | CSSの基本 | 意味と構造に表現を与えるスタイルシートの役割。 テキストに関するスタイル。色と背景効果。 |
| 9 | ボックスモデル | 情報ブロックを表現するボックスモデル |
| 10 | 通常フローと浮動化 | 通常フローによるブロックのレイアウトと水平配置を可能にする浮動化 |
| 11 | ポジショニング | positionプロパティ、絶対配置、固定配置、相対配置 |
| 12 | CSSの応用I | ページ・ナビゲーションの実現I |
| 13 | CSSの応用II | ページ・ナビゲーションの実現II |
| 14 | JavaScript | JavaScriptの紹介とWebデザインにおける役割 |
| 15 | HTML5,まとめ | 標準化が進行中のHTML5の特徴と全体のまとめ |
授業外に行うべき学習活動
演習課題の自習が必要
テキスト
授業支援システムで提供される教材を使用します。
参考書
「ユニバーサルHTML/XHTML｣著者:神崎 正英,発行所:毎日コミュニケーションズ,ISBN:4-8399-0454-5 「Web標準の教科書―XHTMLとCSSでつくる“正しい”Webサイト」益子 貴寛 (著) ,出版社: 秀和システム,ISBN-13: 978-4798010922 「現場のプロから学ぶXHTML+CSS」出版社: 毎日コミュニケーションズ,ISBN-13: 978-4839929732 「セオリー・オブ・スタイルシート」出版社: 技術評論社,ISBN-13: 978-4774127835
成績評価基準
出席および課題の評価
情報機器使用
貸与ノートPCを毎回使用する。ネットワークも利用する。
前年度の授業改善アンケートからの気づき
今季から担当します。