案例學(xué)-網(wǎng)頁(yè)設(shè)計(jì)與網(wǎng)站建設(shè)

目錄
第1篇　網(wǎng)站制作基礎(chǔ)篇
隨著網(wǎng)絡(luò)的日益普及，網(wǎng)站的數(shù)量及種類(lèi)也日漸增多。網(wǎng)站是一個(gè)存放在網(wǎng)絡(luò)服務(wù)器上的完整信息集合體，它包含一個(gè)或多個(gè)網(wǎng)頁(yè)。網(wǎng)站的類(lèi)型包括公司網(wǎng)站、企業(yè)網(wǎng)站、政府網(wǎng)站、個(gè)人網(wǎng)站等。針對(duì)如此多設(shè)計(jì)風(fēng)格各異的網(wǎng)站，我們要完成制作都需要從認(rèn)識(shí)網(wǎng)站開(kāi)始。
第1章網(wǎng)頁(yè)設(shè)計(jì)入門(mén)
1.1?認(rèn)識(shí)網(wǎng)頁(yè)
★?重點(diǎn)?1.1.1?網(wǎng)頁(yè)的定義
★?重點(diǎn)?1.1.2?網(wǎng)頁(yè)的構(gòu)成要素
1.1.3?網(wǎng)頁(yè)與網(wǎng)站的關(guān)系
1.2?常用的網(wǎng)絡(luò)術(shù)語(yǔ)
1.2.1?域名
1.2.2?HTTP協(xié)議
1.2.3?FTP協(xié)議
1.2.4?超鏈接
1.2.5?站點(diǎn)
1.3?網(wǎng)頁(yè)設(shè)計(jì)常用工具
1.3.1?網(wǎng)頁(yè)設(shè)計(jì)軟件Dreamweaver
1.3.2?動(dòng)畫(huà)設(shè)計(jì)軟件Flash
1.3.3?圖像設(shè)計(jì)軟件Photoshop
1.3.4?HTML標(biāo)記
1.3.5?CSS樣式表
1.4?網(wǎng)頁(yè)設(shè)計(jì)的基本原則
1.4.1?明確建立網(wǎng)站的目標(biāo)和用戶(hù)需求
1.4.2?總體設(shè)計(jì)方案主題鮮明
1.4.3?網(wǎng)頁(yè)形式與內(nèi)容相統(tǒng)一
1.4.4?三維空間的構(gòu)成
1.4.5?多媒體功能的使用
1.4.6?合理運(yùn)用新技術(shù)
1.5?移動(dòng)端（手機(jī)/平板）網(wǎng)頁(yè)的設(shè)計(jì)
★?重點(diǎn)?1.5.1?移動(dòng)端網(wǎng)站與PC端網(wǎng)站設(shè)計(jì)的區(qū)別
★?重點(diǎn)?1.5.2?移動(dòng)端網(wǎng)頁(yè)設(shè)計(jì)的原則
1.5.3?規(guī)劃不同產(chǎn)品上的功能
本章小結(jié)
第2章網(wǎng)站建設(shè)的規(guī)范與流程
2.1?常見(jiàn)的網(wǎng)站類(lèi)型
2.1.1?門(mén)戶(hù)網(wǎng)站
2.1.2?企業(yè)網(wǎng)站
2.1.3?個(gè)人網(wǎng)站
2.1.4?娛樂(lè)網(wǎng)站
2.1.5?機(jī)構(gòu)網(wǎng)站
2.1.6?電子商務(wù)網(wǎng)站
2.2?網(wǎng)站建設(shè)規(guī)范
2.2.1?組建開(kāi)發(fā)團(tuán)隊(duì)規(guī)范
2.2.2?開(kāi)發(fā)工具規(guī)范
2.2.3?超鏈接規(guī)范
2.2.4?數(shù)據(jù)庫(kù)開(kāi)發(fā)
2.2.5?文件夾和文件命名規(guī)范
2.3?網(wǎng)站的制作流程
★?重點(diǎn)?2.3.1?網(wǎng)站整體規(guī)劃
2.3.2?確定網(wǎng)站的內(nèi)容和服務(wù)
★?重點(diǎn)?2.3.3?規(guī)劃網(wǎng)站目錄結(jié)構(gòu)
★?重點(diǎn)?2.3.4?收集資源
2.3.5?網(wǎng)頁(yè)效果圖設(shè)計(jì)
★?重點(diǎn)?2.3.6?編輯制作網(wǎng)頁(yè)
★?重點(diǎn)?2.3.7?申請(qǐng)域名和服務(wù)器空間
★?重點(diǎn)?2.3.8?網(wǎng)站的維護(hù)、測(cè)試和發(fā)布
★?重點(diǎn)?2.3.9?網(wǎng)站的宣傳推廣
本章小結(jié)
第3章網(wǎng)站的策劃與版面布局
3.1?網(wǎng)站的整體CI策劃
3.1.1?CI簡(jiǎn)介
3.1.2?MI設(shè)計(jì)簡(jiǎn)介
3.1.3?BI設(shè)計(jì)簡(jiǎn)介
3.1.4?VI設(shè)計(jì)簡(jiǎn)介
3.2?網(wǎng)站的風(fēng)格、標(biāo)志與字體
★?重點(diǎn)?3.2.1?網(wǎng)站的風(fēng)格定位
★?重點(diǎn)?3.2.2?網(wǎng)站的標(biāo)志
★?重點(diǎn)?3.2.3?網(wǎng)站的標(biāo)準(zhǔn)字體
3.3?網(wǎng)頁(yè)版面布局設(shè)計(jì)
★?重點(diǎn)?3.2.1?網(wǎng)頁(yè)版面布局原則
★?重點(diǎn)?3.2.2?點(diǎn)、線(xiàn)、面的構(gòu)成
3.4?網(wǎng)頁(yè)的基本版式
3.4.1?骨骼型
3.4.2?滿(mǎn)版型
3.4.3?上下分割型
3.4.4?左右分割型
3.4.5?中軸型
3.4.6?曲線(xiàn)型
3.4.7?傾斜型
3.4.8?重心型
3.4.9?自由型
本章小結(jié)
第4章網(wǎng)頁(yè)的顏色搭配
4.1?網(wǎng)頁(yè)色彩的分類(lèi)
★?重點(diǎn)?4.1.1?有彩色
★?重點(diǎn)?4.1.2?無(wú)彩色
4.2?網(wǎng)頁(yè)配色基礎(chǔ)
4.2.1?RGB
4.2.2?HSB
4.2.3?色環(huán)
4.2.4?原色
4.3?網(wǎng)頁(yè)色彩的三要素
4.3.1?明度
4.3.2?色相
4.3.3?純度
4.4?網(wǎng)頁(yè)的色彩對(duì)比
★?重點(diǎn)?4.4.1?明度對(duì)比
★?重點(diǎn)?4.4.2?色相對(duì)比
★?重點(diǎn)?4.4.3?純度對(duì)比
★?重點(diǎn)?4.4.4?色彩的冷暖對(duì)比
4.5?選擇網(wǎng)頁(yè)色彩
4.5.1?網(wǎng)頁(yè)色彩與人的情緒
★?重點(diǎn)?4.5.2?網(wǎng)頁(yè)的標(biāo)準(zhǔn)色
★?重點(diǎn)?4.5.3?網(wǎng)頁(yè)的色彩選擇與搭配
本章小結(jié)
第2篇　靜態(tài)網(wǎng)頁(yè)制作篇
Dreamweaver CC是Adobe公司推出的一套擁有可視化編輯界面，用于制作并編輯網(wǎng)站和移動(dòng)應(yīng)用程序的網(wǎng)頁(yè)設(shè)計(jì)軟件。它將可視布局工具、應(yīng)用程序開(kāi)發(fā)功能和代碼編輯支持組合為一個(gè)功能強(qiáng)大的工具系統(tǒng)，使每個(gè)級(jí)別的開(kāi)發(fā)人員和設(shè)計(jì)人員都可利用它快速地創(chuàng)建網(wǎng)頁(yè)界面。在計(jì)算機(jī)中安裝Dreamweaver CC之后，即可啟用該軟件進(jìn)行網(wǎng)頁(yè)制作。
第5章Dreamweaver CC的基礎(chǔ)操作
5.1?認(rèn)識(shí)Dreamweaver CC
5.1.1?Dreamweaver CC的啟動(dòng)與退出
5.1.2?Dreamweaver CC的工作界面
5.2?網(wǎng)頁(yè)的創(chuàng)建與保存
★?重點(diǎn)?5.2.1?創(chuàng)建網(wǎng)頁(yè)
★?重點(diǎn)?5.2.2?保存網(wǎng)頁(yè)
★?重點(diǎn)?5.2.3?打開(kāi)網(wǎng)頁(yè)
5.2.4?關(guān)閉網(wǎng)頁(yè)
5.3?在網(wǎng)頁(yè)中輸入文本
★?重點(diǎn)?5.3.1?直接在網(wǎng)頁(yè)窗口中輸入文本
★?重點(diǎn)?5.3.2?復(fù)制/粘貼外部文本
★?重點(diǎn)?5.3.3?調(diào)整文本
★?重點(diǎn)?5.3.4?實(shí)戰(zhàn)：插入日期
5.4?水平線(xiàn)的操作
★?重點(diǎn)?5.4.1?插入水平線(xiàn)
★?重點(diǎn)?5.4.2?設(shè)置水平線(xiàn)屬性
5.5?項(xiàng)目列表與編號(hào)列表
★?重點(diǎn)?5.5.1?插入項(xiàng)目列表
★?重點(diǎn)?5.5.2?插入編號(hào)列表
5.6?使用標(biāo)尺與網(wǎng)格
★?重點(diǎn)?5.6.1?使用標(biāo)尺
★?重點(diǎn)?5.6.2?使用網(wǎng)格
妙招技法
技巧01如何自定義快捷鍵
技巧02如何自定義代碼視圖
技巧03如何插入特殊字符
技巧04 怎樣在網(wǎng)頁(yè)中制作彩色水平線(xiàn)
上機(jī)實(shí)訓(xùn)——制作公司介紹網(wǎng)頁(yè)
本章小結(jié)
……
第21章JavaScript語(yǔ)法
21.1?JavaScript概述
21.1.1?JavaScript的定義
21.1.2?JavaScript的特點(diǎn)
21.2?JavaScript在HTML中的使用
★?重點(diǎn)?21.2.1?JavaScript加入HTML中
★?重點(diǎn)?21.2.2?實(shí)戰(zhàn)：創(chuàng)建第一個(gè)JavaScript程序
21.3?JavaScript基本數(shù)據(jù)類(lèi)型、表達(dá)式?和運(yùn)算符
★?重點(diǎn)?21.3.1?基本數(shù)據(jù)類(lèi)型
★?重點(diǎn)?21.3.2?表達(dá)式
★?重點(diǎn)?21.3.3?運(yùn)算符
21.4?JavaScript程序語(yǔ)句
★?重點(diǎn)?21.4.1?使用If語(yǔ)句
★?重點(diǎn)?21.4.2?使用For循環(huán)
★?重點(diǎn)?21.4.3?使用While語(yǔ)句
21.5?JavaScript函數(shù)
21.5.1?函數(shù)的定義
21.5.2?函數(shù)中的形式參數(shù)
妙招技法
技巧01如何在圖片上添加播放按鈕
技巧02單擊表格變換顏色
技巧03實(shí)現(xiàn)網(wǎng)頁(yè)字體大、中、小的操作
上機(jī)實(shí)訓(xùn)——檢測(cè)用戶(hù)屏幕分辨率
本章小結(jié)
第6篇　網(wǎng)站建設(shè)實(shí)戰(zhàn)篇
隨著Internet的發(fā)展與普及，互聯(lián)網(wǎng)信息技術(shù)徹底改變了人們的生活和工作。越來(lái)越多不同類(lèi)型的企業(yè)建立了網(wǎng)站。本篇將詳細(xì)講解3個(gè)不同類(lèi)型網(wǎng)站項(xiàng)目的分析與制作。
第22章制作企業(yè)官方網(wǎng)站
22.1?企業(yè)官方網(wǎng)站的相關(guān)制作知識(shí)
22.1.1?網(wǎng)站項(xiàng)目分析
22.1.2?確定網(wǎng)站風(fēng)格
22.2?制作網(wǎng)站
22.2.1?處理網(wǎng)站圖像
22.2.2?制作按鈕
22.2.3?制作網(wǎng)頁(yè)導(dǎo)航條
22.2.4?制作網(wǎng)站首頁(yè)
22.3?發(fā)布為手機(jī)/平板端網(wǎng)頁(yè)
本章小結(jié)
第23章制作在線(xiàn)娛樂(lè)網(wǎng)站
23.1?在線(xiàn)娛樂(lè)網(wǎng)站的相關(guān)制作知識(shí)
23.1.1?網(wǎng)站項(xiàng)目分析
23.1.2?確定網(wǎng)站風(fēng)格
23.2?制作網(wǎng)站
23.2.1?使用Flash制作動(dòng)畫(huà)
23.2.2?制作網(wǎng)站引導(dǎo)頁(yè)
23.2.3?使用HTML制作視頻播放頁(yè)
23.3?發(fā)布為手機(jī)/平板端網(wǎng)頁(yè)
本章小結(jié)
第24章制作購(gòu)物網(wǎng)站
24.1?購(gòu)物網(wǎng)站的相關(guān)行業(yè)知識(shí)
24.1.1?網(wǎng)站項(xiàng)目分析
24.1.2?確定網(wǎng)站風(fēng)格
24.2?制作網(wǎng)站
24.2.1?處理網(wǎng)站Banner
24.2.2?制作網(wǎng)站促銷(xiāo)信息特效
24.2.3?制作網(wǎng)站主體部分
24.3?發(fā)布為手機(jī)/平板端網(wǎng)頁(yè)
本章小結(jié)
第7篇　網(wǎng)站維護(hù)推廣篇
在網(wǎng)站制作完成后，需要對(duì)其進(jìn)行測(cè)試；當(dāng)網(wǎng)站能夠穩(wěn)定地運(yùn)行后，就可以將站點(diǎn)上傳到遠(yuǎn)程Web服務(wù)器上；最后還要進(jìn)行必要的管理和推廣等工作。本篇主要介紹網(wǎng)站的維護(hù)與推廣知識(shí)。
第25章網(wǎng)站的測(cè)試與上傳
25.1?本地站點(diǎn)的測(cè)試
25.1.1?檢測(cè)瀏覽器的兼容性
★?重點(diǎn)?25.1.2?檢查站點(diǎn)的鏈接
25.1.3?創(chuàng)建站點(diǎn)報(bào)告
25.2?網(wǎng)站的上傳
25.2.1?使用Dreamweaver上傳
★?重點(diǎn)?25.2.2?使用上傳工具上傳
本章小結(jié)
第26章網(wǎng)站管理、維護(hù)與推廣
26.1?網(wǎng)站的管理
★?重點(diǎn)?26.1.1?網(wǎng)站的管理問(wèn)題
26.1.2?網(wǎng)站管理的作用與意義
26.1.3?網(wǎng)站管理的原則
26.2?網(wǎng)站日常維護(hù)與管理
26.2.1?網(wǎng)站日常維護(hù)的目的
★?重點(diǎn)?26.2.2?網(wǎng)站日常維護(hù)的內(nèi)容
26.3?傳統(tǒng)方式推廣網(wǎng)站
26.3.1?電視
26.3.2?報(bào)紙雜志
26.3.3?戶(hù)外廣告
26.3.4?其他印刷品
26.4?網(wǎng)絡(luò)推廣
26.4.1?網(wǎng)絡(luò)廣告
26.4.2?電子郵件
26.4.3?使用論壇
26.4.4?友情鏈接
26.5?注冊(cè)到搜索引擎
26.5.1?注冊(cè)搜索引擎需要注意的問(wèn)題
26.5.2?手工注冊(cè)搜索引擎
26.5.3?利用搜索引擎注冊(cè)工具注冊(cè)
26.5.4?到注冊(cè)網(wǎng)站注冊(cè)
26.5.5?利用META設(shè)置
本章小結(jié)
附錄
附錄A?HTML代碼的標(biāo)簽
附錄B?CSS層疊樣式表屬性
附錄C?綜合上機(jī)實(shí)訓(xùn)項(xiàng)目