子項(xiàng)目1 網(wǎng)站建設(shè)基礎(chǔ)知識與整體流程 1 項(xiàng)目任務(wù)1.1 了解網(wǎng)站建設(shè)的基礎(chǔ)知識 1 1.1.1 認(rèn)識網(wǎng)頁和網(wǎng)站 2 1.1.2 了解網(wǎng)頁制作技術(shù) 3 1.1.3 了解網(wǎng)頁制作常用工具 4 1.1.4 編寫第一個網(wǎng)頁 10 項(xiàng)目任務(wù)1.2 熟悉網(wǎng)站建設(shè)的整體流程 11 1.2.1 網(wǎng)站前期策劃 12 1.2.2 制作裁切網(wǎng)站設(shè)計稿 16 1.2.3 規(guī)劃與建立站點(diǎn) 16 1.2.4 實(shí)現(xiàn)網(wǎng)頁結(jié)構(gòu) 17 1.2.5 使用CSS樣式美化首頁 17 1.2.6 創(chuàng)建并應(yīng)用網(wǎng)頁模板 17 1.2.7 測試與發(fā)布網(wǎng)站 17 1.2.8 更新與維護(hù)網(wǎng)站 18 1.2.9 網(wǎng)站項(xiàng)目總結(jié) 18 1.3 小結(jié) 18 子項(xiàng)目2 “我的E站”前期策劃 19 項(xiàng)目任務(wù)2.1 “我的E站”項(xiàng)目立項(xiàng) 19 2.1.1 分析“我的E站”需求說明書 20 2.1.2 組建項(xiàng)目團(tuán)隊(duì) 20 項(xiàng)目任務(wù)2.2 撰寫“我的E站”項(xiàng)目策劃書 21 2.2.1 分析確定網(wǎng)站邏輯結(jié)構(gòu)圖 22 2.2.2 設(shè)計網(wǎng)站界面原型 22 2.2.3 撰寫項(xiàng)目策劃書 26 2.3 小結(jié) 28 子項(xiàng)目3 “我的E站”前期準(zhǔn)備 29 項(xiàng)目任務(wù)3.1 設(shè)計網(wǎng)站LOGO 29 3.1.1 LOGO設(shè)計思想與設(shè)計原則 30 3.1.2 網(wǎng)站常用圖片格式 31 3.1.3 制作“我的E站”LOGO 32 項(xiàng)目任務(wù)3.2 加工圖像素材 36 3.2.1 批量處理圖像 39 3.2.2 去除圖片水印 41 3.2.3 調(diào)整圖像屬性 41 3.2.4 美化加工圖像 43 3.2.5 應(yīng)用特殊文字 46 項(xiàng)目任務(wù)3.3 設(shè)計制作網(wǎng)站界面 48 3.3.1 設(shè)置頁面大小 49 3.3.2 規(guī)劃首頁內(nèi)容并設(shè)計版式 50 3.3.3 確定配色方案 50 3.3.4 制作網(wǎng)站首頁效果圖 52 3.3.5 制作網(wǎng)站子頁效果圖 64 項(xiàng)目任務(wù)3.4 裁切網(wǎng)站設(shè)計稿 68 3.4.1 切片的原則 70 3.4.2 創(chuàng)建首頁切片 70 3.4.3 編輯首頁切片 73 3.4.4 命名首頁切片 74 3.4.5 導(dǎo)出首頁切片 74 3.4.6 裁切子頁設(shè)計稿 75 項(xiàng)目任務(wù)3.5 制作網(wǎng)站中的動畫 77 3.5.1 Flash基本概念 77 3.5.2 Flash基本操作 80 3.5.3 Flash基本動畫形式 83 3.5.4 制作網(wǎng)站首頁banner 88 3.6 小結(jié) 93 3.7 技能訓(xùn)練 93 3.7.1 裁切網(wǎng)站設(shè)計稿 93 3.7.2 Flash動畫設(shè)計 94 3.7.3 Flash交互界面開發(fā) 99 子項(xiàng)目4 實(shí)現(xiàn)網(wǎng)頁布局 105 項(xiàng)目任務(wù)4.1 創(chuàng)建本地站點(diǎn) 105 4.1.1 規(guī)劃目錄結(jié)構(gòu) 105 4.1.2 熟悉Dreamweaver工作區(qū)并新建本地站點(diǎn) 106 4.1.3 管理本地站點(diǎn) 108 4.1.4 HTML基本概念及結(jié)構(gòu) 110 項(xiàng)目任務(wù)4.2 一列固定寬度布局 113 4.2.1 插入Div標(biāo)簽 114 4.2.2 樣式表種類和CSS選擇器 115 4.2.3 在頁面中引入CSS樣式表 117 4.2.4 CSS樣式代碼編寫規(guī)則 118 4.2.5 CSS盒模型 121 項(xiàng)目任務(wù)4.3 一列多行固定寬度居中布局 127 4.3.1 一列固定寬度居中布局 128 4.3.2 一列多行固定寬度居中布局 129 項(xiàng)目任務(wù)4.4 多列多行固定寬度居中布局 130 4.4.1 DOM樹 132 4.4.2 CSS盒子在標(biāo)準(zhǔn)流中的定位 133 4.4.3 CSS盒子浮動方式 133 4.4.4 二列固定寬度居中布局 135 4.4.5 二列多行固定寬度居中布局 135 4.4.6 清除浮動屬性 136 4.4.7 三列固定寬度居中布局 137 4.4.8 三列多行固定寬度居中布局 137 項(xiàng)目任務(wù)4.5 “我的E站”頁面布局 138 4.5.1 “我的E站”子頁布局 139 4.5.2 “我的E站”首頁布局 143 4.6 小結(jié) 150 4.7 技能訓(xùn)練 150 4.7.1 建立站點(diǎn) 150 4.7.2 編寫HTML代碼結(jié)構(gòu) 150 子項(xiàng)目5 添加和美化網(wǎng)頁內(nèi)容 151 項(xiàng)目任務(wù)5.1 “我的E站”子頁制作 151 5.1.1 文本圖像及樣式 152 5.1.2 列表及樣式 160 5.1.3 超鏈接及樣式 163 5.1.4 背景樣式 166 5.1.5 “關(guān)于我們”頭部制作 169 5.1.6 “E站日記”列表制作 170 5.1.7 表格及樣式 171 項(xiàng)目任務(wù)5.2 “我的E站”首頁制作 178 5.2.1 頭部制作 179 5.2.2 banner制作 180 5.2.3 中部制作 186 5.2.4 其他信息制作 188 5.2.5 底部制作 190 5.3 小結(jié) 192 5.4 技能訓(xùn)練 192 5.4.1 使用CSS布局技術(shù)完成網(wǎng)頁 192 5.4.2 使用列表和CSS制作菜單 193 子項(xiàng)目6 網(wǎng)頁模板及多媒體應(yīng)用 194 項(xiàng)目任務(wù)6.1 創(chuàng)建并應(yīng)用網(wǎng)頁模板 194 6.1.1 創(chuàng)建模板 194 6.1.2 制作模板頁面 196 6.1.3 插入或刪除可編輯區(qū)域 200 6.1.4 應(yīng)用模板 201 項(xiàng)目任務(wù)6.2 添加多媒體元素 204 6.2.1 插入多媒體元素 205 6.2.2 應(yīng)用行為 208 6.2.3 運(yùn)用JavaScript實(shí)現(xiàn)banner效果 210 6.3 小結(jié) 211 6.4 技能訓(xùn)練 212 子項(xiàng)目7 “我的E站”測試與發(fā)布 213 項(xiàng)目任務(wù)7.1 常見瀏覽器兼容問題及解決方案 213 7.1.1 網(wǎng)頁中的標(biāo)簽問題 213 7.1.2　div的垂直居中問題 214 7.1.3　margin加倍的問題 215 7.1.4　浮動IE產(chǎn)生的雙倍距離 216 7.1.5 寬度和高度問題 217 7.1.6 DIV浮動IE文本產(chǎn)生3像素的BUG 220 7.1.7 float清除浮動 220 7.1.8 圖片間有空白間隙問題 224 7.1.9 不同瀏覽器對實(shí)際像素的解釋 225 7.1.10 應(yīng)用條件注釋實(shí)現(xiàn)瀏覽器兼容 225 7.1.11 常用hack方法兼容介紹 226 項(xiàng)目任務(wù)7.2 站點(diǎn)的測試與調(diào)試 227 7.2.1 檢查站點(diǎn)范圍的鏈接 227 7.2.2 改變站點(diǎn)范圍的鏈接 228 7.2.3 清理HTML 228 7.2.4 清理Word生成的HTML 229 7.2.5 同步 229 7.2.6 生成輔助功能報告 230 7.2.7 站點(diǎn)測試指南 230 項(xiàng)目任務(wù)7.3 網(wǎng)站的發(fā)布 231 7.3.1 申請域名 231 7.3.2 申請空間 235 7.3.3 站點(diǎn)的上傳 238 7.4 小結(jié) 240 7.5 技能訓(xùn)練 240 子項(xiàng)目8 網(wǎng)站的宣傳推廣與維護(hù) 241 項(xiàng)目任務(wù)8.1 網(wǎng)站宣傳推廣 241 8.1.1 常見網(wǎng)站推廣方式 242 8.1.2 網(wǎng)站推廣步驟 249 8.1.3 搜索引擎優(yōu)化工具 250 項(xiàng)目任務(wù)8.2 網(wǎng)站維護(hù) 252 8.2.1 網(wǎng)站維護(hù)的重要性 252 8.2.2 網(wǎng)站維護(hù)的基本內(nèi)容 253 8.3 小結(jié) 254 子項(xiàng)目9 “我的E站”項(xiàng)目總結(jié) 255 項(xiàng)目任務(wù)9.1 文檔的書寫與整理 255 項(xiàng)目任務(wù)9.2 網(wǎng)站展示、交流與評價 257 9.3 小結(jié) 259 子項(xiàng)目10 將頁面移植到移動設(shè)備 260 項(xiàng)目任務(wù)10.1 將“我的E站” 頁面 轉(zhuǎn)為響應(yīng)式 設(shè)計 260 10.1.1 響應(yīng)式設(shè)計概述 262 10.1.2 移動化“關(guān)于我們”頁面 264 項(xiàng)目任務(wù)10.2 Bootstrap框架介紹 266 10.2.1 Bootstrap框架 簡介 267 10.2.2 下載Bootstrap 框架 268 10.2.3 Bootstrap框架文件結(jié)構(gòu) 269 10.2.4 HTML標(biāo)準(zhǔn)模板 269 10.2.5 響應(yīng)式的柵格系統(tǒng) 270 10.2.6 基于Bootstrap框架的首頁制作 271 10.3 小結(jié) 275 附錄A 常用工具、插件及用戶 手冊 276 附錄B 網(wǎng)站制作規(guī)范 277 參考文獻(xiàn) 280