|
|
|
本書廣泛適用於各種教程與學習需求，讀者可自行靈活掌握使用方法。全書共14章，主要涉及以下重要主題：HTML和CSS編碼；網頁設計最好實踐；鏈接、布局、移動性；網頁開發；網頁多媒體與交互性；電子商務概覽；網頁提升；JavaScript和jQuery簡介。 本書適合所有對網頁設計感興趣的讀者閱讀，是一本理想的入門參考。
Terry Felke-Morris她一名計算機信息系統教授，來自伊利諾斯州帕拉廷市的威廉雷尼哈珀學院。她擁有教育博士學位、信息系統理科碩士學位，以及包括Adobe Certified Dreamweaver 8 Developer, WOW Certified Associate Webmaster、 MicrosoftCertified Professional、Master CIW Designer，和 CIW Certified Instructor在內的眾多認證證書。
Felke-Morris博士獲得過威廉雷尼哈珀學院頒發的教學技術Glenn A. Reich紀念獎，以表彰她在學院的網頁開發程序與課程中的設計工作。2006年，她因為在教學中出色地運用互聯網技術而榮獲Blackboard Greenhouse 的在線教學示范將。Felke-Morris博士在2008年收獲了兩個國際獎項：教學技術委員會的電子教學傑出能力獎以及MERLOT的在線教學資源示范獎。
因其在商務與工業領域超過25年的信息技術經驗，Felke-Morris博士於1996年開通了她的第一個個人網站，並且維護至今。她長期致力於萬維網標准的提升，已經成為萬維網標准項目教育任務項目組的成員。Felke-Morris博士是威廉雷尼哈珀學院網頁開發認證與學位認定項目組的資深成員。
潘玉琪，同濟修智能交通，學成后入行IT，與數據深交多年，業余時間不是窩在書房里看看寫寫畫畫，就是鑽到廚房里折騰鍋碗瓢盆，被譽為「交通圈里最會做菜的IT攻城獅」，實為一枚如假包換的程序媛。平生最大的願望是一路逛吃逛吃走飯遍天下，然后回家山寨克隆另立門派。熱愛美食與電影，業余在「小築飯」 碼字寫隨筆。代表譯著有《極客趣談I：創意料理語營養美食》與《SQL Server 2012從入門到精通》。
第1章 互聯網與萬維網介紹 1
1.1 互聯網與萬維網 2
互聯網 2
互聯網的誕生 2
互聯網的發展 2
萬維網的誕生 2
第一個圖形化瀏覽器 3
技術融合 3
誰在運行互聯網？ 3
內聯網和外部網 4
1.2 萬維網標准與無障礙訪問 5
W3C推薦標准 5
萬維網標准與無障礙訪問 5
無障礙訪問與法律 5
萬維網通用設計 6
1.3 萬維網上的信息 7
網絡信息與可靠性 7
有道德地使用網上的信息 8
自測題1.1 9
1.4 網絡概述 9
1.5 客戶端/服務器模型 10
1.6 互聯網協議 11
文件傳輸協議(FTP) 12
電子郵件協議 12
超文本傳輸協議(HTTP) 12
傳輸控制協議/互聯網協議
(TCP/IP) 12
1.7 統一資源定位符和域名 14
URI和URL 14
域名 14
1.8 標記語言 16
標准通用標記語言(SGML) 17
超文本標記語言(HTML) 17
可擴展標記語言(XML) 17
可擴展超文本標記語言
(XHMTL) 17
HTML5-HTML語言的最新版本 17
自測題1.2 18
1.9 萬維網上的流行應用 18
電子商務 18
移動接入 18
博客 18
維基 19
社交網絡 19
雲計算 20
RSS 20
播客 20
Web 2.0 20
本章小結 22
關鍵術語 22
復習題 23
動手練習 24
網站實例研究 24
關注網頁設計 25
第2章 HTML基礎 27
2.1 HTML概覽 28
HTML 28
XML 28
XHTML 29
HTML5 29
2.2 文檔類型定義 30
2.3 網頁模板 30
2.4 HTML元素 30
2.5 四大元素head、title、meta
和body 31
頭部(Head) 31
主體(Body) 31
2.6 你的第一張網頁 32
動手實踐2.1 32
自測題2.1 35
2.7 標題元素 36
動手實踐2.2 36
無障礙訪問與標題 37
2.8 段落元素 38
動手實踐2.3 38
對齊 39
2.9 換行元素 39
動手實踐2.4 40
2.10 塊引用元素 40
動手實踐2.5 41
2.11 短語元素 42
2.12 有序列表 43
類型(Type)、起始值(Start)和
倒序*(Reversed)屬性 44
動手實踐2.6 44
2.13 無序列表 45
動手實踐2.7 46
2.14 描述列表 47
動手實踐2.8 47
自測題2.2 48
2.15 特殊字符 49
動手實踐2.9 49
2.16 結構元素 51
分區元素(Div) 51
HTML結構性元素 51
頁眉元素(Header) 51
導航鏈接元素(Nav) 51
主體元素(Main) 51
頁腳元素(Footer) 52
動手實踐2.10 52
2.17 錨元素 53
動手實踐2.11 54
絕對超鏈接 54
相對超鏈接 55
網站地圖 55
動手實踐2.12 55
電子郵件超鏈接(E-Mail) 58
動手實踐2.13 59
無障礙訪問與超鏈接 60
塊級錨 60
自測題2.3 61
2.18 HTML驗證 61
動手實踐2.14 61
本章小結 64
關鍵術語 64
復習題 65
學以致用 66
動手練習 67
萬維網探秘 68
網站實例研究 68
第3章 用層疊樣式表CSS配置顏色
與文本 81
3.1 層疊樣式表概覽 82
層疊樣式表的優點 82
配置層疊樣式表 83
樣式選擇器與聲明 83
背景顏色屬性 83
顏色屬性 84
配置背景顏色與文本顏色 84
3.2 為網頁配色 86
十六進制的顏色碼 86
網頁安全色 87
配色的CSS語法 87
3.3 帶樣式屬性的內聯CSS 88
樣式屬性(Style) 88
動手實踐3.1 88
3.4 帶樣式元素的內嵌CSS 90
樣式(Style)元素 90
動手實踐3.2 91
自測題3.1 93
3.5 用CSS配置文本 93
字體系列屬性(font-family) 93
更多的CSS字體屬性 95
CSS3文本陰影屬性 97
動手實踐3.3 97
3.6 CSS類、id與派生選擇器 100
類選擇器 100
id選擇器 101
動手實踐3.4 101
派生選擇器 102
3.7 Span元素 103
動手實踐3.5 103
3.8 使用外部樣式表 104
鏈接元素 104
動手實踐3.6 105
動手實踐3.7 106
自測題3.2 108
3.9 用CSS實現HTML元素居中 109
動手實踐3.8 110
3.10 層疊 111
動手實踐3.9 112
3.12 CSS驗證 113
動手實踐3.10 114
本章小結 116
關鍵術語 116
復習題 116
動手練習 119
萬維網探秘 121
關注網頁設計 121
網站實例研究 122
第4章 視覺元素與圖像 131
4.1 配置線條與邊框 132
水平分隔線元素 132
動手實踐4.1 132
邊框屬性與間距屬性 132
動手實踐4.2 136
自測題4.1 138
4.2 圖像類型 138
圖像互換格式(GIF)圖片 138
聯合照片專家小組(JPEG)圖像 139
可移植網絡圖形格式(PNG)
圖像 141
新型的WebP圖像格式 141
4.3 圖像元素 141
無障礙訪問和圖像 143
圖像超鏈接 143
動手實踐4.3 143
優化Web圖像 145
動手實踐4.4 146
4.4 HTML5視覺元素 147
HTML5 Figure元素 147
HTML5 Figcaption元素 148
動手實踐4.5 148
HTML5 Meter元素 149
HTML5 Progress元素 150
4.5 背景圖像 151
background-image屬性 151
同時配置背景色和背景圖 151
瀏覽器顯示背景圖 151
background-repeat屬性 151
background-position屬性 153
動手實踐4.6 153
background-attachment屬性 154
自測題4.2 155
4.6 更多有關圖像的知識 155
圖像映射 155
映射元素 155
區域元素 155
探索矩形圖像映射 156
收藏圖標 157
配置收藏圖標 157
動手實踐4.7 158
圖像切割 158
CSS精靈 159
4.7 圖片來源與使用原則 159
圖片來源 159
圖像使用指導原則 160
無障礙訪問和視覺元素 161
自測題4.3 161
4.8 CSS3視覺效果 162
CSS3 background-clip屬性 162
CSS3 background-origin屬性 163
CSS3 background-size屬性 163
CSS3中對多張背景圖像的處理 165
動手實踐4.8 166
CSS3圓角效果 166
動手實踐4.9 167
CSS3 box-shadow屬性 168
動手實踐4.10 169
CSS3的opacity屬性 170
動手實踐4.11 171
CS3 RGBA 顏色 172
動手實踐4.12 174
CSS3 HSLA顏色 174
動手實踐4.13 176
CSS3漸變 177
本章小結 180
關鍵術語 180
復習題 181
學以致用 182
動手練習 183
萬維網探秘 184
關注網頁設計 184
網站實例研究 185
第5章 網頁設計 197
5.1 為目標受眾群體而設計 198
5.2 網站的組織結構 199
分層結構 199
線性結構 200
隨機結構 201
5.3 視覺效果設計原則 201
重復：在整個設計中重復使用
視覺組件 201
對比：提升視覺刺激效果，吸引
注意力 202
鄰近：組合相關的項目 202
對齊：將元素對齊形成視覺上的
統一效果 203
5.4 無障礙訪問設計 203
誰將從通用設計與無障礙訪問
設計中獲益？ 203
無障礙訪問設計有利於被搜索引擎
檢索到 204
做正確的事：提供無障礙訪問 204
5.5 適合於Web的寫作風格 205
精心組織內容 205
字體選擇 205
字體大小 206
字體粗細 206
文字顏色對比 206
文本行的長度 206
對齊 206
超鏈接中的文本 206
閱讀級別 207
拼寫和語法 207
5.6 顏色的使用 207
基於圖像的配色方案 207
色輪 208
基於色輪的配色方案 209
對配色方案進行補充 210
無障礙訪問與顏色 211
顏色與目標受眾 211
自測題5.1 214
5.7 圖片與多媒體的應用 214
圖像的文件大小和尺寸 214
多媒體中的抗鋸齒或鋸齒文字 215
僅使用必要的多媒體 215
提供替代文本 215
5.8 更多設計方面的注意事項 216
加載時間 216
首屏 217
充分留白 217
避免水平滾動 217
瀏覽器 217
屏幕分辨率 218
5.9 導航設計 218
易於導航 218
導航欄 218
面包屑導航 218
利用圖形實現導航 219
跳過重復導航鏈接 219
動態導航 220
站點地圖 220
站內檢索功能 221
5.10 頁面布局設計 221
線框和頁面布局 221
頁面布局設計技術 223
5.11 設計適應於移動設備的Web 225
三種方法 226
設計移動設備端網站時需要考慮
的因素 226
桌面網站與移動網站示例 226
響應式網頁設計 228
5.12 網頁設計最佳實踐核對清單 230
自測題5.2 232
本章小結 233
關鍵術語 233
復習題 234
萬維網探秘 236
關注網頁設計 237
網站實例研究 238
Web項目 239
第6章 頁面布局 241
6.1 盒模型 242
內容 242
內邊距 242
邊框 242
外邊距 242
Margin屬性 243
盒模型的作用 243
6.2 正常流 244
動手實踐6.1 245
6.3 CSS浮動 247
動手實踐6.2 248
浮動元素和正常流 248
6.4 CSS：清除浮動 249
clear屬性 249
overflow屬性 250
自測題6.1 252
6.5 CSS雙欄頁面布局 252
左欄為導航的雙欄布局 252
雙欄頁面，頂部是頁眉，左側
為導航 254
百尺竿頭還需更進一步 255
6.6 無序列表中的超鏈接 255
用CSS配置列表標記 256
用無序列表組織垂直導航區域 257
用無序列表組織水平導航區域 258
6.7 用CSS偽類增加交互效果 259
動手實踐6.3 260
6.8 CSS雙欄布局實戰 262
動手實踐6.4 262
6.9 頁眉文本圖像替換 265
改進的頁眉文本圖像替換技術 266
動手實踐6.5 266
6.10 實戰圖片庫 267
動手實踐6.6 267
6.11 利用CSS進行定位 269
靜態定位 270
固定定位 270
相對定位 270
絕對定位 271
動手實踐6.7 272
6.12 CSS調試技術 274
驗證HTML語法是否正確 274
驗證CSS語法是否正確 274
設置臨時背景顏色 274
設置臨時邊框 274
使用注釋查找意想不到的重疊 274
6.13 更多HTML5結構元素 275
section元素 275
article元素 276
aside元素 276
time元素 276
動手實踐6.8 276
6.14 舊瀏覽器的HTML5兼容性 278
配置CSS塊顯示 279
HTML5 Shim 279
動手實踐6.9 279
自測題6.2 280
本章小結 281
關鍵術語 281
復習題 281
學以致用 282
動手練習 285
萬維網探秘 286
網站實例研究 286
Web項目 298
第7章 深入了解超鏈接、列表
和移動端網頁設計 299
7.1 換個角度看看超鏈接 300
有關相對超鏈接的更多知識 300
相對鏈接示例 300
動手實踐7.1 301
區段標識符 302
動手實踐7.2 303
ARIA的標志角色 305
target屬性 305
動手實踐7.3 306
塊級錨點 306
電話與短信超鏈接 306
7.2 CSS精靈 306
動手實踐7.4 307
自測題4.1 309
7.3 三欄式CSS頁面布局 309
動手實踐7.5 310
7.4 CSS打印樣式 316
打印樣式最佳實踐 316
動手實踐7.6 319
7.5 設計顯示於移動設備上的網頁 321
移動網頁設計最佳實踐 322
7.6 視窗的meta標簽 324
7.7 CSS3多媒體查詢 325
什麼是多媒體查詢？ 326
使用link元素的多媒體查詢
示例 326
使用@media規則的多媒體查詢
示例 327
動手實踐7.7 329
7.8 彈性圖像 332
動手實踐7.8 333
7.9 測試在移動設備上的顯示效果 335
用桌面電腦的瀏覽器進行測試 336
僅限於特別專業的開發者 337
多媒體查詢與Internet Explorer
瀏覽器 337
移動設備優先 337
7.10 CSS3彈性盒布局 338
配置一個彈性容器 338
配置彈性項目 339
動手實踐7.9 340
自測題7.2 343
本章小結 344
關鍵術語 344
復習題 344
學以致用 345
動手練習 348
萬維網探秘 349
關注網頁設計 349
網站實例研究 350
Web項目 363
第8章 表格 365
8.1 表格概覽 366
表格元素 366
border屬性 367
表格標題 367
8.2 表格行、單元格與表頭 368
表格行元素 368
表格數據元素 368
表格表頭元素 369
動手實踐8.1 370
8.3 跨行和跨列 370
colspan屬性 370
rowspan屬性 371
動手實踐8.2 371
8.4 配置一張可無障礙訪問的表格 372
自測題8.1 374
8.5 用CSS設置表格樣式 374
動手實踐8.3 375
8.6 CSS3結構化偽類 377
動手實踐8.4 378
8.7 配置表格中的各個部分 379
自測題8.2 380
本章小結 381
關鍵術語 381
復習題 381
學以致用 382
動手練習 384
萬維網探秘 385
關注網頁設計 385
網站實例研究 385
Web項目 390
第9章 表單 391
9.1 表單概述 392
表單元素 393
表單控件 394
9.2 輸入元素表單控件 394
文本框 394
提交按鈕 396
重置按鈕 396
動手實踐9.1 397
多選框 398
單選按鈕 399
隱藏輸入控件 400
密碼框 401
9.3 滾動文本框 401
動手實踐9.2 402
9.4 選擇列表 404
選擇元素 404
選項元素 405
自測題9.1 406
9.5 圖像按鈕和按鈕元素 406
圖像按鈕 407
按鈕元素 407
9.6 無障礙訪問與表單 408
標簽元素 408
動手實踐9.3 409
Fieldset和Legend元素 409
動手實踐9.4 410
tabindex屬性 411
accesskey屬性 412
自測題9.2 412
9.7 用CSS定義表單樣式 413
9.8 服務器端的處理 414
動手實踐9.5 415
隱私和表單 417
服務器端處理的資源 417
探索服務器端處理技術 418
自測題9.3 418
9.9 HTML5表單控件 418
電子郵件地址輸入 419
URL輸入控件 419
電話號碼輸入控件 420
搜索字段輸入控件 420
數據列表表單控件 421
滑塊表單控件 422
微調器表單控件 423
日歷表單控件 424
拾色器表單控件 425
動手實踐9.6 425
HTML5與漸進式提升 427
本章小結 428
關鍵術語 428
復習題 428
學以致用 430
動手練習 431
萬維網探秘 433
關注網頁設計 434
網站實例研究 434
Web項目 444
第10章 網站開發 445
10.1 大型項目的成功開發 446
項目工作角色 446
確定項目人選的標准 447
10.2 開發流程 448
概念形成 450
分析 450
設計 451
開發 452
測試 453
自動測試工具和校驗器 454
啟用 456
維護 456
評估 456
自測題10.1 457
10.3 域名概述 457
挑選域名 457
注冊域名 458
10.4 主機寄存 458
主機供應商 459
寄存的類型 459
10.5 選擇虛擬主機 460
自測題10.2 462
本章小結 463
關鍵術語 463
復習題 463
動手練習 465
萬維網探秘 466
關注網頁設計 467
網站實例研究 467
Web項目 467
第11章 多媒體與交互性 469
11.1 插件、容器和編解碼器 470
11.2 開啟音頻與視頻之旅 472
提供超鏈接 472
動手實踐11.1 472
與網上的多媒體打交道 473
多媒體與無障礙訪問 475
瀏覽器兼容性問題 475
11.3 Adobe Flash 475
HTML5內嵌元素 476
動手實踐11.2 477
Flash資源 477
自測題11.1 478
11.4 HTML5音頻和視頻元素 478
音頻元素 479
源元素 479
網頁上的HTML5音頻 479
動手實踐11.3 480
視頻元素 481
源元素 482
網頁上的HTML5視頻 482
動手實踐11.4 483
11.5 多媒體文件與版權法律 484
11.6 CSS3和交互性 485
CSS圖片庫 485
動手實踐11.5 485
CSS3Transform屬性 487
CSS3 Rotate變換 488
動手實踐11.6 488
CSS Transition屬性 490
動手實踐11.7 490
練習應用過渡效果 492
動手實踐11.8 492
11.7 Java 494
在網頁上添加Java小程序 495
Java小程序資源 497
自測題11.1 497
11.8 JavaScript 497
JavaScript資源 499
11.9 Ajax 499
Ajax資源 501
11.10 jQuery 501
jQuery資源 502
11.11 HTML5 API 502
地理位置 502
網絡存儲 502
離線應用 503
用Canvas元素繪圖 503
HTML5 API資源 505
自測題11.3 505
11.12 無障礙與多媒體/交互性 505
本章小結 507
關鍵術語 507
復習題 508
學以致用 509
動手練習 510
萬維網探秘 511
關注網頁設計 511
網站實例研究 512
Web項目 517
第12章 電子商務概述 519
12.1 什麼是電子商務？ 520
電子商務的優勢 520
電子商務的風險 520
12.2 電子商務商業模式 521
12.3 電子數據交換(EDI) 522
12.4 電子商務統計數據 522
12.5 電子商務相關問題 524
12.6 電子商務安全 525
加密 525
完整性 526
安全套接字層(SSL) 526
數字證書 527
SSL和數字證書 528
自測題12.1 528
12.7 訂單和支付處理 529
現金模型 529
信用卡模型 529
智能卡模型 529
移動支付模型 530
12.8 開設電子商務店鋪的解決
方案 530
速成網店 530
現成的購物車軟件 531
定制解決方案 531
根據預算決定的半定制解決
方案 531
自測題12.2 532
本章小結 533
關鍵術語 533
復習題 533
動手練習 535
萬維網探秘 535
關注網頁設計 536
網站實例研究 536
Web項目 547
第13章 網站推廣 549
13.1 搜索引擎概述 550
13.2 流行的搜索引擎 550
13.3 搜索引擎組件 550
機器人 551
數據庫 551
搜索表單 551
13.4 搜索引擎優化 552
關鍵字 552
網頁標題 552
標題標簽 552
描述 552
Description 元標簽 553
鏈接 553
圖像和多媒體 553
有效的代碼 554
有價值的內容 554
13.5 被搜索引擎收錄 554
合適的站點地圖 555
加盟 556
自測題13.1 556
13.6 監控搜索列表 556
13.7 鏈接流行度 558
13.8 社交媒體優化 558
博客和RSS源 559
社交網絡 559
13.9 其他的網站推廣活動 560
快速反應(QR)碼 560
分銷聯盟計划 560
橫幅廣告 561
橫幅廣告互換 561
互惠鏈接協議 562
時事通訊 562
有「粘性」的網站功能 562
個人推薦 562
新聞組和郵件列表服務 562
傳統媒體廣告與現有的營銷
材料 563
13.2自測題 563
13.10 通過內聯框架提供動態內容 563
iframe元素 563
內聯框架中的YouTube視頻 565
動手實踐13.1 565
本章小結 567
關鍵術語 567
復習題 568
動手練習 569
萬維網探秘 569
關注網頁設計 569
網站實例研究 570
Web項目 572
第14章 JavaScript 573
14.1 JavaScript概述 574
14.2 JavaScript的發展歷程 574
14.3 JavaScript的常見用途 575
警告消息 575
彈窗 575
跳轉菜單 576
鼠標移動技術 576
14.4 在網頁中添加JavaScript 577
Script元素 577
傳統JavaScript語句塊模板 578
警告消息框 578
動手實踐14.1 578
調試練習 579
自測題14.1 580
14.5 文檔對象模型概述 580
動手實踐14.2 581
14.6 事件與事件處理程序 583
動手實踐14.3 584
自測題14.2 585
14.7 變量 585
在網頁中使用變量 586
14.4動手實踐 586
使用輸入提示框獲取變量值 588
14.5動手實踐 588
14.8 編程概念介紹 589
算術運算符 589
判斷結構 590
動手實踐14.6 591
函數 593
動手實踐14.7 594
自測題14.3 595
14.9 表單處理 595
動手實踐14.8 596
自測題14.4 601
14.10 無障礙訪問與JavaScript 601
14.11 JavaScript資源 601
14.12 jQuery概述 602
14.13 在網頁中添加jQuery 602
下載jQuery 602
通過內容分發網絡訪問jQuery 603
Ready事件 603
動手實踐14.9 604
14.14 jQuery選擇器 605
14.15 jQuery方法 605
動手實踐14.10 606
14.16 jQuery圖片庫 608
動手實踐14.11 609
14.17 jQuery插件 611
動手實踐14.12 612
動手實踐14.13 613
14.18 jQuery資源 615
自測題14.5 616
本章小結 617
關鍵術語 617
復習題 618
學以致用 619
動手練習 620
萬維網探秘 621
網站實例研究 621
Web項目 630
附錄 網頁開發人員手冊 631
參考答案 653
