內容簡介
《寫給程式設計師的Web設計書》系統而深入地闡釋了網站的設計與實現，幫助讀者從開發人員的角度理解什麼是設計。通讀本書之後，讀者可以跨越純視覺思考者和純線性思考者之間的交流鴻溝。《寫給程式設計師的Web設計書》的主要內容有：如何挑選配色，如何選擇字型，如何用Photoshop實現基本設計，如何創作Banner等頁面元素，如何製作HTML和CSS模板以及如何測試設計的兼容性和可訪問性等。
《寫給程式設計師的Web設計書》適合開發人員和Web設計師研讀，對於那些獨立且沒有設計背景的開發人員非常有用。
圖書目錄
第1章 引言 1
1.1 說在前面的話 1
1.2 網頁設計實戰 2
1.2.1 明確要求 2
1.2.2 Photoshop時間 3
1.2.3 代碼時間 3
1.2.4 一切就緒 3
1.2.5 現實不一定總是如此美好 4
1.3 YourFoodbox com 4
1.4 準備好了嗎 4
1.5 致謝 4
第一部分 設計基礎
第2章 網頁(再)設計的基礎——重新設計Foodbox 8
2.1 目前的網站 8
2.2 收集需求 11
2.3 明確目的 12
2.4 從哪裡入手 13
2.5 畫出你的想法 13
2.5.1 一些約定俗成的布局風格 15
2.5.2 三張草圖 15
2.6 挑選草圖 17
2.7 小結 17
第3章 配色 18
3.1 色彩基礎 18
3.1.1 色調、飽和度和亮度 18
3.1.2 加法混色和減法混色 19
3.2 色彩環境感知 20
3.3 用顏色喚起情感 22
3.3.1 暖色 22
3.3.2 冷色 22
3.3.3 中性色 23
3.3.4 顏色和用戶 24
3.4 配色方案 24
3.4.1 單色方案 25
3.4.2 相似色方案 26
3.4.3 互補色方案 27
3.4.4 分離互補色方案 28
3.5網路安全色29
3.6 創建配色方案 30
3.6.1 用技術法選擇顏色 30
3.6.2 用自然選擇法選擇配色 35
3.7 選擇一個方案 39
3.7.1 前景色和背景色 40
3.7.2 連結 40
3.8 小結 41
第4章 字型和排版 42
4.1 深入字型 42
4.2 字型類別 43
4.2.1襯線字型43
4.2.2 無襯線字型 44
4.2.3等寬字型44
4.3 字型限制及應對方法 45
4.3.1 網頁安全字型 45
4.3.2 圖片替換 46
4.3.3 用字型棧來定義備用字型 46
4.3.4 選擇備用字型 47
4.4 挑選字型 47
4.4.1 頁面內容字型 48
4.4.2 標題字型 48
4.5 使用基線格線 49
4.5.1 行距 50
4.5.2 計量單位 50
4.5.3 為Foodbox選擇字型 52
4.6 小結 53
第二部分 圖像設計
第5章 為Foodbox設計Logo 56
5.1 建立工作目錄 56
5.2 Foodbox的Logo 57
5.3 當我們需要自己設計Logo的時候怎么辦 60
5.4 小結 61
第6章 設計樣式頁：頁面結構 62
6.1 關於圖層 62
6.2 基本結構 63
6.2.1 螢幕大小 64
6.2.2 定寬布局 65
6.2.3 設定格線 65
6.2.4 用輔助線劃定區域 66
6.2.5 畫出不同區域 67
6.3 放置Logo 67
6.4 用圖層組組織圖像 68
6.5 給Logo加上倒影 68
6.6 頁腳 69
6.7 小結 70
第7章 設計樣式頁：內容相關 71
7.1 製作搜尋框 71
7.2 餐譜導航標籤雲72
7.3 範圍潛變 73
7.4 做一個美味的摘要 74
7.5 主要內容 76
7.6 瀏覽器模仿 77
7.7 小結 78
第8章 樣式頁上的按鈕 79
8.1 製作搜尋圖示 79
8.1.1 創建圖示背景 79
8.1.2 繪製放大鏡 81
8.1.3 放置搜尋圖示 82
8.2 創建註冊和登錄按鈕 82
8.2.1 添加文字 85
8.2.2 添加註冊按鈕 85
8.3 文字內容來了 86
8.3.1 替換掉原來的亂碼 86
8.3.2 添加“最新菜譜”區 86
8.4 小結 87
第三部分 建設網站
第9章 用HTML做出主頁 90
9.1 網頁標準化 91
9.2 首頁的結構 91
9.3 語義化的標籤 93
9.4 主頁的框架 94
9.4.1 doctype 94
9.4.2 html標籤 97
9.4.3 屬性 97
9.4.4 head和body標籤 98
9.4.5 沒有閉合標籤的標籤 98
9.4.6 頁面標題 99
9.4.7 body標籤：重頭戲 100
9.5 頁頭 102
9.6 側邊欄 102
9.6.1 搜尋表單 103
9.6.2 菜譜標籤雲 104
9.6.3 食材標籤雲 106
9.7 主要內容 108
9.7.1 意大利麵圖片 108
9.7.2 註冊和登錄按鈕 109
9.7.3 最新菜譜區 110
9.8 頁腳 110
9.9 驗證標籤 114
9.9.1 為網頁開發設定Firefox瀏覽器 114
9.9.2Web Developer工具列 115
9.9.3 驗證文檔 116
9.10 HTML 5 116
9.11 小結 119
第10章 為樣式頁面添磚加瓦 120
10.1 圖像最佳化 120
10.2 處理不同格式的圖像 121
10.2.1 GIF 121
10.2.2 PNG 122
10.2.3 JPEG 123
10.3 文檔切片 124
10.4 創建切片 125
10.5 將Banner導出成PNG檔案127
10.5.1 隱藏圖層 127
10.5.2 保存切片 127
10.6 導出其他圖片 128
10.7 小結 129
第11章 使用CSS布局 130
11.1 瀏覽器招人厭 130
11.2 CSS基礎 131
11.2.1 選擇符 131
11.2.2 聲明：屬性和值 132
11.2.3 關於“層疊” 133
11.3 瀏覽器如何解析CSS 136
11.3.1 嵌入式 136
11.3.2 style標籤 137
11.3.3 外部CSS檔案 138
11.4 創建並連結新的CSS樣式表 138
11.5 定義基本結構、頁頭和頁腳 139
11.5.1 瀏覽器默認 139
11.5.2 盒模型 141
11.5.3 將內容居中 141
11.5.4 定義頁頭和頁腳 142
11.6 將頁面的單欄變成雙欄 142
11.6.1文檔流143
11.6.2 浮動 143
11.6.3 背景顏色和浮動 146
11.7 為內容加上外邊距 148
11.8 主區域 148
11.8.1 主區域文字 148
11.8.2 註冊按鈕區域 149
11.8.3 最新菜譜 150
11.9 回到頁腳 150
11.10 小結 151
第12章 利用覆蓋法替換各區域中的標題 152
12.1 什麼是覆蓋法 152
12.2 為覆蓋做準備，調整HTML 152
12.3 覆蓋文字 152
12.4 替換所有其他標題 153
12.5 替換連結 154
12.6 這種方法的缺陷 156
12.7 小結 156
第13章 添加樣式 157
13.1 設定字型和顏色 157
13.1.1 風格手冊的重要性 158
13.1.2 偽類 159
13.2 標籤雲 160
13.3 搜尋表單 160
13.4 頁腳 161
13.5 清理零散的角落 161
13.5.1 去掉圖片的框線 161
13.5.2 拉伸Banner里的顏色 162
13.6 小結 163
第14章 製作印表機友好的頁面 164
14.1 準備工作 164
14.2 連結列印用樣式表 164
14.3 去掉不需要的元素 165
14.4 設定外邊距、寬度和字型 165
14.4.1 頁面外邊距 166
14.4.2 選擇一個字型 166
14.4.3 加上一個分隔設定 167
14.5 搞定連結 167
14.6 還要應付不習慣專有列印樣式的用戶 168
14.7 小結 169
第四部分 準備上線
第15章 讓網頁適應IE和其他瀏覽器 172
15.1 確定要支持哪些瀏覽器 172
15.1.1 支持瀏覽器 172
15.1.2 只支持某些特性 173
15.2 關於瀏覽器的一些數據 173
15.3 Internet Explore：你無法逃避的惡魔 174
15.4 IE7 175
15.4.1 IE的詭異模式 176
15.4.2 XML序言 176
15.4.3 在doctype上方的注釋 176
15.5 IE6 176
15.5.1 修復不正常的地方 177
15.5.2 解決分欄的問題 178
15.5.3 修正透明問題 178
15.5.4 修復頁頭圖片下面的空白 179
15.6 IE8 180
15.7 其他瀏覽器 181
15.8 小結 183
第16章 可訪問性和可用性 184
16.1 可訪問性對你來說意味著什麼 184
16.2 關於可訪問性的基礎問題 185
16.2.1 盲人 185
16.2.2 色盲用戶 189
16.2.3 有視覺缺陷的人 191
16.2.4 有聽力缺陷的用戶 191
16.2.5 行動障礙和沒有滑鼠的用戶 192
16.3 包容一切 192
16.3.1 導航 193
16.3.2 處理出錯信息 194
16.3.3 跨瀏覽器測試 194
16.4 重要的商業問題 194
16.5 改進Foodbox網站的可訪問性 195
16.5.1 添加跳轉連結 195
16.5.2 螢幕閱讀器和display:none 196
16.5.3 用“負位置”隱藏跳轉連結 197
16.5.4 表單的標籤 197
16.6 使用製表鍵198
16.7 可訪問性清單 200
16.8 小結 201
第17章 製作收藏夾圖示 202
17.1 創建簡單的圖示 202
17.2 創建收藏夾圖示 202
17.3 小結 203
第18章 搜尋引擎最佳化 204
18.1 內容為王 204
18.1.1 “欺騙”搜尋引擎 204
18.1.2 到底什麼是內容 205
18.2 選擇關鍵字 206
18.2.1 猜想他們是如何找到你的 206
18.2.2 決定你想如何被發現 206
18.2.3 看看競爭對手 206
18.2.4 添加關鍵字 207
18.3 完善頁面內容 207
18.4 不要因為最佳化而忽略了用戶 208
18.5 你和連結 208
18.6 到最後其實都是常識 208
18.7 小結 209
第19章 針對移動設備的設計 210
19.1 移動用戶 210
19.2 關於(很)小螢幕 211
19.3 JavaScript 212
19.4 提供移動版 212
19.4.1 移動版樣式表 212
19.4.2 用戶代理探測 212
19.4.3 使用子域名213
19.5 做決定——到底要支持什麼平台 213
19.5.1 在不產生重複內容的情況下製作一個鏡像 214
19.5.2 調整內容 215
19.5.3 處理程式 216
19.5.4 進一步改進 218
19.6 為移動用戶做重構 218
19.7 小結 219
第20章 測試與性能最佳化 220
20.1 最佳化性能的策略 220
20.2 確定影響性能的因素 221
20.2.1 速度測試 221
20.2.2yslow222
20.3 解決性能問題 222
20.3.1 設定逾時報頭 222
20.3.2 用Etag改進快取 223
20.3.3 用資源伺服器分發請求 225
20.3.4 檔案壓縮 226
20.3.5 壓縮腳本檔案 226
20.4 圖片最佳化 229
20.5 小結 230
第21章 後續工作 231
21.1 其他頁面和模板 231
21.2 高級模板 234
21.3 格線系統和CSS框架 235
21.3.1 YUI格線 235
21.3.2960格線系統236
21.3.3 框架不是萬能的 238
21.4 替換CSS 239
21.5 不要忘記為有著作權的照片付錢 240
21.6 視覺效果 241
21.6.1 縮放圖片 241
21.6.2 寫代碼 241
21.6.3 把動畫放到主頁上 243
21.7 多試多做 245
第22章 推薦閱讀 246
22.1 色彩資源 246
22.2 關於字型和排版的書 246
22.3 技術書籍 246
22.4 網站資源 247
參考書目 249
