|
|
|
|
|
|
| トピック |
標準学習時間 |
|
第1章 WWWシステムとWebページ |
|
1-1 WWWシステムの基礎知識 |
|
|
(1) WWWシステムの基本 |
|
|
|
TCP/IPネットワークとクライアント・サーバーシステム |
20分 |
|
|
(2) WWWシステムの構成要素 |
|
|
|
WWWシステム（Webシステム）～WWWクライアント（ブラウザー） |
10分 |
|
|
|
HTMLドキュメントとWebページ |
25分 |
|
|
|
URL(Uniform Reseource Locator)とホスト名 |
30分 |
|
|
|
Webサイトとトップページ |
15分 |
|
|
|
ハイパーリンクとハイパーテキスト |
10分 |
|
|
|
HTTP(Hyper Text Transfer Protocol) |
10分 |
|
|
1-1 確認テスト |
30分 |
|
1-2 Webサーバー「Apache Tomcat」のインストール |
|
|
(1) 本書の実習環境について |
20分 |
|
|
(2) Apache Tomcat のインストール |
|
|
|
Tomcatのダウンロード |
15分 |
|
|
|
Tomcatのインストール |
20分 |
|
|
|
Tomcatの起動と停止方法 |
25分 |
|
|
|
Tomcatのディレクトリー構成 |
15分 |
|
|
|
インストールの確認作業 |
30分 |
|
|
|
ドキュメントベースとHTMLドキュメントの作成 |
40分 |
|
|
1-2 確認テスト |
30分 |
|
第2章 HTMLの基本 |
|
2-1 HTMLドキュメントの基本構造 |
|
|
(1) 実習環境の構築 |
|
|
|
ドキュメントルートの作成 |
30分 |
|
|
(2) HTML要素 |
|
|
|
HTMLドキュメントの作成と保持 |
25分 |
|
|
|
ブラウザーからのリクエストとURLパターン |
35分 |
|
|
|
HTML要素 |
20分 |
|
|
|
HTMLドキュメントの基本構造とルート要素 |
15分 |
|
|
|
＜HEAD＞要素と＜BODY＞要素 |
55分 |
|
|
|
＜P＞要素 |
45分 |
|
|
|
＜H1＞要素～＜HR＞要素 |
40分 |
|
|
(3) 属性 |
|
|
|
属性～RGBコードとカラーネーム |
50分 |
|
|
|
HTMLドキュメントに記述可能な文字について |
40分 |
|
|
|
エスケープシーケンス |
30分 |
|
|
|
＜IMG＞要素～HTMLのコメント |
45分 |
|
|
|
練習問題2-1 |
20分 |
|
|
|
（参考）＜IMG＞要素のalign属性 |
15分 |
|
|
|
（参考）＜IMG＞要素のalt属性 |
15分 |
|
|
|
2-1 確認テスト |
30分 |
|
2-2 リンク |
|
|
リンク |
15分 |
|
|
＜DIV＞要素 |
25分 |
|
|
＜A＞要素 |
40分 |
|
|
相対パスのURL～＜A＞要素について |
30分 |
|
|
2-2 確認テスト |
30分 |
|
第3章 テーブル |
|
3-1 テーブルの基本構造 |
|
|
テーブルの基本構造 |
25分 |
|
|
＜TABLE＞要素 |
10分 |
|
|
＜TR＞要素 |
10分 |
|
|
＜TD＞要素 |
35分 |
|
|
＜TH＞要素～＜CAPTION＞要素 |
25分 |
|
|
練習問題3-1 |
20分 |
|
|
3-1 確認テスト |
30分 |
|
3-2 複雑なテーブル構造 |
|
|
複雑なテーブル構造 |
15分 |
|
|
colspan属性 |
40分 |
|
|
rowspan属性 |
20分 |
|
|
練習問題3-2a～練習問題3-2b |
15分 |
|
|
colspan属性とrowspan属性の組み合わせ |
20分 |
|
|
練習問題3-3a～練習問題3-3b |
20分 |
|
|
3-2 確認テスト |
30分 |
|
3-3 リンクを設定したテーブル |
|
|
リンクを設定したテーブル |
20分 |
|
|
3-3 確認テスト |
30分 |
|
第4章 フォーム |
|
4-1 フォームの基本構造 |
|
|
(1) フォームの機能 |
|
|
|
フォームの機能 |
20分 |
|
|
|
＜FORM＞要素 |
10分 |
|
|
(2) 入力フィールド① |
|
|
|
＜INPUT＞要素 |
60分 |
|
|
|
name属性とvalue属性 |
60分 |
|
|
(3) 入力フィールド② |
|
|
|
＜SELECT＞要素と＜OPTION＞要素 |
30分 |
|
|
|
＜TEXTAREA＞要素 |
20分 |
|
|
|
練習問題4-1～練習問題4-2 |
20分 |
|
|
4-1 確認テスト |
30分 |
|
4-2 アプリケーションシステムへのデータ送信 |
|
|
(1) データ送信のしくみ |
|
|
|
データ送信のしくみ |
35分 |
|
|
|
＜FORM＞要素のaction属性と送信ボタン |
30分 |
|
|
|
HTTPリクエストパラメーター |
20分 |
|
|
|
ラジオボタンとチェックボックスのchecked属性～選択リストのselected属性（参考） |
20分 |
|
|
(2) JSPプログラムへのデータ送信 |
|
|
|
JSPとは |
10分 |
|
|
|
動的なHTMLドキュメント |
10分 |
|
|
|
JSPの実行方法 |
15分 |
|
|
|
フォームからJSPプログラムのリクエスト |
10分 |
|
|
4-2 確認テスト |
30分 |
|
4-3 フォームとテーブルを組み合わせた高度な設計 |
|
|
フォームとテーブルを組み合わせた高度な設計 |
30分 |
|
|
テキストボックスとパスワードボックスのsize属性、maxlength属性 |
10分 |
|
|
フォームに入力されたデータを処理するプログラムの作成 |
15分 |
|
|
4-3 確認テスト |
30分 |
|
第5章 フレーム |
|
5-1 フレーム機能の基礎 |
|
|
フレーム機能の基礎 |
15分 |
|
|
フレームセットドキュメント |
15分 |
|
|
水平方向のフレーム分割パターン |
50分 |
|
|
垂直方向のフレーム分割パターン |
20分 |
|
|
水平・垂直方向のフレーム分割パターン |
25分 |
|
|
5-1 確認テスト |
30分 |
|
5-2 フレームを利用したシステム例 |
|
|
例題のシステム設計 |
20分 |
|
|
フレームセットドキュメントの作成 |
10分 |
|
|
リンクメニューの作成～HTMLドキュメントの作成 |
25分 |
|
|
フレームセットドキュメントのリクエスト～「通天閣」「福岡タワー」の情報を作成 |
15分 |
|
|
5-2 確認テスト |
30分 |
|
第6章 スタイルシート |
|
6-1 スタイルシートとは |
|
|
スタイルシートの目的 |
70分 |
|
|
ページ内リンク |
40分 |
|
|
6-1 確認テスト |
30分 |
|
6-2 CSSの基本的な使い方 |
|
|
HTML要素や属性によるWebページの装飾 |
55分 |
|
|
CSSによるスタイル指定の形式 |
20分 |
|
|
要素内CSS（インラインCSS) |
25分 |
|
|
＜BODY＞要素から分離したスタイルの定義方式 |
30分 |
|
|
ページ内CSS |
15分 |
|
|
ページ内CSSのスタイル定義形式 |
15分 |
|
|
ページ内CSSの利点 |
15分 |
|
|
同一のHTML要素に異なるスタイル定義を適用する方法 |
60分 |
|
|
6-2 確認テスト |
30分 |
|
第7章 Javascript |
|
7-1 JavaScriptとは |
|
|
JavaScriptとは (1) |
25分 |
|
|
JavaScriptとは (2) |
15分 |
|
|
WebアプリケーションシステムにおけるJavaScript～JavaScriptとJSP（Java）の違い |
15分 |
|
|
イベントドリブン方式とイベントハンドラー |
35分 |
|
|
onClickイベントハンドラー |
60分 |
|
|
onMouseOverイベントハンドラー |
25分 |
|
|
7-1 確認テスト |
30分 |
|
7-2 フォームとJavaScript |
|
|
フォームの入力フィールドに対するアクセス（その1） |
60分 |
|
|
フォームの入力フィールドに対するアクセス（その2） |
30分 |
|
|
関数 |
35分 |
|
|
関数のパラメーター |
25分 |
|
|
7-2 確認テスト |
30分 |
