學用一冊通：網頁設計與網站建設

《學用一冊通：網頁設計與網站建設》是2013年電子工業出版社出版的圖書，作者是郭海旺。

基本介紹

• 中文名：學用一冊通:網頁設計與網站建設
• 作者：郭海旺 等
• 出版社：電子工業出版社
• 出版時間：2013年6月1日
• 頁數：472 頁
• 開本：16 開
• ISBN：7121187329
• 外文名：Broadview
• 語種：簡體中文

內容簡介

《學用一冊通:網頁設計與網站建設》語言通俗易懂，知識系統全面，突出了實戰性，採用由淺入深的編排方法，內容豐富，結構清晰，實例眾多，圖文並茂，適用於以下讀者對象：網頁設計與製作人員、網站建設與開發人員、大中專院校相關專業師生、網頁製作培訓班學員、個人網站愛好者與自學讀者。

圖書目錄

第1篇

建站快速入門

網頁設計與網站建設基礎2

1.1常見的網站類型3

1.1.1個人網站3

1.1.2企業類網站3

1.1.3娛樂休閒類網站3

1.1.4機構類網站4

1.1.5行業信息類網站4

1.1.6購物類網站5

1.1.7門戶類網站5

1.2常用網頁設計軟體和技術6

1.2.1網頁編輯排版軟體6

1.2.2網頁動畫製作軟體7

1.2.3網頁圖像設計軟體7

1.2.4網頁標記語言HTML8

1.2.5網頁腳本語言9

1.2.6動態網頁程式語言ASP10

1.3靜態網頁和動態網頁10

1.3.1靜態網頁10

1.3.2動態網頁11

用色彩搭配賞心悅目的網站12

2.1色彩基礎知識13

2.1.1色彩的基本概念13

2.1.2網頁色彩的冷暖視覺13

2.2常見網頁色彩搭配分析15

2.2.1綠色15

2.2.2黃色16

2.2.3藍色17

2.2.4紅色18

2.2.5紫色19

2.2.6灰色20

2.2.7黑色21

2.3頁面色彩搭配21

2.3.1網頁色彩搭配原理21

2.3.2幾種常見的網頁配色方法23

第2篇

設計令人流連忘返的靜態網頁

快速掌握DreamweaverCS6設計基本

網頁26

3.1DreamweaverCS6簡述28

3.2DreamweaverCS6的工作界面28

3.2.1選單欄29

3.2.2插入欄29

3.2.3浮動面板29

3.2.4“屬性”面板30

3.2.5文檔視窗30

3.3創建和管理站點31

3.3.1上機練習——創建本地站點31

3.3.2上機練習——管理本地站點32

3.4插入文本34

3.4.1上機練習——插入普通文本34

3.4.2上機練習——設定文本屬性35

3.4.3上機練習——插入特殊字元36

3.5使用列表38

3.5.1上機練習——插入項目列表38

3.5.2插入編號列表39

3.6在網頁中插入檔案頭部內容40

3.6.1插入MEtA信息40

3.6.2設定基礎41

3.6.3插入關鍵字42

3.6.4插入說明42

3.6.5設定刷新42

3.7插入其他對象43

3.7.1上機練習——插入日期43

3.7.2上機練習——插入水平線44

3.8綜合套用46

3.9專家秘笈49

設計豐富多彩的圖像和多媒體網頁51

4.1在網頁中插入圖像53

4.1.1網頁中圖像的常見格式53

4.1.2上機練習——插入圖像53

4.2 網頁圖像的套用55

4.2.1 上機練習——滑鼠經過圖像55

4.2.2 上機練習——插入圖像占位符57

4.3插入聲音59

4.3.1關於音頻檔案格式59

4.3.2上機練習——添加背景音樂59

4.4 插入視頻61

4.4.1 視頻的檔案格式61

4.4.2 上機練習——在網頁中插入視頻62

4.5插入其他媒體檔案63

4.5.1上機練習——插入Flash63

4.5.2上機練習——插入JavaApplet65

4.6網頁連結的創建67

4.6.1網頁連結的基本類型67

4.6.2上機練習——圖像熱點連結68

4.6.3上機練習——E—mail連結69

4.6.4上機練習——下載檔案連結71

4.6.5上機練習——錨點連結72

4.6.6上機練習——腳本連結74

4.6.7上機練習——空連結75

4.7綜合套用76

4.8專家秘笈81

使用表格和Spry排版網頁82

5.1插入表格83

5.1.1上機練習——插入表格83

5.1.2上機練習——添加內容到單元格86

5.2編輯表格87

5.2.1選擇表格及其元素87

5.2.2調整表格和單元格的大小91

5.2.3添加、刪除行或列93

5.2.4拆分單元格94

5.2.5合併單元格95

5.2.6剪下、複製、貼上表格95

5.3設定表格屬性96

5.3.1設定整個表格的屬性96

5.3.2設定行、列和單元格屬性96

5.4使用Spry布局對象97

5.4.1上機練習——使用Spry選單欄97

5.4.2使用Spry選項卡式面板98

5.4.3使用Spry摺疊式99

5.4.4上機練習——使用Spry可摺疊面板100

5.5綜合套用——製作圓角表格100

5.6專家秘笈103

使用模板和庫快速創建網頁105

6.1創建模板106

6.1.1上機練習——新建模板106

6.1.2上機練習——從現有文檔創建模板108

6.2創建可編輯區域109

6.2.1上機練習——插入可編輯區域109

6.2.2刪除可編輯區域110

6.3使用模板創建網頁110

6.4創建與套用庫項目112

6.4.1上機練習——創建庫項目112

6.4.2上機練習——套用庫項目114

6.4.3上機練習——修改庫項目115

6.5綜合套用116

6.6專家秘笈121

使用行為和腳步設計動感特效網頁123

7.1動作和事件124

7.1.1動作124

7.1.2事件125

7.2行為的添加與編輯126

7.2.1行為的添加126

7.2.2行為的修改127

7.3使用Dreamweaver內置行為127

7.3.1上機練習——交換圖像127

7.3.2恢復交換圖像128

7.3.3上機練習——打開瀏覽器視窗129

7.3.4上機練習——調用JavaScript131

7.3.5改變屬性133

7.3.6上機練習——拖動AP元素133

7.3.7上機練習——轉到URL135

7.3.8上機練習——彈出信息136

7.3.9上機練習——預先載入圖像138

7.3.10上機練習——設定狀態欄文本139

7.3.11跳轉選單140

7.3.12顯示—隱藏元素142

7.3.13上機練習——檢查表單144

7.3.14上機練習——增大/收縮效果146

7.3.15上機練習——擠壓效果147

7.4使用JavaScript製作網頁特效149

7.4.1上機練習——製作滾動文字公告149

7.4.2上機練習——禁止下載網頁圖像150

7.4.3上機練習——設定為IE首頁152

7.4.4上機練習——添加到收藏夾153

7.5專家秘笈154

使用CSS樣式表美化網頁156

8.1CSS樣式表157

8.2CSS基本語法158

8.3設定CSS屬性159

8.3.1設定CSS類型屬性159

8.3.2設定CSS背景屬性160

8.3.3設定CSS區塊屬性162

8.3.4設定CSS方框屬性163

8.3.5設定CSS框線屬性164

8.3.6設定CSS列表屬性165

8.3.7設定CSS定位屬性165

8.3.8設定CSS擴展屬性166

8.4連結到或導出外部CSS樣式表167

8.4.1上機練習——創建內部樣式表167

8.4.2上機練習——創建外部樣式表169

8.4.3上機練習——連結外部樣式表170

8.5綜合套用172

8.6專家秘笈176

用CSS+DIV靈活布局頁面177

9.1 初識DIV178

9.1.1 DIV概述178

9.1.2 CSS+DIV布局的優勢178

9.2關於APDiv179

9.2.1APDiv的概念179

9.2.2APDiv面板179

9.2.3創建普通APDiv180

9.2.4創建嵌套APDiv181

9.3設定APDiv的屬性181

9.3.1設定APDiv的顯示/隱藏屬性181

9.3.2改變APDiv的堆疊順序182

9.3.3為APDiv添加滾動條182

9.3.4改變APDiv的可見性183

9.4CSS定位與DIV布局184

9.4.1盒子模型184

9.4.2元素的定位184

9.5CSS+DIV布局的常用方法187

9.5.1使用DIV對頁面整體規劃188

9.5.2使用CSS定位188

9.6綜合套用——利用模板製作CSS布局網頁190

9.7專家秘笈193

第3篇

開發動態資料庫網站

動態網站開發基礎197

10.1動態網頁的特點和製作流程199

10.1.1動態網頁的特點199

10.1.2動態網頁的製作流程200

10.2在網頁中插入互動式表單對象200

10.2.1上機練習——插入表單域201

10.2.2上機練習——插入文本域202

10.2.3上機練習——插入複選框和單選按鈕205

10.2.4上機練習——插入列表/選單207

10.2.5上機練習——插入檔案域和按鈕208

10.3搭建本地伺服器212

10.3.1上機練習——安裝IIS212

10.3.2上機練習——配置Web伺服器213

10.4創建資料庫連線214

10.4.1上機練習——創建ODBC連線214

10.4.2上機練習——使用DSN創建ADO連線215

10.5編輯數據表記錄216

10.5.1創建記錄集（查詢）216

10.5.2插入記錄218

10.5.3更新記錄219

10.5.4刪除記錄220

10.6添加伺服器行為221

10.6.1插入重複區域221

10.6.2插入顯示區域222

10.6.3記錄集分頁223

10.6.4轉到詳細頁面224

10.6.5轉到相關頁面224

10.6.6用戶身份驗證225

10.7專家秘笈227

設計動態網站常用模組230

11.1設計留言系統231

11.1.1需求分析與設計思路231

11.1.2設計資料庫與資料庫連線232

11.1.3創建留言列表頁面234

11.1.4創建留言詳細頁面238

11.1.5創建添加留言頁面240

11.2設計新聞發布系統244

11.2.1主要功能頁面245

11.2.2設計資料庫246

11.2.3創建資料庫連線248

11.2.4新聞列表頁面的製作249

11.2.5新聞詳細頁面的製作255

11.2.6後台登錄頁面257

11.2.7刪除新聞頁面的製作260

11.2.8添加新聞頁面的製作262

11.2.9修改新聞頁面的製作264

11.2.10新聞管理總頁面266

11.3專家秘笈270

第4篇

設計與處理精美的網頁圖像

使用PhotoshopCS6設計網頁中的特效

文字273

12.1使用文字工具274

12.1.1上機練習——文字的輸入274

12.1.2上機練習——設定文字屬性275

12.1.3上機練習——文字的變形277

12.2 Photoshop圖層基本操作278

12.2.1 添加圖層278

12.2.2 刪除圖層278

12.2.3 合併圖層279

12.2.4 設定圖層樣式279

12.3 設計常見的網頁特效文字281

12.4專家秘笈288

設計網頁中經典圖像元素289

13.1 設計網站Logo290

13.1.1 Logo的特點290

13.1.2 Logo設計標準291

13.1.3 綜合套用1——網站Logo設計實例291

13.2 網路廣告的製作293

13.2.1 網路廣告設計技巧293

13.2.2綜合套用2——設計網路廣告294

13.3設計網站首頁298

13.3.1綜合套用3——首頁的製作298

13.3.2綜合套用4——切割輸出首頁圖像304

13.4 設計網頁按鈕306

13.5製作導航欄309

13.6專家秘笈312

第5篇

設計超炫的網頁動畫

使用FlashCS6創建基本動畫314

14.1FlashCS6工作界面315

14.2時間軸與關鍵幀317

14.2.1時間軸317

14.2.2時間軸中的圖層318

14.2.3關鍵幀318

14.3創建基本動畫319

14.3.1綜合套用1——逐幀動畫319

14.3.2綜合套用2——補間動畫322

14.4創建引導動畫324

14.4.1引導動畫的創建原理324

14.4.2綜合套用3——創建引導動畫324

14.5創建遮罩動畫327

14.5.1遮罩動畫的創建原理327

14.5.2綜合套用4——創建遮罩動畫327

14.6創建有聲動畫330

14.6.1Flash中可使用的聲音檔案類型330

14.6.2添加聲音330

14.6.3編輯聲音332

14.6.4綜合套用5——創建聲音動畫333

14.7專家秘笈335

使用FlashCS6創建互動動畫336

15.1ActionScript概述337

15.1.1ActionScript的發展史337

15.1.2ActionScript3.0的特點338

15.2ActionScript3.0語句中的參數339

15.2.1ActionScript中的專業術語339

15.2.2ActionScript3.0基本語法341

15.3常用ActionScript語句343

15.3.1for循環343

15.3.2while和dowhile循環343

15.3.3條件語句344

15.3.4特殊條件判斷344

15.4代碼的輸入344

15.5ActionScript的編輯環境345

15.6利用ActionScript製作互動網頁動畫346

15.6.1綜合套用1——創建跳轉到其他網頁動畫346

15.6.2綜合套用2——創建網頁導航動畫348

15.6.3綜合套用3——創建滑鼠特效353

15.6.4綜合套用4——製作發光旋轉效果356

15.6.5綜合套用5——製作回響滑鼠效果360

15.7專家秘笈364

第6篇

網站的策劃與安全管理

網站的整體策劃366

16.1為什麼要進行網站策劃367

16.2怎樣進行網站策劃368

16.2.1網站策劃的原則368

16.2.2網站策劃的關鍵點369

16.3如何確定網站的定位370

16.4確定網站的目標用戶371

16.5網站的內容策劃372

16.5.1網站內容策劃的重要性372

16.5.2如何做好網站內容策劃372

網站頁面設計策劃374

17.1網站欄目和頁面設計策劃376

17.1.1網站的欄目策劃376

17.1.2網站的頁面策劃377

17.2網站導航設計378

17.2.1導航設計的基本要求378

17.2.2全局導航的基本要素379

17.2.3輔助導航的設計要點379

17.2.4導航設計要點380

17.3網站頁面版式風格設計381

17.3.1網站內容的排版381

17.3.2網站網頁的布局形式382

17.3.3網站界面設計的兼容性384

17.3.4界面布局與內容的相關性384

17.4網站視覺元素設計385

17.4.1讓文字易辨識385

17.4.2讓圖片更合理386

17.4.3讓表單更易用387

17.4.4讓按鈕更易點擊388

網站的安全與運營維護390

18.1Web服務的高級設定391

18.1.1設定用戶391

18.1.2NTFS許可權的設定393

18.1.3目錄和應用程式訪問許可權的設定394

18.1.4匿名和授權訪問控制395

18.1.5備份與還原IIS396

18.2反黑客技術397

18.2.1計算機的設定397

18.2.2隱藏IP位址400

18.2.3作業系統賬號管理401

18.2.4安裝必要的安全軟體402

18.2.5做好瀏覽器的安全設定402

18.2.6網站防火牆的套用403

18.3網站運營404

18.3.1網站運營的工作內容404

18.3.2網站運營的關鍵問題405

18.4網站日常維護與管理406

第7篇

完整商業網站的建設

網站建設規範和基本流程408

19.1網站建設規範409

19.1.1組建開發團隊規範409

19.1.2開發工具規範409

19.1.3超連結規範409

19.1.4資料夾和檔案命名規範410

19.1.5代碼設計規範411

19.2網站建設的基本流程411

19.2.1網站的需求分析412

19.2.3確定網站整體風格412

19.2.4收集資源413

19.2.5設計網頁圖像414

19.2.6編輯製作網頁415

19.2.7開發動態網站模組416

19.2.8申請域名和伺服器空間416

19.2.9測試與發布上傳417

19.2.10網站維護418

19.2.11網站的推廣418

設計企業宣傳展示型網站422

20.1網站前期策劃423

20.2網站的版面布局及色彩424

20.2.1草案及粗略布局424

20.2.2確定網站的色彩424

20.3設計網站首頁425

20.3.1首頁的設計425

20.3.2切割首頁431

20.4創建本地站點433

20.5二級模板頁面的設計434

20.5.1創建庫檔案434

20.5.2創建模板436

20.5.3利用模板創建二級頁面439

20.6專家秘笈441

設計線上購物網站444

21.1購物網站設計概述445

21.1.1購物網站概念445

21.1.2購物網站的設計要點445

21.1.3主要功能頁面446

21.2創建資料庫與資料庫連線448

21.2.1創建資料庫表448

21.2.2創建資料庫連線450

21.3設計購物系統前台頁面451

21.3.1設計商品分類展示頁面451

21.3.2設計商品詳細信息頁面455

21.4設計購物系統後台管理457

21.4.1設計添加商品頁面457

21.4.2設計商品管理頁面461

21.4.3製作修改頁面465

21.4.4設計刪除頁面467

21.5專家秘笈470

序言

如今，網際網路已經在人們的生活中占據了重要位置，它可以將豐富多彩的文本、圖像、動畫等結合起來，隨時隨地供用戶瀏覽。目前網頁設計與網站建設技術成了熱門。頁面設計、動畫設計、圖形圖像設計是網頁設計與網站建設的三大核心。隨著網頁設計與網站建設技術的不斷發展和完善，產生了眾多網頁製作軟體。但是目前使用最多的是Photoshop、Dreamweaver、Flash三個軟體的組合，它們能完全高效地實現網頁設計的各種功能，所以稱這三個軟體的組合為黃金搭檔。現在，Adobe公司又及時地推出了Dreamweaver CS6、Flash CS6、Photoshop CS6，它們已經成為網頁設計與網站建設的夢幻工具組合，以其強大的功能和易學易用的特性，贏得了廣大網頁設計人員的青睞。

本書主要內容

本書詳細介紹了如何進行網站的前期策劃，如何綜合使用Dreamweaver CS6、Photoshop CS6和Flash CS6等工具來建設網站，如何在ASP環境下建設動態網站，以及資料庫的創建和網站的策劃、維護、宣傳與推廣等內容。

本書共分為21章，以“建站快速入門”—“設計令人流連忘返的靜態網頁”—“開發動態資料庫網站”—“設計與處理精美的網頁圖像”—“設計超炫的網頁動畫”—“網站的策劃與安全管理”—“完整商業網站的建設”為線索具體展開。其中，第1章為網頁設計與網站建設基礎；第2章為用色彩搭配賞心悅目的網站；第3章為快速掌握Dreamweaver CS6設計基本網頁；第4章為設計豐富多彩的圖像和多媒體網頁；第5章為使用表格和Spry排版網頁，第6章為使用模板和庫快速創建網頁；第7章為使用行為和腳本設計動感特效網頁；第8章為使用CSS樣式表美化網頁；第9章為用CSS+Div靈活布局頁面；第10章為動態網站開發基礎；第11章為設計動態網站常用模組；第12章為使用Photoshop CS6設計網頁中的特效文字；第13章為設計網頁中經典圖像元素；第14章為使用Flash CS6創建基本動畫；第15章為使用Flash CS6創建互動動畫；第16章為網站的整體策劃；第17章為網站頁面設計策劃；第18章為網站的安全與運營維護；第19章為網站建設規範和基本流程；第20章為設計企業宣傳展示型網站；第21章為設計線上購物網站。

本書主要特點

本書作者具有多年網站設計與教學經驗，精選了多年設計與教學實踐中具有代表性和實用性的實例，詳細介紹了使用Dreamweaver CS6編輯網頁、使用Photoshop CS6處理圖形和圖像及使用Flash CS6製作動畫的方法。本書具有如下特點。

結構安排合理。本書採用“基礎知識+上機練習+綜合套用”的結構，以使讀者能夠更好地理解和掌握每章所講述的內容。在每章的最後基本上都有“綜合套用”，將本章的內容進行了一次完整的貫通，以幫助讀者鞏固本章的相關知識點及提升讀者解決實際問題的能力。另外作者還毫無保留地將現實工作中大量非常實用的經驗、技巧貢獻出來。

商業案例，實戰性強。本書使用了大量的典型商業網站案例，採用圖解的方式講解軟體的使用和技巧，適時添加“提示”，以補充使用技巧和知識連結，讀者可以快捷地學習操作和套用，實戰性非常強。

雙欄排版，提示標註。採用雙欄圖解排版，一步一圖，圖文對應，並在圖中添加了操作提示標註，以便於讀者快速學習。

代碼揭秘。隨著網站設計人員技術的提升，對代碼會有越來越深刻的研究，增加“代碼揭秘”欄目，側重代碼的提供，要點進行重點標註與提示。

專家秘笈。每章最後一部分均安排了專家秘笈，這些秘笈來源於網站建設專家多年的經驗和技巧總結，解答了初學者常見的困惑，擴大了初學者的知識面。

超值配套光碟。本書所附光碟的內容為書中介紹的範例的源檔案及重點實例的操作演示視頻，供讀者學習時參考和對照使用。在光碟中還有“HTML常用標記手冊”、“JavaScript語法手冊”、“CSS屬性一覽表”、“VBScript語法手冊”、“ADO對象方法屬性詳解”、“常見網頁配色詞典”等內容，在製作網頁時也是很有用的參考。

本書讀者對象

本書語言通俗易懂，知識系統全面，突出了實戰性，採用由淺入深的編排方法，內容豐富，結構清晰，實例眾多，圖文並茂，適用於以下讀者對象：網頁設計與製作人員、網站建設與開發人員、大中專院校相關專業師生、網頁製作培訓班學員、個人網站愛好者與自學讀者。

本書由國內著名網頁設計培訓專家郭海旺主編，參加編寫的還有鄧靜靜、李銀修、劉宇星、鄧方方、張禮明、孫良軍、楊建偉、李曉民、劉中華、孫起雲、呂志彬等。由於本書編者水平有限，加之時間倉促，不足之處在所難免，歡迎廣大讀者批評指正。

編 者

2012年8月