《網頁設計與網站建設案例課堂(第2版)》以零基礎講解為宗旨，用實例引導讀者深入學習，采取“網站基礎入門→制作靜態網頁→網頁美化布局→設計網頁元素→開發動態網站→網站開發實戰→網站全能擴展”的講解模式，深入淺出地講解網頁設計和網站建設的各項技術及實戰技能。
《網頁設計與網站建設案例課堂(第2版)》第1篇【網站基礎入門】主要內容包括網頁設計與網站建設基礎、網站配色與布局、HTML語言速成、網站建設基本流程與制作工具等。第2篇【制作靜態網頁】主要內容包括使用Dreamweaver CC創建站點、使用文本豐富網頁內容、使用圖像與多媒體網頁元素、設計網頁中的超鏈接、使用網頁表單和行為等。第3篇【網頁美化布局】主要內容包括使用表格布局網頁、使用CSS層疊樣式表、利用CSS+Div布局網頁等。第4篇【設計網頁元素】主要內容包括調整與修飾圖像、制作網頁按鈕與導航條、制作網頁特效邊線與背景、制作網頁Logo與網頁Banner、制作簡單網頁動畫元素、創建交互式動畫、制作動態網站的Logo與Banner等。第5篇【開發動態網站】主要內容包括認識PHP語言、配置動態網站運行環境、使用MySQL數據庫、動態網站應用模塊開發等。第6篇【網站開發實戰】主要內容包括開發網站用戶管理系統和開發信息資訊管理系統等。第7篇【網站全能擴展】主要內容包括網站的測試與發布、網站安全與防御、網站優化與推廣等。
《網頁設計與網站建設案例課堂(第2版)》面向初、中級用戶，適合任何想學習網頁設計和網站建設的人員，無論您是否從事計算機相關行業，無論您是否接觸過網頁設計和網站建設，通過學習本書均可快速掌握設計網頁和開發動態網站的方法和技巧。

劉春茂，本科畢業于上海復旦大學，碩士畢業于清華大學。曾在美國IBM公司移動產品開發組從事Android平臺應用的開發。
擅長的核心技術
媒體和教育領域個性化信息推薦，網站用戶行為數據挖掘，健康領域非結構化數據處理。
擅長的其他技術
熟悉各種網站和手機（Andorid和iOS）app的開發等，精通Java, C/C++, PHP, Python等流行語言并對Hadoop， MapReduce等大數據框架有深入研究。

目 錄
第1篇 網站基礎入門

第1章 網站建設入門——網頁設計與
網站建設基礎 3
1.1 認識網頁和網站 4
1.1.1 網頁 4
1.1.2 網站 4
1.1.3 網站的分類 5
1.2 認識網頁的基本組成 6
1.2.1 網址 7
1.2.2 網頁標題 7
1.2.3 Logo 7
1.2.4 文本 8
1.2.5 圖像 8
1.2.6 導航欄 9
1.2.7 超鏈接 9
1.2.8 表單 9
1.2.9 動畫 10
1.2.10 Banner 10
1.3 認識靜態網頁與動態網頁 11
1.3.1 靜態網頁 11
1.3.2 動態網頁 11
1.4 網站建設的相關概念 12
1.4.1 因特網與萬維網 12
1.4.2 瀏覽器與HTML 12
1.4.3 URL、域名與IP地址 13
1.4.4 上傳和下載 14
1.5 疑難解惑 14
第2章 第一視覺最重要——網站配色
與布局 15
2.1 善用色彩設計網頁 16
2.1.1 認識色彩 16
2.1.2 確定網站的主題色 17
2.1.3 網頁中色彩的搭配 19
2.1.4 網頁元素的色彩搭配 20
2.1.5 網頁色彩搭配的技巧 21
2.2 常見的網站布局結構 23
2.2.1 “國”字型 24
2.2.2 標題正文型 24
2.2.3 左右框架型 24
2.2.4 上下框架型 25
2.2.5 綜合框架型 25
2.2.6 封面型 25
2.2.7 Flash型 26
2.3 網站的色彩應用案例 26
2.3.1 案例1——網絡購物類網站的
色彩應用 26
2.3.2 案例2——游戲類網站的色彩
應用 27
2.3.3 案例3——企業門戶網站的色彩
應用 28
2.3.4 案例4——時政新聞類網站的
色彩應用 28
2.3.5 案例5——影音類網站的色彩
應用 29
2.3.6 案例6——娛樂類網站的色彩
應用 30
2.4 綜合案例——定位網站頁面的框架 30
2.5 疑難解惑 31
第3章 讀懂網頁密碼——HTML語言
速成 33
3.1 網頁的HTML構成 34
3.1.1 文檔標記 34
3.1.2 頭部標記 35
3.1.3 主體標記 35
3.2 HTML的常用標記 36
3.2.1 標題標記

到

36
3.2.2 段落標記

36
3.2.3 換行標記
37
3.2.4 鏈接標記 38
3.2.5 列表標記

39
3.2.6 圖像標記 41
3.2.7 表格標記 44
3.2.8 表單標記 45
3.3 綜合案例——制作日程表 46
3.4 疑難解惑 49
第4章 開啟網頁制作之路——網站建設
基本流程與制作工具 51
4.1 建站方式 52
4.1.1 自助建站 52
4.1.2 智能建站 52
4.1.3 專業設計 53
4.2 建站流程 53
4.2.1 網站規劃 53
4.2.2 搜集資料 54
4.2.3 制作網頁 54
4.2.4 網站測試 55
4.2.5 申請域名 55
4.2.6 申請空間 55
4.2.7 網站備案 55
4.2.8 發布網頁 57
4.2.9 網站推廣和維護 57
4.3 制作網頁的常用軟件 58
4.3.1 案例1——認識網頁布局
軟件Dreamweaver CC 58
4.3.2 案例2——認識圖像處理
軟件Photoshop CC 58
4.3.3 案例3——認識動畫制作
軟件Flash CC 59
4.4 綜合案例——網頁制作軟件間的
相互關系 60
4.5 疑難解惑 61


第2篇 制作靜態網頁



查看全部↓

精彩書摘

第2章 第一視覺最重要——網站配色與布局

一個網站能否成功，很大程度上取決于網頁的結構與配色。因此，在學習制作動態網站之前，首先需要掌握網站結構與網頁配色的相關基礎知識。本章介紹的內容包括網頁配色的相關技巧、網站結構的布局，以及網站配色的經典案例等。

2.1 善用色彩設計網頁
經研究發現，當用戶第一次打開某個網站時，給用戶留下第一印象的既不是網站的內容，也不是網站的版面布局，而是網站具有沖擊力的色彩，如圖2-1所示。

圖2-1 網頁色彩搭配
色彩的魅力是無限的，它可以讓本身很平淡無味的東西瞬間變得漂亮起來。作為最具說服力的視覺語言，作為最強烈的視覺沖擊，色彩在人們的生活中起著先聲奪人的作用。因此，作為一名優秀的網頁設計師，不僅要掌握基本的網站制作技術，還要掌握網站的配色風格等設計藝術。
2.1.1 認識色彩
為了能更好地應用色彩來設計網頁，需要先了解色彩的一些基本概念。自然界中有很多種色彩，比如玫瑰是紅色的，大海是藍色的，橘子是橙色的……但是最基本的色彩有3種(紅、綠、藍)，其他的色彩都可以由這3種色彩調和而成。這三種色彩被稱為“三原色”，如圖2-2(a)所示。
現實生活中的色彩可以分為彩色和非彩色。其中黑、白、灰屬于非彩色系列；其他色彩都屬于彩色系列。任何一種彩色的色彩都具備色相、明度和純度3個特征。而非彩色的色彩只具有明度屬性。
1. 色相
色相指的是色彩的名稱。這是色彩的最基本特征，是一種色彩區別于另一種色彩的最主要因素。比如，紫色、綠色、黃色等都代表了不同的色相。同一色相的色彩，通過調整亮度或者純度，就很容易搭配，如圖2-2(b)所示。
2. 明度
明度也叫亮度，是指色彩的明暗程度。明度越大，色彩越亮，如一些購物、兒童類網站，用的是一些鮮亮的顏色，讓人感覺絢麗多姿、生氣勃勃。明度越低，顏色越暗。低明度的色彩主要用于一些充滿神秘感的游戲類網站，以及一些為了體現個人的孤僻或者憂郁等性格的個人網站。
有明度差的色彩更容易調和，例如，紫色(#993399)與黃色(#ffff00)，暗紅(#cc3300)與草綠(#99cc00)，暗藍(#0066cc)與橙色(#ff9933)等。色彩的明度如圖2-3所示。

(a) (b)
圖2-2 三原色與色相

圖2-3 色彩的明度
3. 純度
純度是指色彩的鮮艷程度。純度高的色彩顏色鮮亮；純度低的色彩顏色暗淡發灰。
2.1.2 確定網站的主題色
一個網站一般不使用單一顏色，因為會讓人感覺單調、乏味；但也不能將所有的顏色都運用到網站中，讓人感覺不莊重。一個網站必須圍繞一種或兩種主題色進行設計，這樣既不至于讓客戶迷失方向，也不至于讓客戶感到單調、乏味。因此，確定網站的主題色是設計者必須考慮的問題之一。
1. 主題色確定的兩個方面
在確定網站主題色時，通常可以從以下兩個方面去考慮。
1) 結合產品、內容特點
應該根據產品的特點來確定網站的主色調。如果企業產品是環保型的，可以采用綠色。如果企業主營的產品是高科技或電子類的可以采用藍色等。如果是紅酒企業，則可以考慮使用紅酒的色調。圖2-4所示是商業網站的一種色彩搭配。



查看全部↓

前言/序言

前 言
“網站開發案例課堂”系列圖書是專門為辦公技能和網頁設計初學者量身定制的一套學習用書。整套書涵蓋網頁設計、網站開發、數據庫設計等方面。整套書具有以下幾個特點。
面向前沿科技
無論是網站建設、數據庫設計還是HTML 5、CSS 3、JavaScript，我們都精選較為前沿或者用戶群最大的領域推進，幫助大家認識和了解最新動態。
權威的作者團隊
組織國家重點實驗室和資深應用專家聯手編著該套圖書，融合豐富的教學經驗與優秀的管理理念。
學習型案例設計
以技術的實際應用過程為主線，全程采用圖解和同步多媒體結合的教學方式，生動、直觀、全面地剖析使用過程中的各種應用技能，降低難度以提升學習效率。
為什么要寫這樣一本書
隨著網絡的發展，很多企事業單位和廣大網民對于建立網站的需求越來越強烈。另外，對于大中專院校，很多學生需要做網站畢業設計，但是這些讀者又不懂網頁代碼程序，不知道從哪里下手。針對這些情況，我們編寫了本書，以期引導讀者學習網頁設計和網站建設的全面知識。通過本書的實訓，讀者可以很快地學會設計網頁和開發網站，提高職業化能力，從而幫助解決公司與求職者的雙重需求問題。
本書特色
零基礎、入門級的講解
無論您是否從事計算機相關行業，無論您是否接觸過網頁設計和動態網站開發，都能從本書中找到最佳起點。
超多、實用、專業的范例和項目
本書在編排上緊密結合深入學習網頁制作技術的先后過程，從網頁設計的基本概念開始，帶領大家逐步深入地學習各種應用技巧，側重實戰技能，使用簡單易懂的實際案例進行分析和操作指導，讓讀者讀起來簡明輕松，操作起來有章可循。
隨時檢測自己的學習成果
大部分章末的“疑難解惑”板塊，均根據本章內容精選而成，從而幫助讀者解決自學過程中最常見的疑難問題。
細致入微、貼心提示
本書在講解過程中，在各章中使用了“注意”“提示”“技巧”等小貼士，使讀者在學習過程中更清楚地了解相關操作、理解相關概念，并輕松掌握各種操作技巧。
專業創作團隊和技術支持
您在學習過程中遇到任何問題，可加入QQ群(案例課堂VIP，號碼為451102631)進行提問，專家人員會在線答疑。
超值資源大放送
全程同步教學錄像
涵蓋本書所有知識點，詳細講解每個實例及項目的過程及技術關鍵點。比看書更輕松地掌握書中所有的動態網站開發的知識，而且擴展的講解部分使您得到比書中更多的收獲。
超多容量王牌資源
贈送大量王牌資源，包括本書實例源代碼、教學幻燈片、本書精品教學視頻、88個實用類網頁模板、12部網頁開發必備參考手冊、11個精彩JavaScript案例、Dreamweaver CC快捷鍵速查手冊、HTML標簽速查表、精彩網站配色方案賞析、網頁樣式與布局案例賞析、CSS+Div布局賞析案例、Web前端工程師常見面試題等。讀者可以通過QQ群(案例課堂VIP，號碼為451102631)獲取贈送資源，也可以掃描二維碼，下載本書資源。
讀者對象
沒有任何網頁設計和網站建設基礎的初學者。
有一定的網頁設計和網站建設的基礎，想精通網站開發的人員。
有一定的動態網站開發基礎，沒有項目經驗的人員。
正在進行畢業設計的學生。
大專院校及培訓學校的老師和學生。
創作團隊
本書由劉春茂編著，參加編寫的人員還有劉玉萍、張金偉、蒲娟、周佳、付紅、李園、郭廣新、侯永崗、王攀登、劉海松、孫若淞、王月嬌、包慧利、陳偉光、胡同夫、王偉、展娜娜、李琪、梁云梁和周浩浩。在編寫過程中，我們竭盡所能地將最好的講解呈現給讀者，但也難免有疏漏和不妥之處，敬請不吝指正。若您在學習中遇到困難或疑問，或有任何建議，可寫信至信箱357975357@qq.com。



編 者



查看全部↓

第2章 第一視覺最重要——網站配色與布局

一個網站能否成功，很大程度上取決于網頁的結構與配色。因此，在學習制作動態網站之前，首先需要掌握網站結構與網頁配色的相關基礎知識。本章介紹的內容包括網頁配色的相關技巧、網站結構的布局，以及網站配色的經典案例等。

2.1 善用色彩設計網頁
經研究發現，當用戶第一次打開某個網站時，給用戶留下第一印象的既不是網站的內容，也不是網站的版面布局，而是網站具有沖擊力的色彩，如圖2-1所示。

圖2-1 網頁色彩搭配
色彩的魅力是無限的，它可以讓本身很平淡無味的東西瞬間變得漂亮起來。作為最具說服力的視覺語言，作為最強烈的視覺沖擊，色彩在人們的生活中起著先聲奪人的作用。因此，作為一名優秀的網頁設計師，不僅要掌握基本的網站制作技術，還要掌握網站的配色風格等設計藝術。
2.1.1 認識色彩
為了能更好地應用色彩來設計網頁，需要先了解色彩的一些基本概念。自然界中有很多種色彩，比如玫瑰是紅色的，大海是藍色的，橘子是橙色的……但是最基本的色彩有3種(紅、綠、藍)，其他的色彩都可以由這3種色彩調和而成。這三種色彩被稱為“三原色”，如圖2-2(a)所示。
現實生活中的色彩可以分為彩色和非彩色。其中黑、白、灰屬于非彩色系列；其他色彩都屬于彩色系列。任何一種彩色的色彩都具備色相、明度和純度3個特征。而非彩色的色彩只具有明度屬性。
1. 色相
色相指的是色彩的名稱。這是色彩的最基本特征，是一種色彩區別于另一種色彩的最主要因素。比如，紫色、綠色、黃色等都代表了不同的色相。同一色相的色彩，通過調整亮度或者純度，就很容易搭配，如圖2-2(b)所示。
2. 明度
明度也叫亮度，是指色彩的明暗程度。明度越大，色彩越亮，如一些購物、兒童類網站，用的是一些鮮亮的顏色，讓人感覺絢麗多姿、生氣勃勃。明度越低，顏色越暗。低明度的色彩主要用于一些充滿神秘感的游戲類網站，以及一些為了體現個人的孤僻或者憂郁等性格的個人網站。
有明度差的色彩更容易調和，例如，紫色(#993399)與黃色(#ffff00)，暗紅(#cc3300)與草綠(#99cc00)，暗藍(#0066cc)與橙色(#ff9933)等。色彩的明度如圖2-3所示。

(a) (b)
圖2-2 三原色與色相

圖2-3 色彩的明度
3. 純度
純度是指色彩的鮮艷程度。純度高的色彩顏色鮮亮；純度低的色彩顏色暗淡發灰。
2.1.2 確定網站的主題色
一個網站一般不使用單一顏色，因為會讓人感覺單調、乏味；但也不能將所有的顏色都運用到網站中，讓人感覺不莊重。一個網站必須圍繞一種或兩種主題色進行設計，這樣既不至于讓客戶迷失方向，也不至于讓客戶感到單調、乏味。因此，確定網站的主題色是設計者必須考慮的問題之一。
1. 主題色確定的兩個方面
在確定網站主題色時，通常可以從以下兩個方面去考慮。
1) 結合產品、內容特點
應該根據產品的特點來確定網站的主色調。如果企業產品是環保型的，可以采用綠色。如果企業主營的產品是高科技或電子類的可以采用藍色等。如果是紅酒企業，則可以考慮使用紅酒的色調。圖2-4所示是商業網站的一種色彩搭配。