網(wǎng)頁設(shè)計(jì)與制作基礎(chǔ)培訓(xùn)教程

第1章 網(wǎng)頁制作基礎(chǔ) 1
1-1 教學(xué)目標(biāo)與重點(diǎn) 1
1-2 課堂講解：網(wǎng)站和網(wǎng)頁 1
1-2-1 網(wǎng)站 1
1-2-2 網(wǎng)頁 1
1-3 課堂講解：超文本
標(biāo)記語言HTML 2
1-3-1 一個(gè)簡單的HTML
文件 2
1-3-2 編寫HTML文件 3
1-3-3 用IE打開HTML
文件 3
1-4 課堂講解：制作網(wǎng)站的
方法和步驟 3
1-4-1 創(chuàng)建一個(gè)網(wǎng)頁 3
1-4-2 制作網(wǎng)站的步驟 4
1-5 課堂講解：網(wǎng)頁制作工具 5
1-6 上機(jī)指導(dǎo) 6
1-6-1 瀏覽網(wǎng)頁 6
1-6-2 網(wǎng)頁制作工具的安裝 6
1-7 課后練習(xí) 8
第2章 HTML基本語法 10
2-1 教學(xué)目標(biāo)與重點(diǎn) 10
2-2 課堂講解：標(biāo)簽與標(biāo)題 10
2-2-1 使用標(biāo)簽 10
2-2-2 使用標(biāo)題 11
2-3 課堂講解：設(shè)置頁面格式 12
2-3-1 設(shè)置字體 12
2-3-2 設(shè)置段落標(biāo)記 13
2-4 課堂講解：超鏈接與列表 14
2-4-1 添加超鏈接 14
2-4-2 使用有序列表 15
2-4-3 使用無序列表 16
2-4-4 定義列表 17
2-5 上機(jī)指導(dǎo) 18
2-5-1 編寫第一個(gè)HTML
頁面 18
2-5-2 為網(wǎng)頁添加
Copyright 19
2-6 課后練習(xí) 20
第3章 HTML高級(jí)應(yīng)用 21
3-1 教學(xué)目標(biāo)與重點(diǎn) 21
3-2 課堂講解：圖像與表格 21
3-2-1 插入圖像 21
3-2-2 創(chuàng)建表格 23
3-2-3 給表格添加標(biāo)題 24
3-3 課堂講解：框架與多媒體 25
3-3-1 創(chuàng)建框架結(jié)構(gòu) 25
3-3-2 播放音頻/視頻文件 26
3-4 課堂講解：表單處理 27
3-4-1 使用表單 27
3-4-2 表單實(shí)例 28
3-5 上機(jī)指導(dǎo) 29
3-5-1 為網(wǎng)頁添加視頻 29
3-5-2 提交表單 30
3-6 課后練習(xí) 32
第4章 Dreamweaver MX簡介 34
4-1 教學(xué)目標(biāo)與重點(diǎn) 34
4-2 課堂講解：工作環(huán)境介紹 34
4-2-1 啟動(dòng)Dreamweaver
MX 34
4-2-2 Dreamweaver MX的
新增功能 35
4-2-3 Dreamweaver MX
工作界面 36
4-3 課堂講解：參數(shù)設(shè)置 40
4-3-1 設(shè)置常規(guī)參數(shù) 40
4-3-2 設(shè)置字體參數(shù) 42
4-4 上機(jī)指導(dǎo) 43
4-4-1 創(chuàng)建本地站點(diǎn) 43
4-4-2 設(shè)置頁面屬性 45
4-5 課后練習(xí) 46
第5章 文本與圖像的編輯 47
5-1 教學(xué)目標(biāo)與重點(diǎn) 47
5-2 課堂講解：文本的輸入 47
5-2-1 設(shè)置文本屬性 47
5-2-2 插入特殊字符 48
5-2-3 插入日期顯示 49
5-3 課堂講解：使用HTML
樣式格式化文本 49
5-3-1 創(chuàng)建HTML樣式 50
5-3-2 應(yīng)用HTML樣式
格式化文本 51
5-4 課堂講解：編輯圖像 52
5-4-1 插入圖像 52
5-4-2 圖像屬性設(shè)置 53
5-4-3 創(chuàng)建翻轉(zhuǎn)圖像 54
5-4-4 建立圖像地圖 55
5-4-5 創(chuàng)建網(wǎng)站相冊(cè) 56
5-5 上機(jī)指導(dǎo) 57
5-5-1 創(chuàng)建簡單的
個(gè)人主頁 57
5-5-2 制作個(gè)人相冊(cè) 58
5-6 課后練習(xí) 58
第6章 使用表格與框架 59
6-1 教學(xué)目標(biāo)與重點(diǎn) 59
6-2 課堂講解：運(yùn)用表格 59
6-2-1 創(chuàng)建表格 59
6-2-2 設(shè)置表格屬性 60
6-2-3 導(dǎo)入表格數(shù)據(jù) 61
6-2-4 導(dǎo)出表格數(shù)據(jù) 61
6-3 課堂講解：分層和定位 62
6-3-1 層的概念 62
6-3-2 設(shè)置層的屬性 62
6-3-3 層的基本操作 64
6-3-4 層與表格的
相互轉(zhuǎn)換 65
6-4 課堂講解：使用框架 66
6-4-1 創(chuàng)建框架 67
6-4-2 設(shè)置框架頁面的
背景 67
6-4-3 刪除框架 68
6-4-4 設(shè)置框架和
框架集屬性 68
6-5 上機(jī)指導(dǎo) 69
6-5-1 表格頁面的創(chuàng)建 69
6-5-2 制作下拉菜單 70
6-5-3 制作框架網(wǎng)頁 72
6-6 課后練習(xí) 74
第7章 超鏈接與導(dǎo)航條 75
7-1 教學(xué)目標(biāo)與重點(diǎn) 75
7-2 課堂講解：使用超鏈接 75
7-2-1 創(chuàng)建鏈接 75
7-2-2 創(chuàng)建郵件鏈接 76
7-2-3 鏈接到命名錨記 77
7-2-4 利用站點(diǎn)地圖
管理超鏈接 78
7-3 課堂講解：導(dǎo)航條的制作 80
7-3-1 創(chuàng)建導(dǎo)航條 80
7-3-2 編輯導(dǎo)航條 81
7-4 上機(jī)指導(dǎo) 82
7-4-1 為網(wǎng)頁添加超鏈接 82
7-4-2 創(chuàng)建指向E-mail地址
的鏈接 83
7-4-3 創(chuàng)建導(dǎo)航條 83
7-5 課后練習(xí) 84
第8章 Dreamweaver 高級(jí)技巧 85
8-1 教學(xué)目標(biāo)與重點(diǎn) 85
8-2 課堂講解：使用CSS樣式 85
8-2-1 創(chuàng)建CSS樣式 85
8-2-2 鏈接外部CSS
樣式表 87
8-2-3 使用CSS選擇器 88
8-3 課堂講解：行為與表單 89
8-3-1 行為與時(shí)間軸 89
8-3-2 使用表單 90
8-4 課堂講解：模板的使用 91
8-4-1 創(chuàng)建模板 91
8-4-2 管理模板 92
8-4-3 應(yīng)用模板 93
8-5 上機(jī)指導(dǎo) 93
8-5-1 用CSS樣式控制
頁面外觀 94
8-5-2 創(chuàng)建時(shí)間軸動(dòng)畫 95
8-6 課后練習(xí) 96
第9章 使用Fireworks MX 97
9-1 教學(xué)目標(biāo)與重點(diǎn) 97
9-2 課堂講解：工作環(huán)境介紹 97
9-2-1 新增功能 97
9-2-2 工作界面簡介 99
9-3 課堂講解：文檔基本操作 101
9-3-1 新建一個(gè)文檔 101
9-3-2 導(dǎo)入圖像 102
9-3-3 控制文檔的
顯示比例 102
9-4 課堂講解：圖像的
基本操作 103
9-4-1 打開文件 103
9-4-2 編輯圖像 104
9-4-3 圖像的合成 106
9-5 課堂講解：編輯文本 107
9-5-1 創(chuàng)建文本 107
9-5-2 編輯文本 107
9-6 上機(jī)指導(dǎo) 108
9-6-1 制作公司圖標(biāo) 108
9-6-2 浮雕效果的文本 109
9-7 課后練習(xí) 109
第10章 顏色和透明度的應(yīng)用 111
10-1 教學(xué)目標(biāo)與重點(diǎn) 111
10-2 課堂講解：Web中的
顏色處理 111
10-2-1 十六進(jìn)制顏色 111
10-2-2 顏色選擇板 112
10-2-3 選取顏色 112
10-2-4 創(chuàng)建新顏色 115
10-3 課堂講解：使用透明色 115
10-3-1 設(shè)置透明度 115
10-3-2 圖像的反鋸齒
顯示 115
10-3-3 去掉Web圖像的
光暈 116
10-3-4 填充紋理特效 117
10-4 上機(jī)指導(dǎo) 119
10-4-1 制作背景圖片 119
10-4-2 虛線線框效果 120
10-5 課后練習(xí) 121
第11章 動(dòng)畫、熱區(qū)和切片 122
11-1 教學(xué)目標(biāo)與重點(diǎn) 122
11-2 課堂講解：創(chuàng)建動(dòng)畫 122
11-2-1 制作逐幀動(dòng)畫 122
11-2-2 制作漸變動(dòng)畫 123
11-2-3 設(shè)置動(dòng)畫的
播放次數(shù) 123
11-2-4 設(shè)置幀的
延遲時(shí)間 124
11-2-5 導(dǎo)出GIF動(dòng)畫 124
11-3 課堂講解：創(chuàng)建熱區(qū) 125
11-3-1 創(chuàng)建熱區(qū) 125
11-3-2 顯示/隱藏?zé)釁^(qū) 126
11-3-3 熱區(qū)操作 127
11-3-4 設(shè)置熱區(qū)的屬性 127
11-3-5 導(dǎo)出含有熱區(qū)的
圖像 128
11-4 課堂講解：切片 128
11-4-1 創(chuàng)建切片 128
11-4-2 顯示/隱藏切片 130
11-4-3 設(shè)置切片的屬性 130
11-4-4 導(dǎo)出切片 131
11-5 上機(jī)指導(dǎo) 133
11-5-1 利用元件制作
動(dòng)畫 133
11-5-2 創(chuàng)建文本切片 134
11-6 課后練習(xí) 135
第12章 Fireworks高級(jí)技巧 136
12-1 教學(xué)目標(biāo)與重點(diǎn) 136
12-2 課堂講解：創(chuàng)建按鈕和
導(dǎo)航條 136
12-2-1 創(chuàng)建和編輯按鈕 136
12-2-2 創(chuàng)建導(dǎo)航條 137
12-3 課堂講解：圖像的優(yōu)化 138
12-3-1 預(yù)覽優(yōu)化設(shè)置 138
12-3-2 使用濾鏡 140
12-3-3 使用蒙版 140
12-4 課堂講解：導(dǎo)出圖像 141
12-4-1 設(shè)置導(dǎo)出參數(shù) 141
12-4-2 導(dǎo)出圖像 142
12-5 上機(jī)指導(dǎo) 144
12-5-1 按鈕和導(dǎo)航條的
制作 144
12-5-2 圖像的優(yōu)化 144
12-5-3 導(dǎo)出圖像 145
12-6 課后練習(xí) 147
第13章 Flash MX入門 148
13-1 教學(xué)目標(biāo)與重點(diǎn) 148
13-2 課堂講解：初識(shí)
Flash MX 148
13-2-1 Flash MX的
新增功能 148
13-2-2 Flash MX工作
界面 149
13-2-3 使用Flash MX
幫助 151
13-2-4 使用工具箱 152
13-3 課堂講解：文本操作 152
13-3-1 創(chuàng)建文本 153
13-3-2 設(shè)置文本屬性 153
13-3-3 轉(zhuǎn)換類型與
變換文字 155
13-4 上機(jī)指導(dǎo) 155
13-4-1 文字特效 155
13-4-2 文本轉(zhuǎn)換為圖形 157
13-5 課后練習(xí) 158
第14章 Flash MX基本操作 159
14-1 教學(xué)目標(biāo)與重點(diǎn) 159
14-2 課堂講解：創(chuàng)建自己的
Flash 159
14-2-1 創(chuàng)建新文檔 159
14-2-2 設(shè)置場(chǎng)景 160
14-2-3 測(cè)試影片 160
14-2-4 保存文件 161
14-3 課堂講解：編輯圖形 161
14-3-1 繪制矢量圖 161
14-3-2 使用畫筆工具 163
14-3-3 調(diào)整圖形形狀 164
14-3-4 使用顏料桶工具 164
14-3-5 巧用套索工具 165
14-4 課堂講解：編輯對(duì)象 166
14-4-1 選取對(duì)象 166
14-4-2 移動(dòng)對(duì)象 167
14-4-3 刪除和復(fù)制對(duì)象 167
14-4-4 圖像變形 167
14-5 上機(jī)指導(dǎo) 168
14-5-1 線性漸變填充
圖形 168
14-5-2 繪制圓角矩形 169
14-6 課后練習(xí) 170
第15章 使用元件和圖庫 171
15-1 教學(xué)目標(biāo)與重點(diǎn) 171
15-2 課堂講解：編輯元件 171
15-2-1 認(rèn)識(shí)元件 171
15-2-2 創(chuàng)建元件 172
15-2-3 編輯元件 174
15-3 課堂講解：使用圖庫 175
15-3-1 使用【庫】面板 175
15-3-2 使用公共庫 176
15-4 上機(jī)指導(dǎo) 177
15-4-1 創(chuàng)建按鈕元件 177
15-4-2 圖像轉(zhuǎn)化為元件 178
15-4-3 使用【庫】面板
管理元件 179
15-5 課后練習(xí) 180
第16章 創(chuàng)建動(dòng)畫 181
16-1 教學(xué)目標(biāo)與重點(diǎn) 181
16-2 課堂講解：Flash
動(dòng)畫概述 181
16-2-1 時(shí)間軸和幀 181
16-2-2 使用關(guān)鍵幀 182
16-3 課堂講解：創(chuàng)建動(dòng)畫 183
16-3-1 創(chuàng)建“補(bǔ)間”
動(dòng)畫 183
16-3-2 創(chuàng)建“幀-幀”
動(dòng)畫 184
16-4 課堂講解：編輯動(dòng)畫 185
16-4-1 清除、移動(dòng)與
復(fù)制幀 185
16-4-2 設(shè)置幀頻 185
16-5 課堂講解：使用圖層 185
16-5-1 層的概念 185
16-5-2 創(chuàng)建和編輯圖層 186
16-5-3 圖層的狀態(tài) 186
16-5-4 引導(dǎo)圖層 188
16-5-5 遮罩圖層 188
16-6 上機(jī)指導(dǎo) 189
16-6-1 彈跳的小球 189
16-6-2 滾動(dòng)的小球 190
16-7 課后練習(xí) 192
第17章 聲音處理與視頻導(dǎo)入 193
17-1 教學(xué)目標(biāo)與重點(diǎn) 193
17-2 課堂講解：創(chuàng)建有聲影片 193
17-2-1 Flash中使用的
音頻格式 193
17-2-2 導(dǎo)入聲音文件 194
17-2-3 為影片添加聲音 194
17-2-4 編輯聲音 195
17-2-5 利用【屬性】面板
設(shè)置音頻 197
17-3 課堂講解：導(dǎo)入視頻文件 198
17-4 上機(jī)指導(dǎo) 199
17-4-1 為按鈕元件添加
聲音 199
17-4-2 為影片添加聲音 200
17-5 課后練習(xí) 202
第18章 導(dǎo)出與發(fā)布動(dòng)畫 203
18-1 教學(xué)目標(biāo)與重點(diǎn) 203
18-2 課堂講解：動(dòng)畫的導(dǎo)出 203
18-2-1 選擇導(dǎo)出類型 203
18-2-2 導(dǎo)出動(dòng)畫 206
18-3 課堂講解：發(fā)布動(dòng)畫 207
18-3-1 發(fā)布設(shè)置 207
18-3-2 發(fā)布預(yù)覽 213
18-4 上機(jī)指導(dǎo) 214
18-4-1 導(dǎo)出動(dòng)畫 214
18-4-2 發(fā)布動(dòng)畫 214
18-5 課后練習(xí) 215
第19章 用多媒體為網(wǎng)頁增添生氣 216
19-1 教學(xué)目標(biāo)與重點(diǎn) 216
19-2 課堂講解：添加圖片 216
19-2-1 插入圖片 216
19-2-2 設(shè)置圖片屬性 217
19-3 課堂講解：添加聲音和
Flash對(duì)象 218
19-3-1 插入聲音 218
19-3-2 使用Flash對(duì)象 219
19-3-3 插入Shockwave
電影 221
19-4 上機(jī)指導(dǎo) 222
19-4-1 為網(wǎng)頁添加
公司圖標(biāo) 222
19-4-2 使用Flash對(duì)象 223
19-5 課后練習(xí) 224
第20章 網(wǎng)頁制作綜合實(shí)例 225
20-1 教學(xué)目標(biāo)與重點(diǎn) 225
20-2 課堂講解：用Dreamweaver規(guī)劃站點(diǎn)結(jié)構(gòu)
和主頁布局 225
20-2-1 規(guī)劃站點(diǎn)結(jié)構(gòu) 225
20-2-2 布局頁面 227
20-3 課堂講解：制作主頁 228
20-3-1 利用Fireworks
制作網(wǎng)站標(biāo)志 228
20-3-2 利用Fireworks制作
導(dǎo)航條 229
20-3-3 利用Fireworks制作
網(wǎng)頁標(biāo)題動(dòng)畫 231
20-3-4 利用Flash制作
網(wǎng)頁動(dòng)畫 233
20-3-5 制作主頁 234
20-4 上機(jī)指導(dǎo) 236
20-4-1 站點(diǎn)的規(guī)劃與
布局 236
20-4-2 制作網(wǎng)頁 237
20-5 課后練習(xí) 237
第21章 在線發(fā)布網(wǎng)頁 238
21-1 教學(xué)目標(biāo)與重點(diǎn) 238
21-2 課堂講解：發(fā)布網(wǎng)頁 238
21-2-1 關(guān)于Web服務(wù)器 238
21-2-2 站點(diǎn)維護(hù) 239
21-2-3 測(cè)試站點(diǎn)性能 240
21-2-4 準(zhǔn)備發(fā)布 242
21-2-5 通過因特網(wǎng)來
查看網(wǎng)頁 243
21-3 上機(jī)指導(dǎo) 243
21-3-1 發(fā)布網(wǎng)頁 243
21-3-2 通過Internet訪問
自己的網(wǎng)頁 244
21-4 課后練習(xí) 244
附錄A 部分課后練習(xí)參考答案 245
附錄B 培訓(xùn)教程配套測(cè)試題 249
附錄C 培訓(xùn)教程配套測(cè)試題
參考答案 253