網(wǎng)頁(yè)設(shè)計(jì)與網(wǎng)站建設(shè)自學(xué)經(jīng)典

第1章  網(wǎng)站建設(shè)基礎(chǔ)知識(shí)... 1

1.1  網(wǎng)站基礎(chǔ)知識(shí)概況... 2

1.1.1 什么是網(wǎng)站... 2

1.1.2 靜態(tài)網(wǎng)站... 2

1.1.3 動(dòng)態(tài)網(wǎng)站... 3

1.1.4 申請(qǐng)域名... 4

1.1.5 申請(qǐng)服務(wù)器空間... 4

1.2  網(wǎng)頁(yè)界面構(gòu)成元素... 5

1.2.1 Logo和導(dǎo)航條... 5

1.2.2 Banner和內(nèi)容版塊... 6

1.2.3 版尾版塊... 6

1.3  網(wǎng)頁(yè)版塊結(jié)構(gòu)... 7

1.3.1 “國(guó)”字框架... 7

1.3.2 拐角框架... 7

1.3.3 左右框架... 8

1.3.4 上下框架... 8

1.3.5 封面框架... 9

1.4  網(wǎng)頁(yè)設(shè)計(jì)目的... 9

1.4.1 資訊類(lèi)網(wǎng)站... 10

1.4.2 藝術(shù)資訊類(lèi)和藝術(shù)類(lèi)網(wǎng)站... 10

1.5  網(wǎng)頁(yè)設(shè)計(jì)的實(shí)現(xiàn)... 10

1.5.1 設(shè)計(jì)結(jié)構(gòu)圖... 11

1.5.2 設(shè)計(jì)界面... 11

1.5.3 設(shè)計(jì)字體... 11

1.5.4 制作網(wǎng)頁(yè)概念圖... 11

1.5.5 切片的優(yōu)化... 12

1.5.6 編寫(xiě)代碼和優(yōu)化頁(yè)面... 12

1.6  網(wǎng)頁(yè)色彩基礎(chǔ)... 12

1.6.1 RGB色彩體系... 12

1.6.2 色彩的屬性... 13

1.6.3 色彩模式... 13

1.6.4 網(wǎng)頁(yè)色彩搭配技巧... 14

1.7  網(wǎng)站策劃... 14

1.7.1  確定網(wǎng)站風(fēng)格和布局... 14

1.7.2  網(wǎng)站整體規(guī)劃... 15

1.7.3  搜集、整理素材... 15

1.7.4  規(guī)劃站點(diǎn)、制作網(wǎng)頁(yè)... 16

1.7.5  發(fā)布與上傳... 16

1.7.6 后期更新與維護(hù)... 17

1.7.7  網(wǎng)站的推廣... 17

1.8  網(wǎng)頁(yè)設(shè)計(jì)與網(wǎng)站建設(shè)常用軟件... 17

1.8.1 編寫(xiě)網(wǎng)頁(yè)代碼軟件

Dreamweaver 17

1.8.2 Dreamweaver窗口界面... 18

1.8.3 網(wǎng)頁(yè)圖像處理軟件

Photoshop. 19

1.8.4  Photoshop窗口界面... 20

1.8.5 網(wǎng)頁(yè)動(dòng)畫(huà)設(shè)計(jì)軟件Flash. 22

1.8.6 Flash窗口界面... 23

第2章  網(wǎng)站與數(shù)據(jù)庫(kù)技術(shù)... 26

2.1  設(shè)計(jì)網(wǎng)站... 27

2.1.1 站點(diǎn)與訪問(wèn)者... 27

2.1.2 設(shè)置網(wǎng)站兼容性... 27

2.1.3 命名原則... 28

2.1.4 設(shè)定站點(diǎn)的風(fēng)格... 29

2.1.5 設(shè)計(jì)網(wǎng)站導(dǎo)航方案... 30

2.1.6 規(guī)劃與收集網(wǎng)站資源... 30

2.2  使用網(wǎng)站【資源】面板... 31

2.2.1 查看網(wǎng)站資源... 31

2.2.2 選擇資源類(lèi)別... 31

2.2.3 選擇與編輯資源... 32

2.2.4 刷新【資源】面板... 32

2.2.5 管理【資源】面板... 33

2.3  創(chuàng)建本地站點(diǎn)... 33

2.3.1 站點(diǎn)概述... 33

2.3.2 規(guī)劃站點(diǎn)... 35

2.3.3 建立本地站點(diǎn)... 36

2.4  數(shù)據(jù)及數(shù)據(jù)庫(kù)概述... 36

2.4.1 數(shù)據(jù)與信息... 37

2.4.2 數(shù)據(jù)庫(kù)... 37

2.4.3 數(shù)據(jù)庫(kù)管理系統(tǒng)... 37

2.4.4 關(guān)系數(shù)據(jù)庫(kù)... 38

2.5  常用數(shù)據(jù)庫(kù)及數(shù)據(jù)庫(kù)的作用... 38

2.5.1 收集用戶(hù)信息... 39

2.5.2 網(wǎng)站搜索功能... 39

2.5.3 產(chǎn)品管理和新聞系統(tǒng)... 39

2.5.4 網(wǎng)站中的常用數(shù)據(jù)... 40

2.6  Access和SQL Server數(shù)據(jù)庫(kù)... 40

2.6.1  Access數(shù)據(jù)庫(kù)用途... 41

2.6.2  Access 2010的優(yōu)點(diǎn)... 41

2.6.3 SQL Server發(fā)展歷史... 42

2.6.4 SQL Server 2008體系

結(jié)構(gòu)... 42

2.6.5 了解ODBC.. 44

第3章  圖像設(shè)計(jì)軟件Photoshop.. 46

3.1  網(wǎng)頁(yè)界面概述... 47

3.1.1 網(wǎng)頁(yè)界面設(shè)計(jì)分類(lèi)... 47

3.1.2 網(wǎng)頁(yè)界面設(shè)計(jì)的原則... 49

3.2  選擇選取... 49

3.2.1 矩形選框工具... 49

3.2.2 橢圓選框工具... 50

3.2.3 單行/單列選框工具... 51

3.2.4 套索工具組... 51

3.2.5 魔棒工具... 52

3.2.6 快速選擇工具... 52

3.2.7 色彩范圍... 53

3.3  圖層編輯... 53

3.3.1 創(chuàng)建與設(shè)置圖層... 53

3.3.2 混合選項(xiàng)... 54

3.3.3 投影和內(nèi)陰影... 55

3.3.4 外發(fā)光和內(nèi)發(fā)光... 55

3.3.5 斜面和浮雕... 56

3.3.6 光澤... 57

3.3.7 顏色疊加... 57

3.3.8 漸變疊加... 58

3.3.9 圖案疊加... 58

3.3.10 描邊... 59

3.4  編輯文本... 59

3.4.1 創(chuàng)建普通文字... 59

3.4.2 創(chuàng)建段落文本... 60

3.4.3 設(shè)置文字特征... 60

3.4.4 更改文字的外觀... 60

3.5  應(yīng)用蒙版... 61

3.5.1 快速蒙版... 61

3.5.2 剪貼蒙版... 61

3.5.3 圖層蒙版... 62

3.5.4 矢量蒙版... 62

3.6  應(yīng)用濾鏡... 62

3.6.1 模糊濾鏡... 63

3.6.2 高斯模糊濾鏡... 63

3.6.3  USM銳化濾鏡... 63

3.6.4 鏡頭光暈濾鏡... 64

3.6.5 添加雜色濾鏡... 64

3.7  制作切片... 64

3.7.1 切片工具... 64

3.7.2 切片選擇工具... 64

3.7.3 存儲(chǔ)為Web所用格式... 65

3.7.4 輸出設(shè)置... 66

3.8  綜合實(shí)戰(zhàn)... 66

3.8.1  實(shí)戰(zhàn)：設(shè)計(jì)網(wǎng)站進(jìn)入

頁(yè)界面... 66

3.8.2  實(shí)戰(zhàn)：設(shè)計(jì)化妝品廣告

網(wǎng)幅... 68

第4章  制作網(wǎng)頁(yè)動(dòng)畫(huà)Flash. 71

4.1  導(dǎo)入動(dòng)畫(huà)素材... 72

4.1.1 導(dǎo)入到舞臺(tái)... 72

4.1.2 導(dǎo)入到庫(kù)... 72

4.1.3 打開(kāi)外部庫(kù)... 72

4.2  管理庫(kù)資源... 73

4.2.1 Flash元件概述... 74

4.2.2 創(chuàng)建元件... 74

4.2.3 編輯元件... 75

4.3  繪制動(dòng)畫(huà)圖形... 75

4.3.1 線(xiàn)條工具和鋼筆工具... 76

4.3.2 橢圓工具和基本橢圓工具... 76

4.3.3 矩形工具和基本矩形工具... 76

4.3.4 多角星形工具... 77

4.3.5 填充顏色... 77

4.4  處理動(dòng)畫(huà)文本... 78

4.4.1 創(chuàng)建靜態(tài)文本和動(dòng)態(tài)文本... 78

4.4.2 輸入文本和TLF文本... 78

4.5  網(wǎng)頁(yè)動(dòng)畫(huà)類(lèi)型... 78

4.5.1 創(chuàng)建補(bǔ)間動(dòng)畫(huà)... 79

4.5.2 引導(dǎo)動(dòng)畫(huà)... 80

4.5.3 遮罩動(dòng)畫(huà)... 80

4.5.4 逐幀動(dòng)畫(huà)... 80

4.5.5 補(bǔ)間形狀動(dòng)畫(huà)... 81

4.5.6 傳統(tǒng)補(bǔ)間動(dòng)畫(huà)... 81

4.6  Flash濾鏡效果... 82

4.6.1 投影... 82

4.6.2 模糊、發(fā)光和斜角... 83

4.6.3 漸變發(fā)光和漸變斜角... 83

4.6.4 調(diào)整顏色... 84

4.6.5 動(dòng)畫(huà)預(yù)設(shè)... 84

4.7  綜合實(shí)戰(zhàn)... 84

4.7.1 實(shí)戰(zhàn)：制作網(wǎng)站進(jìn)入動(dòng)畫(huà)... 85

4.7.2 實(shí)戰(zhàn)：制作動(dòng)畫(huà)導(dǎo)航條... 87

第5章  網(wǎng)頁(yè)代碼軟件Dreamweaver 90

5.1  創(chuàng)建與管理站點(diǎn)... 91

5.1.1 了解站點(diǎn)... 91

5.1.2 建立站點(diǎn)... 91

5.1.3 管理站點(diǎn)... 93

5.1.4 復(fù)制與修改站點(diǎn)... 94

5.2  Web文件操作... 94

5.2.1 了解文件夾的結(jié)構(gòu)... 94

5.2.2 文件面板... 95

5.2.3 刪除文件或文件夾... 96

5.2.4 文件的復(fù)制和粘貼... 96

5.2.5 存回和取出文件... 97

5.2.6 添加普通文本及特殊字符... 97

5.3  插入網(wǎng)頁(yè)圖像... 98

5.3.1  在【設(shè)計(jì)】視圖中插入

圖片... 98

5.3.2 通過(guò)【資源】面板插入

圖片... 99

5.3.3 在網(wǎng)頁(yè)的源代碼中插入

圖片... 99

5.3.4 使用圖像熱區(qū)... 99

5.4  創(chuàng)建各種鏈接... 100

5.4.1 相對(duì)路徑和絕對(duì)路徑... 100

5.4.2 創(chuàng)建圖像熱點(diǎn)鏈接... 101

5.4.3 創(chuàng)建E-mail鏈接... 101

5.4.4 創(chuàng)建腳本鏈接... 102

5.4.5 創(chuàng)建下載文件鏈接... 102