第1章 網(wǎng)頁設(shè)計基礎(chǔ)
1.1 網(wǎng)頁開發(fā)概述 2
1.1.1 什么是網(wǎng)站 2
1.1.2 網(wǎng)站的類型 2
1.1.3 網(wǎng)站開發(fā)流程 6
1.1.4 認識網(wǎng)頁 7
1.2 網(wǎng)頁設(shè)計理念 9
1.2.1 網(wǎng)頁色彩基礎(chǔ) 9
1.2.2 網(wǎng)頁配色藝術(shù) 10
1.2.3 網(wǎng)頁布局藝術(shù) 12
1.3 網(wǎng)頁設(shè)計常用工具 15
1.4 AIGC在網(wǎng)頁設(shè)計中的應(yīng)用 16
新手答疑 18
第2章 Dreamweaver輕松入門
2.1 Dreamweaver工作界面 20
2.2.1 工作區(qū) 20
2.2.2 自定義軟件界面 20
2.2.3 4種視圖模式 22
動手練 自定義首選項 23
2.2 站點的創(chuàng)建與管理 24
2.2.1 創(chuàng)建站點 24
2.2.2 編輯站點 25
2.2.3 導(dǎo)入和導(dǎo)出站點 26
2.2.4 新建文件或文件夾 26
2.2.5 編輯文件或文件夾 26
2.3 文檔的基礎(chǔ)操作 27
2.3.1 新建文檔 27
2.3.2 打開文檔 27
2.3.3 插入文檔 27
2.3.4 保存文檔 28
2.3.5 關(guān)閉文檔 28
綜合實戰(zhàn):網(wǎng)頁本地站點的創(chuàng)建 28
新手答疑 30
第3章 制作網(wǎng)頁內(nèi)容
3.1 插入網(wǎng)頁文本 32
3.1.1 插入文本 32
3.1.2 設(shè)置文本格式 32
3.1.3 設(shè)置段落格式 33
3.1.4 設(shè)置文本樣式 34
3.1.5 使用列表 34
3.1.6 在網(wǎng)頁中插入特殊元素 35
動手練 為讀書網(wǎng)頁添加文本 36
3.2 插入網(wǎng)頁圖像 38
3.2.1 插入圖像 38
3.2.2 圖像的屬性設(shè)置 38
3.2.3 圖像的對齊方式 39
動手練 為餐具網(wǎng)頁添加圖像 40
3.2.4 替換文本 40
3.2.5 鼠標(biāo)經(jīng)過圖像 40
3.3 插入多媒體元素 42
3.3.1 插入HTML 5 Video元素 42
3.3.2 插入HTML 5 Audio元素 43
動手練 為視頻網(wǎng)頁添加小視頻 44
3.4 創(chuàng)建超鏈接 45
3.4.1 超鏈接路徑 45
3.4.2 創(chuàng)建超鏈接 46
3.4.3 管理網(wǎng)頁超鏈接 49
動手練 為裝飾網(wǎng)頁添加超鏈接 50
綜合實戰(zhàn):制作影音網(wǎng)站首頁 52
新手答疑 56
第4章 設(shè)計網(wǎng)頁布局
4.1 網(wǎng)頁布局類型 58
4.2 用表格布局網(wǎng)頁 58
4.2.1 插入表格 58
4.2.2 表格屬性 59
4.2.3 編輯表格 61
動手練 制作建筑企業(yè)網(wǎng)頁 63
4.3 Div與CSS布局基礎(chǔ) 66
4.3.1 Div概述 66
4.3.2 創(chuàng)建Div 66
4.3.3 CSS布局方法 67
動手練 制作首飾店網(wǎng)頁 69
綜合實戰(zhàn):制作咖啡小店網(wǎng)頁 73
新手答疑 78
第5章 使用CSS美化網(wǎng)頁
5.1 創(chuàng)建CSS樣式 80
5.1.1 CSS的定義 80
5.1.2 CSS設(shè)計器 81
5.1.3 創(chuàng)建CSS樣式 81
5.1.4 CSS屬性 83
動手練 美化運動網(wǎng)頁 86
5.2 CSS規(guī)則定義 89
5.2.1 類型 89
5.2.2 背景 90
5.2.3 區(qū)塊 90
5.2.4 方框 91
5.2.5 邊框 91
5.2.6 列表 91
5.2.7 定位 92
5.2.8 擴展 92
5.2.9 過渡 92
動手練 調(diào)整綠植網(wǎng)頁樣式 93
綜合實戰(zhàn):美化自行車網(wǎng)頁 95
新手答疑 100
第6章 應(yīng)用交互特效
6.1 什么是行為 102
6.1.1 行為 102
6.1.2 常見事件 103
6.2 窗口交互行為 104
6.2.1 調(diào)用JavaScript 104
6.2.2 轉(zhuǎn)到URL 104
6.2.3 打開瀏覽器窗口 105
6.3 圖像交互行為 105
6.3.1 交換圖像與恢復(fù)交換圖像 105
6.3.2 預(yù)先載入圖像 106
6.3.3 顯示-隱藏元素 106
動手練 網(wǎng)頁交換圖像 107
6.4 文本交互行為 108
6.4.1 彈出信息 108
6.4.2 設(shè)置狀態(tài)欄文本 108
6.4.3 設(shè)置容器的文本 109
6.4.4 設(shè)置文本域文字 109
動手練 為網(wǎng)頁添加文本交互行為 109
6.5 表單交互行為 110
6.5.1 跳轉(zhuǎn)菜單 110
6.5.2 檢查表單 110
綜合實戰(zhàn):提升購物網(wǎng)頁交互性 111
新手答疑 114
第7章 創(chuàng)建動態(tài)網(wǎng)頁
7.1 使用表單 116
7.1.1 認識表單 116
7.1.2 基本表單對象 116
7.2 文本類表單 117
7.2.1 文本 117
7.2.2 密碼 118
7.2.3 文本區(qū)域 118
動手練 制作科技網(wǎng)站登錄頁 119
7.3 選擇類表單 121
7.3.1 單選按鈕和單選按鈕組 121
7.3.2 復(fù)選框和復(fù)選框組 122
7.3.3 選擇 123
7.4 其他常用表單 123
7.4.1 提交和重置按鈕 123
7.4.2 文件 124
動手練 制作旅社預(yù)訂頁 124
綜合實戰(zhàn):設(shè)計知識競賽網(wǎng)頁 128
新手答疑 132
第8章 網(wǎng)頁模板與庫
8.1 創(chuàng)建模板 134
8.1.1 直接創(chuàng)建模板 134
8.1.2 從現(xiàn)有網(wǎng)頁中創(chuàng)建模板 134
動手練 制作服裝網(wǎng)頁模板 135
8.2 管理和使用模板 136
8.2.1 編輯模板 136
8.2.2 應(yīng)用模板 137
8.2.3 從模板中分離 138
8.2.4 更新頁面 138
動手練 應(yīng)用服裝網(wǎng)頁模板 138
8.3 庫項目 141
8.3.1 創(chuàng)建庫項目 141
8.3.2 應(yīng)用庫項目 142
8.3.3 編輯和更新庫項目 143
綜合實戰(zhàn):制作自然科普網(wǎng)頁模板并應(yīng)用 144
新手答疑 148
第9章 網(wǎng)頁動畫基礎(chǔ)知識
9.1 Animate工作界面 150
9.2 文檔基本操作 151
9.2.1 新建文檔 151
9.2.2 設(shè)置文檔屬性 152
9.2.3 打開已有文檔 152
9.2.4 導(dǎo)入素材 152
9.2.5 保存文檔 153
9.2.6 測試與發(fā)布動畫 153
動手練 導(dǎo)出網(wǎng)頁可用GIF動畫 155
9.3 繪制矢量圖形 156
9.3.1 輔助繪圖工具 156
9.3.2 繪制線條 157
9.3.3 繪制簡單圖形 158
9.3.4 繪制復(fù)雜圖形 161
9.3.5 設(shè)計圖形色彩 162
9.3.6 編輯所繪圖形 164
動手練 繪制雪花造型豐富網(wǎng)頁 168
綜合實戰(zhàn):繪制電視機網(wǎng)頁圖標(biāo) 169
新手答疑 172
第10章 網(wǎng)頁動畫的制作
10.1 時間軸與圖層 174
10.1.1 認識時間軸 174
10.1.2 圖層的基本操作 174
10.1.3 幀的基本操作 176
動手練 網(wǎng)頁標(biāo)題文字跳動動畫 178
10.2 元件 180
10.2.1 元件的類型 180
10.2.2 創(chuàng)建元件 181
10.2.3 編輯元件 182
10.2.4 實例的創(chuàng)建與編輯 183
動手練 頁面文字出現(xiàn)動畫 184
10.3 庫 187
10.3.1 認識庫面板 187
10.3.2 重命名庫項目 187
10.3.3 創(chuàng)建文件夾 187
10.4 動畫的制作 188
10.4.1 逐幀動畫 188
10.4.2 補間動畫 188
10.4.3 引導(dǎo)動畫 190
10.4.4 遮罩動畫 191
10.4.5 交互動畫 191
動手練 網(wǎng)頁遮罩動畫 194
綜合實戰(zhàn):制作網(wǎng)頁輪播圖動畫 197
新手答疑 200
第11章 網(wǎng)頁特效的制作
11.1 文本的應(yīng)用 202
11.1.1 文本類型 202
11.1.2 設(shè)置文字屬性 203
11.1.3 設(shè)置段落格式 203
11.1.4 創(chuàng)建文本鏈接 204
動手練 文字網(wǎng)站文字變形動畫 204
11.2 濾鏡的應(yīng)用 205
11.2.1 認識濾鏡 205
11.2.2 編輯濾鏡 206
動手練 網(wǎng)頁鏤空裝飾文字 207
11.3 音視頻的應(yīng)用 207
11.3.1 音視頻文件格式 207
11.3.2 導(dǎo)入聲音 208
11.3.3 編輯優(yōu)化聲音 209
11.3.4 導(dǎo)入視頻文件 211
11.3.5 編輯處理視頻 212
動手練 制作網(wǎng)頁裝飾性小視頻 212
綜合實戰(zhàn):制作音頻播放頁面 214
新手答疑 216
第12章 網(wǎng)頁圖像基礎(chǔ)知識
12.1 Photoshop軟件簡介 218
12.1.1 Photoshop工作界面 218
12.1.2 自定義圖像窗口 219
12.2 編輯圖像文檔 220
12.2.1 圖像文檔管理 220
12.2.2 圖像尺寸調(diào)整 222
12.2.3 畫布尺寸調(diào)整 222
12.2.4 裁剪工具 222
動手練 裁剪網(wǎng)頁圖像 223
12.3 頁面布局工具 224
12.3.1 標(biāo)尺 224
12.3.2 網(wǎng)格 224
12.3.3 參考線 224
12.4 網(wǎng)頁圖像基礎(chǔ)知識 225
12.4.1 位圖與矢量圖 225
12.4.2 分辨率 225
12.4.3 圖像格式 226
12.4.4 圖像顏色模式 226
綜合實戰(zhàn):為網(wǎng)頁圖像添加邊框 227
新手答疑 228
第13章 網(wǎng)頁圖像的處理
13.1 創(chuàng)建與編輯選區(qū) 230
13.1.1 創(chuàng)建選區(qū) 230
13.1.2 編輯選區(qū) 231
動手練 合成奇幻網(wǎng)頁圖像 233
13.2 修改圖像 234
13.2.1 橡皮擦工具組 234
13.2.2 圖章工具組 235
13.2.3 修復(fù)工具組 236
動手練 修復(fù)網(wǎng)頁圖像 237
13.3 圖層與蒙版 238
13.3.1 圖層的基本操作 238
13.3.2 圖層樣式的運用 241
13.3.3 圖層的混合模式 242
13.3.4 圖層蒙版的操作 243
動手練 合成趣味網(wǎng)頁圖像 245
13.4 調(diào)整網(wǎng)頁圖像 248
12.4.1 色彩三要素 248
12.4.2 常用圖像調(diào)整命令 249
12.4.3 調(diào)整圖層 250
動手練 網(wǎng)頁圖像調(diào)色 251
13.5 運用濾鏡增強網(wǎng)頁圖像的效果 253
13.5.1 使用濾鏡庫 253
13.5.2 風(fēng)格化濾鏡組 253
13.5.3 模糊濾鏡組 254
13.5.4 扭曲濾鏡組 255
13.5.5 像素化濾鏡組 256
動手練 網(wǎng)頁圖像內(nèi)容添加 257
綜合實戰(zhàn):制作線上課程封面 258
新手答疑 262
第14章 網(wǎng)頁元素的設(shè)計
14.1 設(shè)計網(wǎng)頁文字 264
14.1.1 輸入和編輯文字 264
14.1.2 路徑文字 266
14.2 設(shè)計標(biāo)志和圖標(biāo) 267
14.2.1 制作網(wǎng)站標(biāo)志 267
14.2.2 制作頁面圖標(biāo) 268
14.3 設(shè)計按鈕和導(dǎo)航條 269
14.3.1 繪制網(wǎng)頁按鈕 269
動手練 制作下載按鈕 269
14.3.2 繪制網(wǎng)頁導(dǎo)航條 271
動手練 制作電影網(wǎng)站首頁導(dǎo)航條 271
14.4 設(shè)計網(wǎng)頁廣告 273
14.4.1 制作Banner 273
動手練 制作茶文化網(wǎng)站首頁Banner 273
14.4.2 制作網(wǎng)頁通欄廣告 274
動手練 制作鞋類產(chǎn)品促銷通欄廣告 274
14.5 設(shè)計網(wǎng)頁并輸出 276
14.5.1 制作網(wǎng)站首頁 276
動手練 制作美食網(wǎng)站首頁 277
14.5.2 創(chuàng)建切片 281
動手練 創(chuàng)建美食網(wǎng)站首頁切片 281
14.5.3 優(yōu)化導(dǎo)出切片 282
動手練 導(dǎo)出美食網(wǎng)站首頁切片 282
綜合實戰(zhàn):繪制咖啡網(wǎng)站標(biāo)志 284
新手答疑 286
附贈 HTML 5知識手冊
(本部分內(nèi)容請掃碼查看電子文檔)
?設(shè)計之下,
?每次點擊都有意義。