網(wǎng)頁(yè)設(shè)計(jì)綜合實(shí)踐教程

目錄

第1章網(wǎng)頁(yè)設(shè)計(jì)基礎(chǔ)知識(shí)
1.1網(wǎng)絡(luò)基礎(chǔ)知識(shí)
1.1.1WWW簡(jiǎn)介
1.1.2什么是HTTP、URL和域名
1.2了解網(wǎng)頁(yè)與網(wǎng)站
1.2.1網(wǎng)頁(yè)
1.2.2網(wǎng)站
1.3網(wǎng)站的規(guī)劃與設(shè)計(jì)
1.4網(wǎng)頁(yè)設(shè)計(jì)
1.4.1網(wǎng)頁(yè)風(fēng)格設(shè)計(jì)
1.4.2網(wǎng)頁(yè)布局設(shè)計(jì)
1.4.3網(wǎng)頁(yè)色彩設(shè)計(jì)
1.4.4網(wǎng)頁(yè)內(nèi)容設(shè)計(jì)
1.4.5網(wǎng)頁(yè)設(shè)計(jì)案例分析
1.5常用網(wǎng)頁(yè)設(shè)計(jì)工具
1.5.1網(wǎng)頁(yè)制作軟件——Adobe Dreamweaver CS6
1.5.2圖像處理軟件——Adobe Photoshop CS6
1.5.3動(dòng)畫(huà)制作軟件——Adobe Flash CS6
1.6網(wǎng)頁(yè)制作入門(mén)
1.6.1HTML簡(jiǎn)介
1.6.2CSS簡(jiǎn)介
1.6.3JavaScript簡(jiǎn)介
1.7常見(jiàn)瀏覽器介紹
思考與實(shí)踐
第2章Dreamweaver CS6基礎(chǔ)入門(mén)
2.1Dreamweaver CS6簡(jiǎn)介
2.1.1Dreamweaver CS6新增功能
2.1.2Dreamweaver CS6工作區(qū)
2.2Dreamweaver CS6站點(diǎn)建設(shè)與管理
2.2.1案例分析： 嘉州文化長(zhǎng)廊網(wǎng)站
2.2.2網(wǎng)站站點(diǎn)規(guī)劃與創(chuàng)建
2.2.3站點(diǎn)管理
2.3使用Dreamweaver CS6制作簡(jiǎn)單網(wǎng)頁(yè)
2.3.1案例分析： “嘉州畫(huà)派”網(wǎng)頁(yè)設(shè)計(jì)
2.3.2HTML基礎(chǔ)
2.3.3CSS基礎(chǔ)
2.3.4案例制作： 圖文并茂頁(yè)面制作
思考與實(shí)踐
第3章Dreamweaver CS6網(wǎng)頁(yè)綜合設(shè)計(jì)
3.1表格布局
3.1.1案例分析： “文化動(dòng)態(tài)”網(wǎng)頁(yè)設(shè)計(jì)
3.1.2表格基礎(chǔ)
3.1.3表格布局綜合案例制作
3.2DIV+CSS布局
3.2.1網(wǎng)站標(biāo)準(zhǔn)
3.2.2案例分析
3.2.3DIV基礎(chǔ)
3.2.4案例制作——頁(yè)眉Banner制作
3.2.5CSS盒子模型
3.2.6盒子的浮動(dòng)
3.2.7案例制作——頁(yè)眉導(dǎo)航條制作
3.2.8導(dǎo)航條專(zhuān)項(xiàng)
3.2.9清除浮動(dòng)
3.2.10案例制作——主體內(nèi)容和頁(yè)腳制作
3.2.11盒子的定位
3.2.12綜合提高練習(xí)
3.3超鏈接應(yīng)用
3.3.1案例分析
3.3.2超鏈接基礎(chǔ)
3.3.3案例制作——實(shí)現(xiàn)內(nèi)部超鏈接
3.3.4案例制作——實(shí)現(xiàn)外部超鏈接
3.3.5案例制作——實(shí)現(xiàn)錨記超鏈接
3.3.6案例制作——超鏈接風(fēng)格美化
3.4創(chuàng)建并使用外部CSS樣式
3.4.1創(chuàng)建外部CSS文件
3.4.2鏈接外部CSS文件
3.4.3案例制作——?jiǎng)?chuàng)建并鏈接外部樣式表
思考與實(shí)踐
第4章網(wǎng)頁(yè)設(shè)計(jì)高級(jí)應(yīng)用
4.1表單
4.1.1表單概述
4.1.2案例分析
4.1.3認(rèn)識(shí)表單控件
4.1.4案例制作
4.2嵌入式框架
4.2.1案例分析
4.2.2認(rèn)識(shí)嵌入式框架
4.2.3案例制作
4.3CSS特效
4.3.1創(chuàng)建圓角
4.3.2添加陰影
4.3.3背景編輯
4.3.4透明度設(shè)置
4.3.5轉(zhuǎn)換效果
4.3.6過(guò)渡動(dòng)畫(huà)設(shè)置
4.4JavaScript特效
4.4.1JavaScript簡(jiǎn)介
4.4.2JavaScript基本語(yǔ)法
4.4.3認(rèn)識(shí)【行為】面板
4.4.4案例制作——滾動(dòng)圖片的停止與運(yùn)行
4.4.5案例制作——元素的顯示與隱藏
思考與實(shí)踐
第5章Photoshop CS6基礎(chǔ)入門(mén)
5.1圖像處理基本知識(shí)
5.1.1像素、圖像分辨率與位圖
5.1.2圖像的顏色模式
5.1.3圖像的文件格式
5.2Photoshop CS6工作環(huán)境及優(yōu)化設(shè)置
5.2.1Photoshop CS6的新增功能
5.2.2認(rèn)識(shí)Photoshop CS6工作界面組件
5.2.3切換工作界面
5.2.4自定義工作界面
5.2.5工作界面相關(guān)參數(shù)設(shè)置
5.3Photoshop CS6的基本操作
5.3.1基本文件操作
5.3.2調(diào)整圖像與畫(huà)布
5.3.3圖像的顯示
5.3.4恢復(fù)錯(cuò)誤操作或文件
思考與實(shí)踐
第6章Photoshop CS6圖像處理
6.1選區(qū)的創(chuàng)建與編輯
6.1.1選框工具
6.1.2套索工具
6.1.3快速選擇工具和魔棒工具
6.1.4裁剪工具
6.1.5選區(qū)編輯
6.2圖層的創(chuàng)建與應(yīng)用
6.2.1圖層的基本概念
6.2.2圖層的基本操作
6.2.3編輯圖層
6.2.4圖層效果和樣式
6.3圖像的繪制和修飾
6.3.1設(shè)置顏色
6.3.2畫(huà)筆工具
6.3.3漸變工具與油漆桶
6.3.4圖章工具
6.3.5橡皮擦與魔術(shù)橡皮擦工具
6.3.6修復(fù)、修補(bǔ)和紅眼工具的使用
6.3.7模糊、銳化和涂抹工具的使用
6.3.8減淡、加深和海綿工具的使用
6.4路徑與文字工具
6.4.1創(chuàng)建路徑
6.4.2編輯路徑
6.4.3文字工具
6.5色彩與色調(diào)的調(diào)整
6.5.1色彩平衡調(diào)整
6.5.2【色相/飽和度】命令
6.5.3亮度對(duì)比度調(diào)整
6.5.4【色階】命令
6.6蒙版
6.6.1圖層蒙版
6.6.2快速蒙版
6.6.3圖像合成案例制作
6.7濾鏡
6.7.1濾鏡基礎(chǔ)知識(shí)
6.7.2風(fēng)格化濾鏡
6.7.3扭曲濾鏡
6.7.4像素化
6.7.5渲染
6.7.6畫(huà)筆描邊濾鏡
6.7.7素描濾鏡
6.7.8紋理濾鏡
6.7.9蒙版與濾鏡示例制作
6.8動(dòng)畫(huà)的制作
6.8.1認(rèn)識(shí)幀模式【時(shí)間軸】面板
6.8.2創(chuàng)建幀動(dòng)畫(huà)
6.9常見(jiàn)網(wǎng)頁(yè)元素設(shè)計(jì)及圖像制作綜合案例
6.9.1網(wǎng)頁(yè)背景圖案制作
6.9.2網(wǎng)站Logo制作
6.9.3按鈕案例制作
6.9.4網(wǎng)站Banner制作
思考與實(shí)踐
第7章Flash CS6動(dòng)畫(huà)設(shè)計(jì)基礎(chǔ)
7.1Flash基礎(chǔ)入門(mén)
7.1.1Flash CS6概述
7.1.2Flash CS6的操作界面
7.2Flash動(dòng)畫(huà)基礎(chǔ)
7.2.1與Flash文檔相關(guān)的文件類(lèi)型
7.2.2時(shí)間軸
7.2.3元件與示例
7.2.4選取對(duì)象
7.2.5Flash CS6影片制作的基本流程
7.3Flash CS6基本工具的使用
7.3.1線條、刷子、顏料桶、變形工具
7.3.2橢圓、矩形、多角星形工具
7.3.3橡皮擦、鉛筆、鋼筆工具
思考與實(shí)踐
第8章Flash CS6動(dòng)畫(huà)制作
8.1制作逐幀動(dòng)畫(huà)
8.1.1逐幀動(dòng)畫(huà)的創(chuàng)建
8.1.2繪圖紙
8.1.3逐幀動(dòng)畫(huà)示例
8.2制作形狀補(bǔ)間動(dòng)畫(huà)
8.2.1形狀補(bǔ)間動(dòng)畫(huà)的創(chuàng)建
8.2.2形狀補(bǔ)間動(dòng)畫(huà)示例——文字變國(guó)旗
8.3制作傳統(tǒng)補(bǔ)間動(dòng)畫(huà)
8.3.1創(chuàng)建傳統(tǒng)補(bǔ)間的方法
8.3.2傳統(tǒng)補(bǔ)間動(dòng)畫(huà)示例——漸變的廣告動(dòng)畫(huà)
8.4制作補(bǔ)間動(dòng)畫(huà)
8.4.1制作補(bǔ)間動(dòng)畫(huà)
8.4.2補(bǔ)間動(dòng)畫(huà)和傳統(tǒng)補(bǔ)間之間的差異
8.4.3補(bǔ)間動(dòng)畫(huà)示例——珍愛(ài)生命
8.5制作路徑動(dòng)畫(huà)
8.5.1創(chuàng)建沿路徑運(yùn)動(dòng)的傳統(tǒng)補(bǔ)間
8.5.2應(yīng)用沿路徑運(yùn)動(dòng)的傳統(tǒng)補(bǔ)間動(dòng)畫(huà)的技巧
8.5.3路徑動(dòng)畫(huà)制作示例——蝴蝶飛舞
8.6制作遮罩動(dòng)畫(huà)
8.6.1創(chuàng)建遮罩動(dòng)畫(huà)
8.6.2遮罩動(dòng)畫(huà)制作示例
8.7為Flah動(dòng)畫(huà)添加聲音
8.7.1導(dǎo)入聲音
8.7.2添加聲音到影片幀中
8.7.3查看聲波
8.8制作交互式動(dòng)畫(huà)
8.8.1【動(dòng)作】面板介紹
8.8.2為關(guān)鍵幀添加ActionScript
8.8.3為按鈕添加ActionScript
8.8.4為影片剪輯添加ActionScript
8.8.5stop和play語(yǔ)句
8.8.6goto語(yǔ)句
8.8.7getURL語(yǔ)句
8.8.8綜合案例——?jiǎng)赢?huà)Banner制作
思考與實(shí)踐
第9章網(wǎng)站的規(guī)劃與設(shè)計(jì)
9.1網(wǎng)站規(guī)劃概念
9.2網(wǎng)站內(nèi)容規(guī)劃
9.2.1網(wǎng)站類(lèi)型
9.2.2網(wǎng)站應(yīng)該包括的內(nèi)容
9.2.3目錄結(jié)構(gòu)規(guī)劃
9.2.4鏈接結(jié)構(gòu)規(guī)劃
9.2.5圖片文字規(guī)格
9.3網(wǎng)站策劃
9.3.1網(wǎng)站功能分析
9.3.2網(wǎng)站非功能分析
9.4網(wǎng)頁(yè)制作
9.4.1首頁(yè)版面設(shè)計(jì)
9.4.2首頁(yè)制作
9.4.3模板制作
9.4.4其他頁(yè)面制作
9.5測(cè)試和發(fā)布網(wǎng)站
9.5.1站點(diǎn)的本地測(cè)試
9.5.2域名空間的申請(qǐng)
9.5.3發(fā)布站點(diǎn)
9.5.4更新維護(hù)站點(diǎn)
思考與實(shí)踐
參考文獻(xiàn)