|
|
|
|
|
|
トピック |
標準学習時間 |
第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分 |