本書全面、系統(tǒng)地介紹網(wǎng)頁設計的相關知識和技巧,包括初識網(wǎng)頁設計,網(wǎng)頁設計基本規(guī)范,網(wǎng)頁常用組件設計,官方展示網(wǎng)頁設計,電商平臺網(wǎng)頁設計,管理系統(tǒng)網(wǎng)頁設計,移動端網(wǎng)頁設計,以及網(wǎng)頁的標注、輸出與命名等內容。
全書以知識點講解加課堂案例為主線,知識點講解部分使學生能夠系統(tǒng)地了解網(wǎng)頁設計的各類規(guī)范,課堂案例部分使學生可以快速掌握網(wǎng)頁設計的流程與技巧。本書還安排了課堂練習和課后習題,可以拓展學生對網(wǎng)頁設計的實際應用能力。
本書可作為高等院校數(shù)字媒體藝術類專業(yè)課程的教材,也可供網(wǎng)頁設計初學者自學參考。
1.慕課支撐教學
2.案例豐富,淺顯易懂
3.微課輔助,操作視頻掃碼即可觀看
4.附贈資源豐富,素材、擴展案例、教學大綱等
5.拓展學生對網(wǎng)頁設計的實際應用能力
周建國 主要研究方向:應用軟件在電腦藝術設計專業(yè)中的應用,平面設計、網(wǎng)頁設計、動畫設計方向。 Photoshop中文版基礎培訓教程 09397 人民郵電出版社 2001年 8萬冊 CorelDRAW中文版基礎培訓教程 09081 人民郵電出版社 2001年 8萬冊
第 1章 初識網(wǎng)頁設計
學習引導 1
1.1 網(wǎng)頁設計的相關概念 2
1.1.1 網(wǎng)站的概念 2
1.1.2 網(wǎng)頁的概念 2
1.1.3 網(wǎng)頁設計的概念 3
1.2 網(wǎng)站的相關術語 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)頁設計的特點 6
1.4.1 媒體綜合 6
1.4.2 藝術獨特 6
1.4.3 技術多元 6
1.4.4 交互豐富 6
1.5 網(wǎng)頁設計的必備技能 6
1.5.1 使用軟件 6
1.5.2 使用腳本語言 7
1.6 網(wǎng)頁設計的流程 7
1.6.1 網(wǎng)站策劃 8
1.6.2 素材搜集 8
1.6.3 交互設計 8
1.6.4 界面設計 8
1.6.5 網(wǎng)站制作 8
1.6.6 測試發(fā)布 8
第 2章 網(wǎng)頁設計基本規(guī)范
學習引導 9
2.1 設計單位 10
2.1.1 英寸 10
2.1.2 像素 10
2.1.3 分辨率 10
2.2 設計尺寸 11
2.2.1 頁面寬度 11
2.2.2 安全寬度 12
2.2.3 首屏高度 13
2.3 基礎布局 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 圖標規(guī)范 20
2.6.1 設計尺寸 20
2.6.2 視覺平衡 21
2.6.3 視覺調整 22
2.6.4 使用原則 23
2.7 圖片比例 23
2.8 控件管理 24
第3章 網(wǎng)頁常用組件設計
學習引導 25
3.1 導航系統(tǒng)設計 26
3.1.1 導航菜單 26
3.1.2 面包屑導航 26
3.1.3 選項卡導航 27
3.1.4 錨點導航 27
3.1.5 分步導航 28
3.1.6 分頁導航 28
3.1.7 樹形導航 29
3.1.8 課堂案例——設計中式茶葉官方網(wǎng)站導航菜單 30
3.2 廣告組件設計 35
3.2.1 輪播廣告 35
3.2.2 彈出式廣告 36
3.2.3 浮動式廣告 37
3.2.4 課堂案例——設計中式家具電商平臺網(wǎng)站輪播廣告 37
3.3 展示組件設計 51
3.3.1 卡片 51
3.3.2 列表 52
3.3.3 表格 52
3.3.4 折疊面板 53
3.3.5 課堂案例——設計中式茶葉官方網(wǎng)站新聞列表 54
3.4 輸入組件設計 58
3.4.1 搜索 59
3.4.2 表單 60
3.4.3 課堂案例——設計職業(yè)教育管理系統(tǒng)網(wǎng)站注冊表單 61
3.5 課堂練習——設計科技公司官方
網(wǎng)站導航 67
3.6 課后習題——設計有機果蔬電商平臺網(wǎng)站輪播廣告 68
第4章 官方展示網(wǎng)頁設計
學習引導 69
4.1 官方展示網(wǎng)站頁面設計 70
4.1.1 官方展示網(wǎng)站的內容規(guī)劃 70
4.1.2 官方展示網(wǎng)站的設計風格 70
4.1.3 官方展示網(wǎng)站的頁面類型 72
4.1.4 課堂案例——設計中式茶葉官方網(wǎng)站首頁 73
4.2 課堂練習——設計中式茶葉官方網(wǎng)站其他頁面 95
4.3 課后習題——設計科技公司官方網(wǎng)站 97
第5章 電商平臺網(wǎng)頁設計
學習引導 99
5.1 電商平臺網(wǎng)站頁面設計 100
5.1.1 電商平臺網(wǎng)站的內容規(guī)劃 100
5.1.2 電商平臺網(wǎng)站的設計風格 101
5.1.3 電商平臺網(wǎng)站的頁面類型 102
5.1.4 課堂案例——設計中式家具電商平臺網(wǎng)站首頁 104
5.2 課堂練習——設計中式家具電商平臺網(wǎng)站其他頁面 131
5.3 課后習題——設計有機果蔬電商平臺網(wǎng)站 133
第6章 管理系統(tǒng)網(wǎng)頁設計
學習引導 135
6.1 管理系統(tǒng)網(wǎng)站頁面設計 136
6.1.1 管理系統(tǒng)網(wǎng)站的內容規(guī)劃 136
6.1.2 管理系統(tǒng)網(wǎng)站的設計風格 136
6.1.3 管理系統(tǒng)網(wǎng)站的頁面類型 138
6.1.4 課堂案例——設計職業(yè)教育管理系統(tǒng)網(wǎng)站首頁 140
6.2 課堂練習——設計職業(yè)教育管理系統(tǒng)網(wǎng)站其他頁面 174
6.3 課后習題——設計網(wǎng)店內容管理系統(tǒng)網(wǎng)站 176
第7章 移動端網(wǎng)頁設計
學習引導 178
7.1 移動端網(wǎng)站頁面設計 179
7.1.1 移動端網(wǎng)站的設計方法 179
7.1.2 響應式網(wǎng)頁的設計模式 180
7.1.3 網(wǎng)頁觸摸式設計的優(yōu)化 182
7.1.4 課堂案例——設計移動端中式茶葉官方網(wǎng)站首頁 183
7.2 課堂練習——設計移動端中式茶葉官方網(wǎng)站其他頁面 201
7.3 課后習題——設計移動端科技公司官方網(wǎng)站 202
第8章 網(wǎng)頁的標注、輸出與命名
學習引導 204
8.1 網(wǎng)頁頁面標注 205
8.1.1 直接導出為HTML文件 205
8.1.2 使用插件自動化標注 206
8.1.3 課堂案例——標注中式茶葉官方網(wǎng)站首頁 206
8.2 輸出網(wǎng)頁元素 209
8.2.1 輸出圖標元素 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 課堂練習——輸出科技公司官方網(wǎng)站首頁元素 220
8.5 課后習題——命名科技公司官方網(wǎng)站首頁圖片 220