通俗易懂,結(jié)構(gòu)清晰,由淺入深闡述網(wǎng)頁設(shè)計(jì)師必知必會(huì)的基本技能和概念:
互聯(lián)網(wǎng)與萬維網(wǎng)基礎(chǔ)
用HTML5創(chuàng)建網(wǎng)頁
用CSS配置顏色和文本
用CSS配置頁面布局
配置圖像和多媒體
探究CSS3新增屬性
運(yùn)用網(wǎng)頁設(shè)計(jì)*佳實(shí)踐
網(wǎng)頁的無障礙訪問和使用性設(shè)計(jì)
為搜索引擎優(yōu)化而設(shè)計(jì)
選擇域名
上線,發(fā)布到網(wǎng)上
本書第1版和第2版深受師生喜愛,第3版根據(jù)學(xué)習(xí)需要提前在第2章介紹了HTML5結(jié)構(gòu)化元素,并在第5章重點(diǎn)介紹了網(wǎng)頁顏色的搭配。此外,第3版還增加了以下特色:
更多動(dòng)手實(shí)作練習(xí)
案例學(xué)習(xí)有新增和修訂
進(jìn)一步深入介紹網(wǎng)頁布局設(shè)計(jì)
進(jìn)一步深入介紹移動(dòng)網(wǎng)頁設(shè)計(jì)
進(jìn)一步深入介紹響應(yīng)式網(wǎng)頁設(shè)計(jì)技術(shù)
新增對CSS媒體查詢的介紹
本書針對HTML5和CSS3的*新標(biāo)準(zhǔn)進(jìn)行及時(shí)的更新和修訂,包含的主題有:Internet和Web概念;創(chuàng)建HTML5網(wǎng)頁;用CSS配置顏色和文本;用CSS配置頁面布局;配置圖像和多媒體;探索新增的CSS3特性;應(yīng)用網(wǎng)頁設(shè)計(jì)*佳實(shí)踐;設(shè)計(jì)可訪問和可用的網(wǎng)頁;搜索引擎優(yōu)化設(shè)計(jì);選擇域名;發(fā)布網(wǎng)站。
本書適合所有對網(wǎng)頁設(shè)計(jì)感興趣的讀者閱讀,是一本理想的入門參考。
美國哈珀學(xué)院榮休教授。她熟悉各種平臺(tái)和軟件開發(fā)語言,有二十多年的信息技術(shù)教學(xué)經(jīng)驗(yàn),講授的課程有網(wǎng)頁開發(fā)、計(jì)算機(jī)信息系統(tǒng)、教學(xué)技術(shù)和數(shù)學(xué),以及信息管理和數(shù)據(jù)庫研究生課程。
莫里斯博士富有創(chuàng)新精神,先后榮獲2002—2003年度 Glenn A. Reich紀(jì)念獎(jiǎng)(嘉獎(jiǎng)她在教育技術(shù)方面做出的努力)和2006年度 Blackboard Greenhouse遠(yuǎn)程教學(xué)模范獎(jiǎng)(嘉獎(jiǎng)她在課堂教學(xué)中率先使用互聯(lián)網(wǎng)),還作為2008年度遠(yuǎn)程教育優(yōu)秀教師入選美國教育技術(shù)委員會(huì)。
莫里斯博士的《 HTML5網(wǎng)頁設(shè)計(jì)入門經(jīng)典》已經(jīng)出版發(fā)行到第8版,另一本以動(dòng)手實(shí)作和案例學(xué)習(xí)著稱的入門經(jīng)典《HTML5與CSS3網(wǎng)頁設(shè)計(jì)基礎(chǔ)》系列版本也備受廣大師生青睞。
她一直保持旺盛的學(xué)習(xí)力,擁有教育學(xué)博士學(xué)位、信息系統(tǒng)碩士學(xué)位和遠(yuǎn)程教學(xué)碩士學(xué)位,以及很多從業(yè)資格證書:CIW電子商務(wù)設(shè)計(jì)師、CIW設(shè)計(jì)師、CIW認(rèn)證講師,WOW網(wǎng)絡(luò)管理員和Adobe認(rèn)證Dreamweaver 8開發(fā)人員。
第1章 互聯(lián)網(wǎng)和萬維網(wǎng)基礎(chǔ) 1
1.1 互聯(lián)網(wǎng)和萬維網(wǎng) 2
互聯(lián)網(wǎng) 2
互聯(lián)網(wǎng)的誕生 2
互聯(lián)網(wǎng)的發(fā)展 2
萬維網(wǎng)的誕生 2
第一個(gè)圖形化瀏覽器 3
各種技術(shù)的聚合 3
1.2 網(wǎng)頁標(biāo)準(zhǔn)和無障礙訪問 4
W3C推薦標(biāo)準(zhǔn) 4
網(wǎng)頁標(biāo)準(zhǔn)和無障礙訪問 4
無障礙訪問和法律 4
網(wǎng)頁通用設(shè)計(jì) 5
1.3 瀏覽器和服務(wù)器 6
網(wǎng)絡(luò)概述 6
客戶端/服務(wù)器模型 6
1.4 Internet協(xié)議 8
電子郵件協(xié)議 8
超文本傳輸協(xié)議 8
文件傳輸協(xié)議 8
傳輸控制協(xié)議/Internet協(xié)議 8
IP地址 9
1.5 統(tǒng)一資源標(biāo)識(shí)符(URI)和域名 10
URI和URL 10
域名 10
頂級域名 11
通用頂級域名 11
國家代碼頂級域名 12
域名系統(tǒng)DNS 13
1.6 網(wǎng)上的信息 14
網(wǎng)上的信息可靠嗎? 14
網(wǎng)上的信息是最新的嗎? 15
有沒有指向其他資源的外部鏈接? 15
1.7 HTML概述 16
什么是HTML? 16
什么是XML? 17
什么是XHTML? 17
HTML的最新版本HTML5 17
1.8 網(wǎng)頁幕后揭秘 18
文檔類型定義(DTD) 18
網(wǎng)頁模板 18
html元素 18
頁頭區(qū)域 19
主體區(qū)域 19
1.9 第一個(gè)網(wǎng)頁 20
動(dòng)手實(shí)作1.1 20
新建文件夾 20
保存文件 21
測試網(wǎng)頁 22
復(fù)習(xí)和練習(xí) 23
復(fù)習(xí)題 23
動(dòng)手練習(xí) 23
網(wǎng)上調(diào)研 24
聚焦網(wǎng)頁設(shè)計(jì) 24
第2章 HTML基礎(chǔ) 25
2.1 標(biāo)題元素 26
動(dòng)手實(shí)作2.1 26
無障礙訪問和標(biāo)題 27
HTML5更多的標(biāo)題選項(xiàng) 27
2.2 段落元素 28
動(dòng)手實(shí)作2.2 28
對齊 29
2.3 換行和水平標(biāo)尺 30
換行元素 30
動(dòng)手實(shí)作2.3 30
水平標(biāo)尺元素 31
動(dòng)手實(shí)作2.4 31
2.4 塊引用元素 32
動(dòng)手實(shí)作2.5 33
2.5 短語元素 34
2.6 有序列表 36
type屬性,start屬性和
reversed屬性 36
動(dòng)手實(shí)作2.6 37
2.7 無序列表 38
動(dòng)手實(shí)作2.7 39
2.8 描述列表 40
動(dòng)手實(shí)作2.8 41
2.9 特殊字符 42
動(dòng)手實(shí)作2.9 42
2.10 HTML語法校驗(yàn) 44
動(dòng)手實(shí)作2.10 44
2.11 結(jié)構(gòu)元素 46
div元素 46
header元素 46
nav元素 46
main元素 46
footer元素 46
動(dòng)手實(shí)作2.11 47
2.12 練習(xí)使用結(jié)構(gòu)元素 48
動(dòng)手實(shí)作2.12 48
2.13 錨元素 50
動(dòng)手實(shí)作2.13 50
鏈接目標(biāo) 51
絕對鏈接 51
相對鏈接 51
block anchor 51
2.14 練習(xí)使用鏈接 52
站點(diǎn)地圖 52
動(dòng)手實(shí)作2.14 52
2.15 電子郵件鏈接 56
動(dòng)手實(shí)作2.15 57
復(fù)習(xí)和練習(xí) 58
復(fù)習(xí)題 58
動(dòng)手練習(xí) 59
聚焦網(wǎng)頁設(shè)計(jì) 59
案例分析 59
Pacific Trails Resort案例分析 60
JavaJam Coffee House案例分析 62
第3章 網(wǎng)頁設(shè)計(jì)基礎(chǔ) 67
3.1 為目標(biāo)受眾設(shè)計(jì) 68
瀏覽器 69
屏幕分辨率 69
3.2 網(wǎng) 站 組 織 70
分級式組織 70
線性組織 71
隨機(jī)組織 71
3.3 視覺設(shè)計(jì)原則 72
重復(fù):在整個(gè)設(shè)計(jì)中重復(fù)視覺元素 72
對比:添加視覺刺激和吸引注意力 73
近似:分組相關(guān)項(xiàng)目 73
對齊:對齊元素實(shí)現(xiàn)視覺上的統(tǒng)一 73
3.4 提供無障礙訪問 74
通用設(shè)計(jì)和增強(qiáng)無障礙訪問的
受益者 74
無障礙設(shè)計(jì)有助于提高在搜索
引擎中的排名 74
法律規(guī)定 75
無障礙設(shè)計(jì)的熱潮 75
3.5 文本的使用 76
文本設(shè)計(jì)的注意事項(xiàng) 76
3.6 調(diào)色板 78
十六進(jìn)制顏色值 78
網(wǎng)頁安全色 78
無障礙設(shè)計(jì)和顏色 79
3.7 針對目標(biāo)受眾進(jìn)行設(shè)計(jì) 80
面向兒童 80
面向年輕人 80
面向所有人 81
面向老年人 81
3.8 選擇顏色方案 83
以一張圖片為基礎(chǔ)的方案 83
色輪 84
變深、變淺和變灰 84
單色 85
相似色 85
互補(bǔ)色 86
分散互補(bǔ)色 86
三色 86
四色 87
實(shí)現(xiàn)顏色方案 87
3.9 使用圖片和多媒體 88
文件大小和圖片尺寸 88
抗鋸齒/鋸齒化文本的問題 88
只使用必要的多媒體 89
提供替代文本 89
3.10 更多設(shè)計(jì)考慮 90
感覺到的加載時(shí)間 91
第一屏 91
適當(dāng)留白 91
水平滾動(dòng) 91
3.11 導(dǎo)航設(shè)計(jì) 92
網(wǎng)站要易于導(dǎo)航 92
導(dǎo)航欄 92
圖片導(dǎo)航 93
動(dòng)態(tài)導(dǎo)航 93
站點(diǎn)地圖 93
站點(diǎn)搜索功能 94
3.12 線框和頁面布局 95
3.13 固定和流動(dòng)布局 98
固定布局 98
流動(dòng)布局 99
3.14 為移動(dòng)網(wǎng)絡(luò)設(shè)計(jì) 100
三種方式 100
移動(dòng)設(shè)備設(shè)計(jì)考慮 100
桌面和移動(dòng)網(wǎng)站的例子 101
移動(dòng)設(shè)計(jì)小結(jié) 101
3.15 靈活響應(yīng)的網(wǎng)頁設(shè)計(jì) 102
3.16 網(wǎng)頁設(shè)計(jì)最佳實(shí)踐 104
復(fù)習(xí)和練習(xí) 106
復(fù)習(xí)題 106
動(dòng)手練習(xí) 107
聚焦網(wǎng)頁設(shè)計(jì) 107
網(wǎng)頁項(xiàng)目案例分析 108
項(xiàng)目里程碑 108
第4章 CSS基礎(chǔ) 111
4.1 CSS概述 112
層疊樣式表的優(yōu)點(diǎn) 112
配置CSS的方法 113
層疊樣式表的“層疊” 113
4.2 CSS選擇符和聲明 114
CSS語法基礎(chǔ) 114
background-color屬性 114
color屬性 114
配置背景色和文本色 115
4.3 CSS顏色值語法 116
4.4 配置內(nèi)聯(lián)CSS 118
style屬性 118
動(dòng)手實(shí)作4.1 118
4.5 配置嵌入CSS 120
style元素 120
動(dòng)手實(shí)作4.2 121
4.6 配置外部CSS 123
link元素 123
動(dòng)手實(shí)作4.3 123
4.7 CSS的class、ID和后代選擇符 125
class選擇符 125
id選擇符 125
后代選擇符 125
動(dòng)手實(shí)作4.4 125
4.8 span元素 127
span元素 127
動(dòng)手實(shí)作4.5 127
4.9 練習(xí)使用CSS 129
動(dòng)手實(shí)作4.6 129
將嵌入CSS轉(zhuǎn)換為外部CSS 129
將網(wǎng)頁與外部CSS文件關(guān)聯(lián) 129
4.10 層疊 132
4.11 練習(xí)使用層疊 134
動(dòng)手實(shí)作4.7 134
4.12 CSS語法校驗(yàn) 136
動(dòng)手實(shí)作4.8 136
復(fù)習(xí)和練習(xí) 138
復(fù)習(xí)題 138
動(dòng)手練習(xí) 139
聚焦網(wǎng)頁設(shè)計(jì) 139
Pacific Trails Resort案例分析 140
JavaJam Coffee House案例分析 143
第5章 圖形和文本樣式基礎(chǔ) 147
5.1 圖片 148
GIF圖片 148
JPEG圖片 148
PNG圖片 149
新的WebP圖像格式 149
5.2 img元素 150
動(dòng)手實(shí)作5.1 150
5.3 圖片鏈接 152
動(dòng)手實(shí)作5.2 152