第 1章　初識網(wǎng)頁設(shè)計 學(xué)習(xí)引導(dǎo)　1 1.1　網(wǎng)頁設(shè)計的相關(guān)概念　2 1.1.1　網(wǎng)站的概念　2 1.1.2　網(wǎng)頁的概念　2 1.1.3　網(wǎng)頁設(shè)計的概念　3 1.2　網(wǎng)站的相關(guān)術(shù)語　3 1.2.1　域名　3 1.2.2　網(wǎng)站空間　3 1.2.3　HTTP　4 1.2.4　FTP　4 1.2.5　超鏈接　4 1.2.6　站點　4 1.3　網(wǎng)頁的常見類型　5 1.3.1　功能型網(wǎng)頁　5 1.3.2　展示型網(wǎng)頁　5 1.3.3　信息型網(wǎng)頁　5 1.4　網(wǎng)頁設(shè)計的特點　6 1.4.1　媒體綜合　6 1.4.2　藝術(shù)獨特　6 1.4.3　技術(shù)多元　6 1.4.4　交互豐富　6 1.5　網(wǎng)頁設(shè)計的必備技能　6 1.5.1　使用軟件　6 1.5.2　使用腳本語言　7 1.6　網(wǎng)頁設(shè)計的流程　7 1.6.1　網(wǎng)站策劃　8 1.6.2　素材搜集　8 1.6.3　交互設(shè)計　8 1.6.4　界面設(shè)計　8 1.6.5　網(wǎng)站制作　8 1.6.6　測試發(fā)布　8 第　2章 網(wǎng)頁設(shè)計基本規(guī)范 學(xué)習(xí)引導(dǎo)　9 2.1　設(shè)計單位　10 2.1.1　英寸　10 2.1.2　像素　10 2.1.3　分辨率　10 2.2　設(shè)計尺寸　11 2.2.1　頁面寬度　11 2.2.2　安全寬度　12 2.2.3　首屏高度　13 2.3　基礎(chǔ)布局　13 2.4　柵格系統(tǒng)　14 2.4.1　柵格系統(tǒng)的概念　14 2.4.2　柵格系統(tǒng)的組成　14 2.4.3　柵格系統(tǒng)的搭建　15 2.5　文字規(guī)范　16 2.5.1　安全字體　16 2.5.2　字號大小　17 2.5.3　文字字重　18 2.5.4　文字行高　19 2.5.5　文字間距　19 2.5.6　行間距　20 2.5.7　段落間距　20 2.6　圖標(biāo)規(guī)范　20 2.6.1　設(shè)計尺寸　20 2.6.2　視覺平衡　21 2.6.3　視覺調(diào)整　22 2.6.4　使用原則　23 2.7　圖片比例　23 2.8　控件管理　24 第3章　網(wǎng)頁常用組件設(shè)計 學(xué)習(xí)引導(dǎo)　25 3.1　導(dǎo)航系統(tǒng)設(shè)計　26 3.1.1　導(dǎo)航菜單　26 3.1.2　面包屑導(dǎo)航　26 3.1.3　選項卡導(dǎo)航　27 3.1.4　錨點導(dǎo)航　27 3.1.5　分步導(dǎo)航　28 3.1.6　分頁導(dǎo)航　28 3.1.7　樹形導(dǎo)航　29 3.1.8　課堂案例——設(shè)計中式茶葉官方網(wǎng)站導(dǎo)航菜單　30 3.2　廣告組件設(shè)計　35 3.2.1　輪播廣告　35 3.2.2　彈出式廣告　36 3.2.3　浮動式廣告　37 3.2.4　課堂案例——設(shè)計中式家具電商平臺網(wǎng)站輪播廣告　37 3.3　展示組件設(shè)計　51 3.3.1　卡片　51 3.3.2　列表　52 3.3.3　表格　52 3.3.4　折疊面板　53 3.3.5　課堂案例——設(shè)計中式茶葉官方網(wǎng)站新聞列表　54 3.4　輸入組件設(shè)計　58 3.4.1　搜索　59 3.4.2　表單　60 3.4.3　課堂案例——設(shè)計職業(yè)教育管理系統(tǒng)網(wǎng)站注冊表單　61 3.5　課堂練習(xí)——設(shè)計科技公司官方
網(wǎng)站導(dǎo)航　67 3.6　課后習(xí)題——設(shè)計有機果蔬電商平臺網(wǎng)站輪播廣告　68 第4章　官方展示網(wǎng)頁設(shè)計 學(xué)習(xí)引導(dǎo)　69 4.1　官方展示網(wǎng)站頁面設(shè)計　70 4.1.1　官方展示網(wǎng)站的內(nèi)容規(guī)劃　70 4.1.2　官方展示網(wǎng)站的設(shè)計風(fēng)格　70 4.1.3　官方展示網(wǎng)站的頁面類型　72 4.1.4　課堂案例——設(shè)計中式茶葉官方網(wǎng)站首頁　73 4.2　課堂練習(xí)——設(shè)計中式茶葉官方網(wǎng)站其他頁面　95 4.3　課后習(xí)題——設(shè)計科技公司官方網(wǎng)站　97 第5章　電商平臺網(wǎng)頁設(shè)計 學(xué)習(xí)引導(dǎo)　99 5.1　電商平臺網(wǎng)站頁面設(shè)計　100 5.1.1　電商平臺網(wǎng)站的內(nèi)容規(guī)劃　100 5.1.2　電商平臺網(wǎng)站的設(shè)計風(fēng)格　101 5.1.3　電商平臺網(wǎng)站的頁面類型　102 5.1.4　課堂案例——設(shè)計中式家具電商平臺網(wǎng)站首頁　104 5.2　課堂練習(xí)——設(shè)計中式家具電商平臺網(wǎng)站其他頁面　131 5.3　課后習(xí)題——設(shè)計有機果蔬電商平臺網(wǎng)站　133 第6章　管理系統(tǒng)網(wǎng)頁設(shè)計 學(xué)習(xí)引導(dǎo)　135 6.1　管理系統(tǒng)網(wǎng)站頁面設(shè)計　136 6.1.1　管理系統(tǒng)網(wǎng)站的內(nèi)容規(guī)劃　136 6.1.2　管理系統(tǒng)網(wǎng)站的設(shè)計風(fēng)格　136 6.1.3　管理系統(tǒng)網(wǎng)站的頁面類型　138 6.1.4　課堂案例——設(shè)計職業(yè)教育管理系統(tǒng)網(wǎng)站首頁　140 6.2　課堂練習(xí)——設(shè)計職業(yè)教育管理系統(tǒng)網(wǎng)站其他頁面　174 6.3　課后習(xí)題——設(shè)計網(wǎng)店內(nèi)容管理系統(tǒng)網(wǎng)站　176 第7章　移動端網(wǎng)頁設(shè)計 學(xué)習(xí)引導(dǎo)　178 7.1　移動端網(wǎng)站頁面設(shè)計　179 7.1.1　移動端網(wǎng)站的設(shè)計方法　179 7.1.2　響應(yīng)式網(wǎng)頁的設(shè)計模式　180 7.1.3　網(wǎng)頁觸摸式設(shè)計的優(yōu)化　182 7.1.4　課堂案例——設(shè)計移動端中式茶葉官方網(wǎng)站首頁　183 7.2　課堂練習(xí)——設(shè)計移動端中式茶葉官方網(wǎng)站其他頁面　201 7.3　課后習(xí)題——設(shè)計移動端科技公司官方網(wǎng)站　202 第8章　網(wǎng)頁的標(biāo)注、輸出與命名 學(xué)習(xí)引導(dǎo)　204 8.1　網(wǎng)頁頁面標(biāo)注　205 8.1.1　直接導(dǎo)出為HTML文件　205 8.1.2　使用插件自動化標(biāo)注　206 8.1.3　課堂案例——標(biāo)注中式茶葉官方網(wǎng)站首頁　206 8.2　輸出網(wǎng)頁元素　209 8.2.1　輸出圖標(biāo)元素　209 8.2.2　輸出圖片元素　211 8.2.3　輸出多媒體元素　213 8.2.4　課堂案例——輸出中式茶葉官方網(wǎng)站首頁元素　213 8.3　網(wǎng)頁的命名　216 8.3.1　圖片的命名　216 8.3.2　文件的命名　217 8.3.3　課堂案例——命名中式茶葉官方網(wǎng)站首頁圖片　218 8.4　課堂練習(xí)——輸出科技公司官方網(wǎng)站首頁元素　220 8.5　課后習(xí)題——命名科技公司官方網(wǎng)站首頁圖片　220