Dreamweaver CC+ Flash CC+ Photoshop CC網(wǎng)頁設(shè)計（實戰(zhàn)）

第1篇 精通網(wǎng)頁設(shè)計技法
第1章 磨刀不誤砍柴工——認識Dreamweaver CC
1.1　 走進Dreamweaver CC 4
1.1.1　安裝Dreamweaver CC 4
1.1.2　啟動Dreamweaver CC 5
1.2　 Dreamweaver CC的工作環(huán)境 6
1.2.1　認識Dreamweaver CC的工作界面 6
1.2.2　 熟悉【插入】面板 8
1.3　 體驗Dreamweaver CC的新增功能 9
1.4　 創(chuàng)建站點 12
1.4.1　案例1——創(chuàng)建本地站點 12
1.4.2　案例2——創(chuàng)建遠程站點 13
1.5　管理站點 14
1.5.1　案例3——打開站點 14
1.5.2　案例4——編輯站點 14
1.5.3　案例5——刪除站點 15
1.5.4　案例6——復(fù)制站點 16
1.6　操作站點文件及文件夾 16
1.6.1　案例7——創(chuàng)建文件夾 16
1.6.2　案例8——創(chuàng)建文件 17
1.6.3　案例9——文件或文件夾的移動和復(fù)制 17
1.6.4　案例10——刪除文件或文件夾 18
1.7　高手解惑 18
1.8　跟我練練手 20
第2章 網(wǎng)頁內(nèi)容之美——創(chuàng)建網(wǎng)頁中的文本
2.1　網(wǎng)頁設(shè)計的基本操作 21
2.1.1　案例1——新建網(wǎng)頁 21
2.1.2　案例2——保存網(wǎng)頁 21
2.1.3　案例3——打開網(wǎng)頁 23
2.1.4　案例4——預(yù)覽網(wǎng)頁 23
2.2　設(shè)置頁面屬性 24
2.3　用文字充實網(wǎng)頁 28
2.3.1　案例5——插入文字 28
2.3.2　案例6——設(shè)置字體 29
2.3.3　案例7——設(shè)置字號 30
2.3.4　案例8——設(shè)置字體顏色 31
2.3.5　案例9——設(shè)置字體樣式 32
2.3.6　案例10——編輯段落 33
2.3.7　案例11——檢查拼寫 38
2.3.8　案例12——創(chuàng)建項目列表 39
2.4　特殊文本的操作 41
2.4.1　案例13——插入換行符 41
2.4.2　案例14——插入水平線 42
2.4.3　案例15——插入日期 42
2.4.4　案例16——插入特殊字符 43
2.4.5　案例17——插入注釋 44
2.5　實戰(zhàn)演練——設(shè)置主頁中的跟蹤圖像 44
2.6　高手解惑 46
2.7　跟我練練手 46
第3章 有圖有真相——使用圖像和多媒體
3.1　 選擇適合網(wǎng)頁中圖像的格式 48
3.2　 用圖像美化網(wǎng)頁 49
3.2.1　案例1——插入圖像 49
3.2.2　案例2——圖像屬性設(shè)置 50
3.2.3　案例3——圖像的對齊方式 52
3.2.4　案例4——插入鼠標經(jīng)過圖像 52
3.2.5　案例5——插入圖像占位符 54
3.3　在網(wǎng)頁中插入多媒體 55
3.3.1　案例6——插入背景音樂 55
3.3.2　案例7——插入Flash動畫 56
3.3.3　案例8——插入FLV視頻 57
3.3.4　案例9——插入HTML5音頻 59
3.3.5　案例10——插入HTML5視頻 59
3.4　實戰(zhàn)演練——制作圖文并茂的網(wǎng)頁 61
3.5　高手解惑 62
3.6　跟我練練手 63
第4章 不在網(wǎng)頁中迷路——設(shè)計網(wǎng)頁超鏈接
4.1　鏈接與路徑 66
4.1.1　鏈接的概念 66
4.1.2　鏈接路徑 66
4.1.3　鏈接的類型 67
4.2　 添加網(wǎng)頁超鏈接 68
4.2.1　案例1——添加文本鏈接 68
4.2.2　案例2——添加圖像鏈接 69
4.2.3　案例3——創(chuàng)建外部鏈接 70
4.2.4　案例4——創(chuàng)建錨記鏈接 70
4.2.5　案例5——創(chuàng)建圖像熱點鏈接 72
4.2.6　案例6——創(chuàng)建電子郵件鏈接 72
4.2.7　案例7——創(chuàng)建下載文件的鏈接 73
4.2.8　案例8——創(chuàng)建空鏈接 74
4.2.9　案例9——創(chuàng)建腳本鏈接 74
4.3　案例10——鏈接的檢查 75
4.4　實戰(zhàn)演練——為企業(yè)網(wǎng)站添加友情鏈接 76
4.5　高手解惑 77
4.6　跟我練練手 77
第5章 簡單的網(wǎng)頁布局——表格的應(yīng)用
5.1　插入表格 80
5.2　選擇表格 81
5.2.1　案例1——選擇完整的表格 81
5.2.2　案例2——選擇行和列 82
5.2.3　案例3——選擇單元格 82
5.3　表格屬性 83
5.3.1　案例4——設(shè)置單元格屬性 83
5.3.2　案例5——設(shè)置整個表格屬性 84
5.4　操作表格 84
5.4.1　案例6——調(diào)整大小 85
5.4.2　案例7——增加行、列 85
5.4.3　案例8——刪除行、列、單元格內(nèi)容 86
5.4.4　案例9——剪切、復(fù)制和粘貼單元格 87
5.4.5　案例10——合并和拆分單元格 87
5.5　操作表格數(shù)據(jù) 88
5.5.1　案例11——向表格中輸入文本 89
5.5.2　案例12——向表格中插入圖像 89
5.5.3　案例13——表格數(shù)據(jù)的排序 89
5.5.4　案例14——導(dǎo)入表格數(shù)據(jù) 90
5.5.5　案例15——導(dǎo)出表格數(shù)據(jù) 91
5.6　實戰(zhàn)演練——使用表格布局網(wǎng)頁 92
5.7　高手解惑 94
5.8　跟我練練手 95
第6章 讓網(wǎng)頁互動起來——使用網(wǎng)頁表單和行為
6.1　認識表單 98
6.2　在網(wǎng)頁中插入表單元素 98
6.2.1　案例1——插入表單域 98
6.2.2　案例2——插入文本域 99
6.2.3　案例3——插入密碼域 100
6.3　在網(wǎng)頁中插入復(fù)選框和單選按鈕 101
6.3.1　案例4——插入復(fù)選框 101
6.3.2　案例5——插入單選按鈕 102
6.4　制作網(wǎng)頁列表和菜單 102
6.4.1　案例6——插入下拉菜單 103
6.4.2　案例7——插入滾動列表 103
6.5　在網(wǎng)頁中插入按鈕 104
6.5.1　案例8——插入按鈕 104
6.5.2　案例9——插入圖像按鈕 104
6.6　插入文件上傳域 105
6.7　添加網(wǎng)頁行為 106
6.7.1　案例10——打開【行為】面板 106
6.7.2　案例11——添加行為 107
6.8　常用行為的應(yīng)用 107
6.8.1　案例12——交換圖像 107
6.8.2　案例13——彈出信息 109
6.8.3　案例14——打開瀏覽器窗口 110
6.8.4　案例15——檢查表單行為 111
6.8.5　案例16——設(shè)置狀態(tài)欄文本 113
6.9　實戰(zhàn)演練——使用表單制作留言本 114
6.10　高手解惑 117
6.11　跟我練練手 118
第7章 批量制作風(fēng)格統(tǒng)一的網(wǎng)頁——使用模板和庫
7.1　 創(chuàng)建模板 120
7.1.1　案例1——在空白文檔中創(chuàng)建模板 120
7.1.2　案例2——在【資源】面板中創(chuàng)建模板 120
7.1.3　案例3——從現(xiàn)有文檔創(chuàng)建模板 121
7.1.4　案例4——創(chuàng)建可編輯區(qū)域 121
7.2　管理模板 123
7.2.1　案例5——從模板中分離 123
7.2.2　案例6——更新模板及基于模板的網(wǎng)頁 123
7.3　庫概述 124
7.4　庫的創(chuàng)建、管理與應(yīng)用 125
7.4.1　案例7——創(chuàng)建庫項目 125
7.4.2　案例8——庫項目的應(yīng)用 126
7.4.3　案例9——編輯庫項目 127
7.5　實戰(zhàn)演練——創(chuàng)建基于模板的頁面 128
7.6　高手解惑 130
7.7　跟我練練手 130
第2篇 精通網(wǎng)頁設(shè)計藝術(shù)
第8章 第一視覺最重要——網(wǎng)站配色與布局
8.1　 善用色彩設(shè)計網(wǎng)頁 134
8.1.1　認識色彩 134
8.1.2　案例1——網(wǎng)頁上的色彩處理 135
8.2　 網(wǎng)頁色彩的搭配 138
8.2.1　案例2——確定網(wǎng)站的主題色 138
8.2.2　案例3——網(wǎng)頁色彩搭配原理 139
8.2.3　案例4——網(wǎng)頁中色彩的搭配 141
8.2.4　案例5——網(wǎng)頁元素的色彩搭配 143
8.2.5　案例6——網(wǎng)頁色彩搭配的技巧 144
8.3　布局網(wǎng)站板塊結(jié)構(gòu) 146
8.3.1　案例7——“國”字型 146
8.3.2　案例8——標題正文型 146
8.3.3　案例9——左右框架型 146
8.3.4　案例10——上下框架型 147
8.3.5　案例11——綜合框架型 147
8.3.6　案例12——封面型 147
8.3.7　案例13——Flash型 147
8.4　網(wǎng)站配色應(yīng)用案例 148
8.4.1　案例14——網(wǎng)絡(luò)購物網(wǎng)站色彩應(yīng)用 148
8.4.2　案例15——游戲網(wǎng)站色彩應(yīng)用 148
8.4.3　案例16——企業(yè)門戶網(wǎng)站色彩應(yīng)用 149
8.4.4　案例17——時政新聞網(wǎng)站色彩應(yīng)用 152
8.4.5　案例18——影音視頻網(wǎng)站色彩應(yīng)用 152
8.4.6　案例19——電子商務(wù)網(wǎng)站色彩應(yīng)用 153
8.4.7　案例20——娛樂網(wǎng)站色彩應(yīng)用 154
8.5　實戰(zhàn)演練——定位網(wǎng)站頁面的框架 154
8.6　高手解惑 156
8.7　跟我練練手 156
第9章 讀懂樣式表密碼——使用CSS 樣式表美化網(wǎng)頁
9.1　初識CSS 158
9.1.1　CSS概述 158
9.1.2　CSS的作用 158
9.1.3　基本CSS語法 159
9.1.4　案例1——使用Dreamweaver CC
編寫CSS 159
9.2　使用CSS的方法 161
9.2.1　案例2——行內(nèi)樣式 161
9.2.2　案例3——內(nèi)嵌樣式 162
9.2.3　案例4——鏈接樣式 163
9.2.4　案例5——導(dǎo)入樣式 164
9.2.5　案例6——優(yōu)先級問題 165
9.3　使用CSS樣式美化網(wǎng)頁 167
9.3.1　案例7——使用字體樣式美化文字 167
9.3.2　案例8——使用文本樣式美化文本 168
9.3.3　案例9——使用背景樣式美化背景 169
9.4　實戰(zhàn)演練——設(shè)定網(wǎng)頁中鏈接樣式 171
9.5　高手解惑 174
9.6　跟我練練手 174
第10章 架構(gòu)師的大比拼——網(wǎng)頁布局典型范例
10.1　 使用CSS排版 176
10.1.1　案例1——將頁面用div分塊 176
10.1.2　案例2——設(shè)置各塊位置 176
10.1.3　案例3——用CSS定位 176
10.2　固定寬度網(wǎng)頁剖析與布局 179
10.2.1　案例4——網(wǎng)頁單列布局模式 179
10.2.2　案例5——網(wǎng)頁1-2-1型布局模式 182
10.3　自動縮放網(wǎng)頁1-2-1型布局模式 186
10.3.1　案例6——“1-2-1”等比例變寬布局 186
10.3.2　案例7——“1-2-1”單列變寬布局 186
10.4　實戰(zhàn)演練——使用CSS設(shè)定網(wǎng)頁
布局列的背景色 187
10.5　高手解惑 188
10.6　跟我練練手 189
第3篇 精通網(wǎng)頁元素設(shè)計技法
第11章 網(wǎng)頁元素設(shè)計利器——Photoshop CC
11.1　Photoshop CC工作界面 194
11.1.1　案例1——認識菜單欄 194
11.1.2　案例2——認識選項欄 194
11.1.3　案例3——認識工具箱 195
11.1.4　案例4——認識圖像窗口 196
11.1.5　案例5——認識面板 197
11.1.6　案例6——認識狀態(tài)欄 198
11.2　文件的基本操作 199
11.2.1　案例7——新建文件 199
11.2.2　案例8——打開文件 201
11.2.3　案例9——保存文件 202
11.2.4　案例10——置入文件 203
11.3　應(yīng)用圖像輔助工具 204
11.3.1　案例11——使用標尺 204
11.3.2　案例12——使用參考線 205
11.3.3　案例13——使用對齊功能 206
11.4　實戰(zhàn)演練——載入預(yù)設(shè)資源 206
11.5　高手解惑 208
11.6　跟我練練手 208
第12章 網(wǎng)頁中的文字設(shè)計——制作網(wǎng)頁文字特效
12.1　文字的類型 210
12.2　輸入文字 210
12.2.1　通過文字工具輸入文字 210
12.2.2　通過文字蒙版工具輸入文字選區(qū) 212
12.2.3　轉(zhuǎn)換點文字和段落文字 213
12.2.4　轉(zhuǎn)換文字排列方向 213
12.3　設(shè)置文字格式 214
12.3.1　通過選項欄設(shè)置格式 214
12.3.2　通過字符面板設(shè)置文字格式 215
12.3.3　通過段落面板設(shè)置段落格式 216
12.4　制作常見特效文字 218
12.4.1　制作路徑文字 218
12.4.2　制作變形文字 210
12.5　實戰(zhàn)演練——為文本添加外部
字體樣式 211
12.6　高手解惑 212
12.7　跟我練練手 213
第13章 網(wǎng)頁中迷人的藍?！谱骶W(wǎng)頁按鈕與特效邊線
13.1　制作按鈕 216
13.1.1　案例1——制作普通按鈕 216
13.1.2　案例2——制作迷你按鈕 218
13.1.3　案例3——制作水晶按鈕 230
13.1.4　案例4——制作木紋按鈕 235
13.2　制作裝飾邊線 238
13.2.1　案例5——制作裝飾虛線 238
13.2.2　案例6——制作分割線條 240
13.2.3　案例7——制作斜紋區(qū)域 240
13.3　高手解惑 241
13.4　跟我練練手 242
第14章 網(wǎng)站中的路標——制作網(wǎng)頁導(dǎo)航條
14.1　網(wǎng)頁導(dǎo)航條簡介 244
14.2　制作網(wǎng)頁導(dǎo)航條 244
14.2.1　案例1——制作導(dǎo)航條框架 244
14.2.2　案例2——制作斜紋 245
14.2.3　案例3——制作縱向?qū)Ш綏l 246
14.3　高手解惑 248
14.4　跟我練練手 249
第4篇 精通網(wǎng)頁動畫設(shè)計
第15章 讓網(wǎng)頁活靈活現(xiàn)——制作簡單網(wǎng)頁動畫
15.1　了解Flash CC 254
15.1.1　繪制矢量繪圖 254
15.1.2　設(shè)計制作動畫 254
15.1.3　強大的編程功能 254
15.2　Flash CC的工作界面 255
15.3　Flash CC的基本操作 260
15.3.1　案例1——新建Flash文件 260
15.3.2　案例2——打開Flash文件 261
15.3.3　案例3——保存和關(guān)閉Flash文件 262
15.4　使用文本工具 264
15.4.1　案例4——利用文本工具輸入文字 264
15.4.2　案例5——設(shè)置文本字符屬性 264
15.4.3　案例6——設(shè)置傳統(tǒng)文本的段落屬性 265
15.5　變形文本 266
15.6　分離文本 267
15.7　高手解惑 268
15.8　跟我練練手 268
第16章 動畫的核心技術(shù)——使用時間軸、幀和圖層
16.1　制作Flash CC動畫基礎(chǔ) 270
16.1.1　案例1——動作補間動畫的制作 270
16.1.2　案例2——形狀補間動畫的制作 271
16.2　圖層操作基礎(chǔ) 273
16.2.1　案例3——創(chuàng)建圖層和圖層文件夾 273
16.2.2　案例4——編輯圖層 275
16.2.3　案例5——設(shè)置圖層的狀態(tài)與屬性 277
16.3　時間軸與幀 279
16.3.1　案例6——幀的分類 279
16.3.2　案例7——插入幀 280
16.3.3　案例8——幀標簽、注釋和錨記 281
16.4　對幀進行操作 282
16.4.1　案例9——幀的刪除和清除 282
16.4.2　案例10——幀的選取、復(fù)制、
粘貼和移動 282
16.4.3　案例11——翻轉(zhuǎn)幀與洋蔥皮工具 283
16.5　實戰(zhàn)演練——制作數(shù)字倒計時動畫 284
16.6　高手解惑 286
16.7　跟我練練手 287
第17章 利用元件和庫組織動畫素材
17.1　創(chuàng)建Flash元件 290
17.1.1　元件概述與分類 290
17.1.2　案例1——創(chuàng)建元件 290
17.1.3　案例2——調(diào)用其他文檔中的元件 295
17.2　使用實例 296
17.2.1　案例3——為實例另外指定一個元件 296
17.2.2　案例4——改變實例 297
17.3　使用“庫”面板 298
17.3.1　認識“庫”面板 298
17.3.2　案例5——庫的管理與使用 299
17.4　實戰(zhàn)演練——制作絢麗網(wǎng)頁按鈕 301
17.5　高手解惑 306
17.6　跟我練練手 306
第18章 制作動態(tài)網(wǎng)站Logo與Banner
18.1　 制作滾動文字Logo 308
18.1.1　設(shè)置文檔屬性 308
18.1.2　制作文字元件 308
18.1.3　制作滾動效果 309
18.2　 制作產(chǎn)品Banner 311
18.2.1　制作文字動畫 311
18.2.2　制作文字遮罩動畫 313
18.2.3　制作圖片動畫 313
18.3　 高手解惑 315
18.4　 跟我練練手 315
第5篇 綜合網(wǎng)站開發(fā)實戰(zhàn)
第19章 綜合案例實戰(zhàn)1——Photoshop CC設(shè)計網(wǎng)頁
19.1　設(shè)計網(wǎng)頁Logo 320
19.2　設(shè)計網(wǎng)頁導(dǎo)航欄 323
19.3　設(shè)計網(wǎng)頁的Banner 323
19.4　設(shè)計網(wǎng)頁正文部分 327
19.4.1　設(shè)計正文導(dǎo)航 327
19.4.2　設(shè)計正文內(nèi)容 329
19.5　設(shè)計網(wǎng)頁頁腳部分 332
19.6　組合在線購物網(wǎng)頁 332
19.7　保存網(wǎng)頁 334
19.8　對網(wǎng)頁進行切片處理 335
第20章 綜合案例實戰(zhàn)2——制作個人Flash網(wǎng)站
20.1　實例分析 338
20.1.1　背景概述 338
20.1.2　實例簡介 338
20.2　主要知識點 338
20.3　具體的設(shè)計步驟 339
20.3.1　網(wǎng)站結(jié)構(gòu)規(guī)劃 339
20.3.2　主場景的設(shè)計 339
20.3.3　次場景的設(shè)計 342
20.4　高手解惑 346
第21章 開發(fā)網(wǎng)站交互留言板系統(tǒng)
21.1 　系統(tǒng)的功能分析 348
21.1.1　規(guī)劃網(wǎng)頁結(jié)構(gòu)和功能 348
21.1.2　網(wǎng)頁美工設(shè)計 348
21.2　 數(shù)據(jù)庫設(shè)計與連接 349
21.2.1　數(shù)據(jù)庫的設(shè)計 349
21.2.2　創(chuàng)建數(shù)據(jù)庫連接 352
21.3　 留言板管理系統(tǒng)頁面的制作 354
21.3.1　留言板管理系統(tǒng)主頁面的制作 354
21.3.2　訪問者留言頁面的制作 360
21.4　 留言板系統(tǒng)后臺管理的制作 362
21.4.1　管理員登錄頁面的制作 362
21.4.2　留言板后臺管理主頁面的制作 363
21.4.3　刪除留言頁面 367
第21章 行業(yè)綜合案例4——制作移動設(shè)備類型網(wǎng)頁
21.1　網(wǎng)站設(shè)計分析 370
21.2　網(wǎng)站結(jié)構(gòu)分析 370
21.3　網(wǎng)站主頁面的制作 371
21.4　網(wǎng)站成品預(yù)覽 372
第23章 讓別人瀏覽我的成果—網(wǎng)站的發(fā)布
23.1　上傳網(wǎng)站前的準備工作 380
23.1.1　注冊域名 380
23.1.2　申請空間 381
23.2　測試網(wǎng)站 382
23.2.1　案例1——測試站點范圍的鏈接 382
23.2.2　案例2——改變站點范圍的鏈接 382
23.2.3　案例3——查找和替換 383
23.2.4　案例4——清理文檔 384
23.3　上傳網(wǎng)站 384
23.3.1　案例5——使用Dreamweaver
上傳網(wǎng)站 385
23.3.2　案例6——使用FTP工具上傳網(wǎng)站 386
23.4　高手解惑 388
23.5　跟我練練手 389