第 1章　初識(shí)網(wǎng)頁設(shè)計(jì) 學(xué)習(xí)引導(dǎo)　1 1.1　網(wǎng)頁設(shè)計(jì)的相關(guān)概念　2 1.1.1　網(wǎng)站的概念　2 1.1.2　網(wǎng)頁的概念　2 1.1.3　網(wǎng)頁設(shè)計(jì)的概念　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　站點(diǎn)　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è)計(jì)的特點(diǎn)　6 1.4.1　媒體綜合　6 1.4.2　藝術(shù)獨(dú)特　6 1.4.3　技術(shù)多元　6 1.4.4　交互豐富　6 1.5　網(wǎng)頁設(shè)計(jì)的必備技能　6 1.5.1　使用軟件　6 1.5.2　使用腳本語言　7 1.6　網(wǎng)頁設(shè)計(jì)的流程　7 1.6.1　網(wǎng)站策劃　8 1.6.2　素材搜集　8 1.6.3　交互設(shè)計(jì)　8 1.6.4　界面設(shè)計(jì)　8 1.6.5　網(wǎng)站制作　8 1.6.6　測(cè)試發(fā)布　8 第　2章 網(wǎng)頁設(shè)計(jì)基本規(guī)范 學(xué)習(xí)引導(dǎo)　9 2.1　設(shè)計(jì)單位　10 2.1.1　英寸　10 2.1.2　像素　10 2.1.3　分辨率　10 2.2　設(shè)計(jì)尺寸　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　字號(hào)大小　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è)計(jì)尺寸　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è)計(jì) 學(xué)習(xí)引導(dǎo)　25 3.1　導(dǎo)航系統(tǒng)設(shè)計(jì)　26 3.1.1　導(dǎo)航菜單　26 3.1.2　面包屑導(dǎo)航　26 3.1.3　選項(xiàng)卡導(dǎo)航　27 3.1.4　錨點(diǎn)導(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è)計(jì)中式茶葉官方網(wǎng)站導(dǎo)航菜單　30 3.2　廣告組件設(shè)計(jì)　35 3.2.1　輪播廣告　35 3.2.2　彈出式廣告　36 3.2.3　浮動(dòng)式廣告　37 3.2.4　課堂案例——設(shè)計(jì)中式家具電商平臺(tái)網(wǎng)站輪播廣告　37 3.3　展示組件設(shè)計(jì)　51 3.3.1　卡片　51 3.3.2　列表　52 3.3.3　表格　52 3.3.4　折疊面板　53 3.3.5　課堂案例——設(shè)計(jì)中式茶葉官方網(wǎng)站新聞列表　54 3.4　輸入組件設(shè)計(jì)　58 3.4.1　搜索　59 3.4.2　表單　60 3.4.3　課堂案例——設(shè)計(jì)職業(yè)教育管理系統(tǒng)網(wǎng)站注冊(cè)表單　61 3.5　課堂練習(xí)——設(shè)計(jì)科技公司官方
網(wǎng)站導(dǎo)航　67 3.6　課后習(xí)題——設(shè)計(jì)有機(jī)果蔬電商平臺(tái)網(wǎng)站輪播廣告　68 第4章　官方展示網(wǎng)頁設(shè)計(jì) 學(xué)習(xí)引導(dǎo)　69 4.1　官方展示網(wǎng)站頁面設(shè)計(jì)　70 4.1.1　官方展示網(wǎng)站的內(nèi)容規(guī)劃　70 4.1.2　官方展示網(wǎng)站的設(shè)計(jì)風(fēng)格　70 4.1.3　官方展示網(wǎng)站的頁面類型　72 4.1.4　課堂案例——設(shè)計(jì)中式茶葉官方網(wǎng)站首頁　73 4.2　課堂練習(xí)——設(shè)計(jì)中式茶葉官方網(wǎng)站其他頁面　95 4.3　課后習(xí)題——設(shè)計(jì)科技公司官方網(wǎng)站　97 第5章　電商平臺(tái)網(wǎng)頁設(shè)計(jì) 學(xué)習(xí)引導(dǎo)　99 5.1　電商平臺(tái)網(wǎng)站頁面設(shè)計(jì)　100 5.1.1　電商平臺(tái)網(wǎng)站的內(nèi)容規(guī)劃　100 5.1.2　電商平臺(tái)網(wǎng)站的設(shè)計(jì)風(fēng)格　101 5.1.3　電商平臺(tái)網(wǎng)站的頁面類型　102 5.1.4　課堂案例——設(shè)計(jì)中式家具電商平臺(tái)網(wǎng)站首頁　104 5.2　課堂練習(xí)——設(shè)計(jì)中式家具電商平臺(tái)網(wǎng)站其他頁面　131 5.3　課后習(xí)題——設(shè)計(jì)有機(jī)果蔬電商平臺(tái)網(wǎng)站　133 第6章　管理系統(tǒng)網(wǎng)頁設(shè)計(jì) 學(xué)習(xí)引導(dǎo)　135 6.1　管理系統(tǒng)網(wǎng)站頁面設(shè)計(jì)　136 6.1.1　管理系統(tǒng)網(wǎng)站的內(nèi)容規(guī)劃　136 6.1.2　管理系統(tǒng)網(wǎng)站的設(shè)計(jì)風(fēng)格　136 6.1.3　管理系統(tǒng)網(wǎng)站的頁面類型　138 6.1.4　課堂案例——設(shè)計(jì)職業(yè)教育管理系統(tǒng)網(wǎng)站首頁　140 6.2　課堂練習(xí)——設(shè)計(jì)職業(yè)教育管理系統(tǒng)網(wǎng)站其他頁面　174 6.3　課后習(xí)題——設(shè)計(jì)網(wǎng)店內(nèi)容管理系統(tǒng)網(wǎng)站　176 第7章　移動(dòng)端網(wǎng)頁設(shè)計(jì) 學(xué)習(xí)引導(dǎo)　178 7.1　移動(dòng)端網(wǎng)站頁面設(shè)計(jì)　179 7.1.1　移動(dòng)端網(wǎng)站的設(shè)計(jì)方法　179 7.1.2　響應(yīng)式網(wǎng)頁的設(shè)計(jì)模式　180 7.1.3　網(wǎng)頁觸摸式設(shè)計(jì)的優(yōu)化　182 7.1.4　課堂案例——設(shè)計(jì)移動(dòng)端中式茶葉官方網(wǎng)站首頁　183 7.2　課堂練習(xí)——設(shè)計(jì)移動(dòng)端中式茶葉官方網(wǎng)站其他頁面　201 7.3　課后習(xí)題——設(shè)計(jì)移動(dòng)端科技公司官方網(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　使用插件自動(dòng)化標(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