主要內容
《Web標準設計》針對Web開發人員講解Web標準。開始部分解釋了Web標準的一些概念跟誤會，之後詳細介紹了構成Web標準的各個組成部分，著重介紹了XHTML和CSS的套用，同時還討論了JavaScript、XML、XSLT的套用，此外還介紹了中文的特殊表現、命名的套用以及Web標準中最常給人忽視的無障礙網頁倡議(WAI)。
基於上述的討論，《Web標準設計》以實例的形式介紹了這些內容的組合套用，以及一些常見和不常見的技術。
雖然《Web標準設計》講述的內容是Web標準，但由於頁數有限，《Web標準設計》無法讓你精通Web標準所有的知識點，我選擇的重點是XHTML+CSS，其他的方面只能說讓你達到了解、掌握基礎的地步。
編輯推薦
一扇經常開啟的門的鉸鏈不需要潤滑油。
一條湍急的河流不會變得污濁。
無論是聲音還是想法都不可能在真空中傳播。
Web標準如果不用就會腐朽。
這世界真奇妙！
百度前端設計師 藍色理想榮譽團隊成員
無憂腳本超級版主劉傑（嗷嗷）耗時兩年大作
目錄
第一章 Web標準不是神話
1.1 理解Web標準
1.1.1 Web標準是什麼
1.1.2 錯誤的思維
1.1.3 無障礙網頁倡議（WAI）
1.2 量化Web標準
1.2.1 大部分通過W3C校驗的網站只是偽標準
1.2.2 Web標準要求一覽表
1.2.3 是追求標準還是理解標準
1.3 為什麼選擇Web標準
1.4 CSS為什麼著火
1.4.1 CSS的作用
1.4.2 CSS 布局 VS. 表格布局
1.5 我能否學好Web標準
1.5.1 我需要具備什麼素質和條件才能學好Web標準
1.5.2 學習的重點與難點
1.6 欲善其事, 先利其器
1.6.1 軟體的選擇
1.6.2 調試環境
第二章 XHTML——瀏覽器上的新大陸
2.1 一切從語義開始
2.2 網頁的構成
2.3 常見標籤
2.3.1 標題
2.3.2 內容
2.3.3 列表
2.3.4 表格
2.3.5 表單
2.3.6 注釋
2.4 比HTML多出一個X
2.4.1 還多了什麼
2.4.2 誰影響了網頁的樣子
2.4.2.1 瀏覽器的多模式
2.4.2.2 開啟通往標準的模式
2.4.3 堅持Strict Markup
2.4.4 語義化
2.5 按語義來分類
2.6 塊元素與內聯元素
2.7 div不是神
2.7.1 合理套用
2.7.1.1 嵌套
2.7.1.2 div不是table
2.7.2 div與span的差別
第三章 CSS——網頁美容師
3.1 語法結構
3.1.1 基本結構
3.1.2 樣式表中的注釋
3.1.3 字元轉義
3.2 選擇符的使用
3.2.1 通配選擇符
3.2.2 類型選擇符
3.2.3 包含選擇符
3.2.4 子對象選擇符
3.2.5 相鄰選擇符
3.2.6 屬性選擇符
3.2.6.1 匹配屬性和屬性值
3.2.6.2 類選擇符
3.2.7 ID選擇符
3.2.8 選擇符分組
3.3 偽元素與偽類
3.3.1 偽類
3.3.1.1 :first-child偽類
3.3.1.2 連結偽類——:link 和 :visited
3.3.1.3 動態偽類——:hover. :active與:focus
3.3.1.4 語言偽類——:lang
3.3.2 偽對象
3.3.2.1 :first-letter
3.3.2.2 :first-line
3.3.2.3 :before和 :after
3.4 常用單位
3.4.1 長度單位
3.4.1.1 px vs. em
3.4.1.2 百分比單位
3.4.1.3 其他長度單位
3.4.2 顏色單位
3.5 套用 CSS 在網頁上
3.5.1 鏈入外部樣式表
3.5.2 定義內部樣式
3.5.3 定義內聯定義
3.5.4 導入指定的外部樣式表
3.5.5 各種方式的差異
3.5.6 糟糕的手持設備
3.6 繼承與覆蓋
3.7 優先權的計算
第四章 用XHTML和CSS來“擺”網頁
4.1 開始你的第一個頁面
4.2 文字的表現
4.2.1 字型的外型
4.2.2 顏色的定義
4.2.3 背景的定義
4.3 最簡單的布局
4.3.1 Margin 與 Padding
4.3.2 單列固定寬度居中
4.3.3 單列自適應寬度
4.3.4 奇怪的高度
4.3.5 框線的定義
4.4 鬱悶的盒模型
4.5 文字旁邊的圖片
4.5.1 baseline
4.5.2 垂直對齊
4.5.3 圖片的浮動
4.6 列表的套用
4.6.1 定義列表的外觀
4.6.2 導航選單的套用
4.6.3 列表的常見套用
4.7 表格
4.7.1 表格的控制
4.7.2 為不同瀏覽器使用不同的選擇符
4.7.3 偽表格——看起來像, 其實卻不是表格
4.8 表單
4.8.1 樣式表單
4.8.2 表單元素的細節
4.8.3 註冊表單
第五章 布局之道
5.1 固定的左右分欄
5.1.1 經典的三行兩列固定寬度的布局
5.1.2 兩列等高——背景偽造篇（一）
5.1.3 自由與未來
5.2 自適應的左右分欄
5.2.1 經典的三行兩列自適應寬度的布局
5.2.2 兩列等高——背景偽造篇（二）
5.2.3 百分比的細節
5.2.4 clear:right與overflow
5.3 一欄固定寬度, 一欄自適應寬度
5.3.1 單欄浮動
5.3.2 浮動的負值可以讓主要的內容優先顯示
5.3.3 Min & Max
5.4 多欄布局
5.4.1 三欄固定寬度和自適應的布局
5.4.2 混合固定寬度和自適應寬度的多欄布局
5.4.3 流出固定寬度的兩欄在自適應寬度的中欄後面
5.4.4 偏移出來固定寬度的兩欄在自適應寬度的中欄後面
5.5 組合之路
第六章 不要害怕各式各樣的瀏覽器
6.1 瀏覽器的市場
6.1.1 古老的IE5.x
6.1.1.1 IE5.x/win
6.1.1.2 IE5.x/mac
6.1.2 討厭的IE6
6.1.3 里程碑——IE7
6.1.4 新一代的IE4
6.1.5 開發利刃——Firefox
6.1.6 華麗的Oprea
6.1.7 異軍——Safari
6.2 兼容之道
6.2.1 條件注釋
6.2.2 過濾瀏覽器
6.2.3 破壞屬性
6.2.4 Hack之道
6.3 兼容問題
6.3.1 一切從浮動開始
6.3.2 Layout初體驗
6.3.3 閉合浮動元素
6.3.4 IE受不了浮動
6.3.4.1 浮動元素雙倍margin
6.3.4.2 消失的margin-bottom
6.3.4.3 砍掉的內容
6.3.4.4 消失的內容
6.3.4.5 多了一隻“豬”
6.3.5 IE的其他問題
6.3.5.1 背景消失
6.3.5.2 背景原點
6.3.5.3 沒有內容的內容
6.3.5.4 消失的滾動條
6.3.5.5 更多的消失
6.3.6 Layout全接觸
6.3.6.1 默認Layout元素
6.3.6.2 屬性觸發Layout
6.3.6.3 關於內聯元素
6.3.6.4 重置hasLayout
6.3.6.5 引起問題
6.3.7 塊級格式化範圍（block formatting context）
6.3.8 其他瀏覽器的問題
第七章 CSS常用技巧
7.1 滑動門技術
7.1.1 滑動門的原理
7.1.2 當只有文字被放大時
7.1.3 一張圖片當N個門使用
7.1.4 一些可能會被忽略的問題
7.1.5 其他的一些套用
7.2 圓角
7.3 圖片的細節
7.3.1 載入中的圖片
7.3.2 載入不了的圖片
7.3.3 縮放的圖片
7.3.4 偽類縮放的圖片
7.4 被放大的文字
7.5 當前標識
7.5.1 視覺標識
7.5.2 麵包屑（Breadcrumbs）
7.5.3 操作步驟
7.6 居中元素
7.6.1 垂直居中多行文字
7.6.2 未知大小圖片在已知大小容器中垂直和水平居中
7.6.3 相對頁面垂直和水平居中已知大小的容器
7.7 隱藏的Tips會出現
7.7.1 實現原理
7.7.2 圖片信息
第八章 文字的藝術
8.1 中文的特殊性
8.2 縮放機制
8.2.1 縮放的文字
8.2.2 縮放的盒子
8.3 行高與基線
8.3.1 行高的細節
8.3.2 基線
8.3.3 文本空間
8.4 input里的文字
8.5 連結的範圍
8.5.1 額外的點擊空間
8.5.2 缺少的點擊空間
8.6 不間斷的文字
8.7 省略掉的文字
8.8 字型的介紹
8.8.1 中文字型
8.8.2 英文字型
8.9 語言會影響到字型
第九章 細品命名與微格式
9.1 命名規則
9.2 命名原則
9.3 不再陌生的 Microformats
9.3.1 認識微格式
9.3.2 從微格式中提煉知識
9.4 ID與CLASS選擇誰
9.5 自定義標籤
9.6 命名的重要性
第十章 換個思維來設計
10.1 消失了文字, 看到了彩虹
10.1.1 文字變成圖片的幾種方法
10.1.2 文字也可以用Flash來表現
10.2 用div代替html/ body
10.3 縮放的布局
10.3.1 實現原理
10.3.2 縮放一半
10.3.3 精準em
10.4 網頁是可以用疊的
10.4.1 在一螢幕里顯示所有內容
10.4.2 圖片的位置
10.4.3 position:absolute的層疊
10.5 百分比加減固定數值
10.5.1 50%+200px
10.5.2 50%-200px
10.6 兩列等高——margin負值篇
10.7 類display:inline-block的套用
第十一章 隱藏在瀏覽器背後的CSS
11.1 (X)HTML與CSS校驗的意義
11.2 IE背後的善良
11.2.1 IE常見私有屬性
11.2.2 濾鏡
11.3 火狐狸的尾巴帶著CSS3的味道
11.3.1 At-rules 規則
11.3.2 Properties 屬性
11.3.3 Values 屬性值
11.4 其他瀏覽器的兼容方案
第十二章 JavaScript讓Web動起來
12.1 概念
12.1.1 什麼是JavaScript
12.1.2 ECMAScript是什麼
12.1.3 什麼是DOM
12.1.4 什麼是BOM
12.1.5 想法
12.1.6 怎樣讓JavaScript運行
12.2 編程基礎
12.2.1 語法
12.2.2 變數
12.2.3 基本數據類型
12.2.3.1 數值
12.2.3.2 字元串
12.2.3.3 布爾型
12.2.4 表達式與運算符
12.2.4.1 算術運算符
12.2.4.2 關係運算符
12.2.4.3 邏輯運算符
12.2.4.4 賦值運算符
12.2.5 基本語句
12.2.5.1 條件語句
12.2.5.2 循環語句
12.2.6 函式
12.2.7 對象
12.3 DOM無處不在
12.3.1 把文檔表示為樹
12.3.2 樹的節點
12.3.3 節點的屬性
12.3.4 HTML DOM 特徵
12.4 事件處理
12.4.1 什麼是事件
12.4.2 Event對象
12.4.3 事件的綁定
12.4.4 分離
12.5 只要改變className就可以改變很多——下拉選單的練習
12.5.1 結構的選擇
12.5.2 分離實現效果
12.5.3 想法
12.6 表單的輔助
12.6.1 檢查數據
12.6.2 隱式提示
12.6.3 創建內容——innerHTML VS createElement
12.6.4 setTimeout的用處
12.6.5 Ajax初體驗
12.6.6 HTML5的表單元素
12.7 class特效
第十三章 親 和 力
13.1 概念
13.2 Web內容可訪問性指南
13.2.1 並非所有的內容都是顯示的
13.2.2 保持原有功能的有效性
13.2.3 讓文字看得見
13.2.4 熱鍵操作
13.2.5 導航
13.2.6 標題與內容
13.2.7 語言與編碼
13.2.8 親和力聲明
13.2.9 建議
13.3 技術層上的一些親和力
13.3.1 如何讓連結變得更有表達能力
13.3.2 擴展連結的提示
13.3.3 節省步驟
13.3.4 圖片還是背景圖片
第十四章 XML的無限變化
14.1 XML的作用
14.1.1 XML能做什麼
14.1.2 XML的表現
14.1.3 XML+CSS的表現
14.1.4 元素的語義
14.1.5 XSLT初體驗
14.2 XPath與XSLT
14.2.1 XPath簡介
14.2.2 XSLT套用XPath
14.2.3 程式性轉換的XSLT
14.2.4 XSLT常見元素
14.2.5 XSLT函式 document
14.2.6 XPath定位
14.2.6.1 定位路徑表達式
14.2.6.2 軸
14.2.6.3 節點測試
14.2.7 XPath基本表達式
14.2.8 XPath常見函式
14.2.9 X練習
14.3 華麗的RSS
14.3.1 複習
14.3.2 轉換時間格式的模板與參數的套用
14.3.3 過濾與排序
14.3.4 背景色交替
14.3.5 顯示(X)HTML內容
14.3.6 還能做什麼？
14.4 XML的周邊與命運
14.4.1 XML Schema
14.4.2 WML
14.4.3 SVG
14.4.4 XML的未來
第十五章 簡單的實戰
15.1 創建開源社區系統OpenLab的首頁
15.1.1 分析結構
15.1.2 疊出來的頭部
15.1.3 一張背景的導航
15.1.4 表格無敵
15.1.5 隱藏內容
15.1.6 顯示的變化
15.2 Ao.A相冊
15.2.1 分析結構
15.2.2 大背景
15.2.3 基本結構
15.2.4 圖片展示
15.2.5 浮動的空白
15.2.6 小小的Tip提示
15.2.7 IE的兼容問題
15.2.8 放棄也是一種美！
15.2.9 精準到px
15.2.10 讓網頁動起來——JavaScript
15.2.10.1 那JavaScript要套用在哪些地方呢？
15.2.10.2 那使用JavaScript要注意什麼呢？
15.2.11 讓網頁動起來——Flash
15.2.12 網頁並非會按我們所想的顯示
15.2.13 網頁並不一定要用瀏覽器看的
15.2.14 列印網頁
15.3 架構前端
15.3.1 腳本框架
15.3.2 模組化樣式表
15.3.3 模組化(X)HTML
15.3.4 檔案架構
15.4 給自己做點什麼
15.4.1 開始設計屬於你自己的網站
15.4.2 結構與表現
15.4.3 華麗的效果源自哪裡?
第十六章 最後的建議
16.1 思維的樂趣
16.1.1 堅持獨立思考
16.1.2 要善於自己發現和解決問題
16.1.3 不斷豐富知識, 提高所掌握知識的質量
16.1.4 換個角度思考問題
16.2 減少重複開發的選擇
16.3 讓維護方便點
16.3.1 適當的注釋
16.3.2 API手冊
16.4 以後自學的方向
附錄
…
作者簡介
劉傑，網名（嗷嗷），1999年接觸網頁製作，2004年接觸Web標準，是國內Web標準的先行人士。曾擔任過網頁設計師、前端開發工程師、互動設計師、產品設計師等職位，現任百度電子商務事業部前端設計師。多年來致力於Web標準的套用與推廣，曾在國內最大的網站設計與開發技術論壇——經典論壇bbs。
