前言
第1章 網站結構 1
1.1 網站結構圖 1
1.2 網站邏輯模型圖的設計 3
1.3 選題 4
1.3.1 企業(yè)網站 4
1.3.2 非企業(yè)網站 4
1.4 劃分信息 6
1.4.1 自頂向下劃分 6
1.4.2 自底向上劃分 8
1.5 層次劃分和優(yōu)化 10
1.5.1 網站的頂層結構 11
1.5.2 網站的下層結構 12
1.6 目錄安排 15
1.7 網頁關系 16
1.7.1 信息片段 17
1.7.2 順序關系 17
1.7.3 矩陣關系 18
1.7.4 樹形關系 19
1.7.5 網狀關系 19
本章小結 21
第2章 導航系統(tǒng)和用戶接口 22
2.1 導航系統(tǒng) 22
2.1.1 菜單 24
2.1.2 站內目錄 26
2.1.3 站點目錄的建立 26
2.1.4 站內搜索 28
2.1.5 網站地圖及實例 28
2.1.6 你的位置 37
2.1.7 腳注及其他 38
2.1.8 設計導航系統(tǒng)的注意事項 39
2.2 用戶接口 47
2.2.1 Step by Step 47
2.2.2 錯誤校驗 49
2.2.3 關于用戶名 50
本章小結 52
第3章 頁面設計 53
3.1 頁面大小 53
3.1.1 瀏覽器的偏移量 54
3.1.2 畫布(canvas)大小 55
3.1.3 安裝了Microsoft Office之后的問題 56
3.1.4 建議的頁面大小 56
3.2 頁面主題 57
3.2.1 分隔線 58
3.2.2 標題圖 60
3.2.3 頁眼圖 60
3.2.4 制作按鈕和條形圖標 61
3.2.5 制作編目圖標 63
3.2.6 主題參考 65
3.3 頁面劃分 69
3.3.1 兩欄式結構 69
3.3.2 三欄式結構 69
3.3.3 兩欄/三欄式相結合 70
3.3.4 兩欄. 三欄式的變形 71
3.4 設計頁面原始結構框圖 72
3.4.1 綜合性站點的原始結構框圖 72
3.4.2 企業(yè)網站的原始結構框圖 72
3.4.3 企業(yè)站點與非企業(yè)站點對于頁面原始結構規(guī)劃的不同之處 72
3.5 設計頁面圖 75
3.5.1 關于設計的幾點建議 76
3.5.2 利用工具設計頁面圖 77
3.6 拆分頁面 78
3.6.1 第一次拆分 78
3.6.2 輸出HTML代碼及初步優(yōu)化 81
3.6.3 第二次頁面拆分 85
3.6.4 第三次頁面拆分 87
3.7 代碼優(yōu)化(使網頁苗條) 91
3.7.1 在HTML中明確地標注圖像尺寸(不要省略圖像的
WIDTH和HEIGHT屬性) 91
3.7.2 去掉多余的圖像 93
3.7.3 使用適用的圖像格式 93
3.7.4 使用緩存 95
3.7.5 保證圖像中一行里的顏色數(shù)盡可能得少 95
3.7.6 盡可能使用文本而不用圖形 96
3.7.7 制作快速表格的技巧 98
3.7.8 測試你的網頁 103
3.8 模板的創(chuàng)建 104
3.8.1 半模板 104
3.8.2 全模板 105
3.9 頁面更新和管理計劃 108
3.10 幾種例行頁面的設計制作 108
3.10.1 歡迎頁面的制作 108
3.10.2 聯(lián)系頁面的制作 110
3.10.3 雇員信息頁面的制作 110
3.10.4 新聞頁面的制作 113
3.10.5 產品/服務頁面的制作 116
3.10.6 客戶支持頁面的制作 118
3.11 創(chuàng)意頁面的設計制作 120
3.12 頁面實例 121
3.12.1 歡迎頁面的實例 121
3.12.2 創(chuàng)意頁面的實例 122
3.12.3 新聞頁面的實例 122
3.12.4 雇員頁面的實例 124
3.12.5 產品頁面的實例 125
3.12.6 FAQ頁面實例 127
本章小結 130
第4章 配色方案 132
4.1 關于計算機的色彩表示 132
4.1.1 顏色十六進制數(shù)值 133
4.1.2 RGB值 134
4.2 關于瀏覽器的安全色彩問題 135
4.3 關于顏色的語言 136
4.3.1 顏色符號論圖表 137
4.3.2 不同文化的顏色符號論 137
4.3.3 顏色與心理 137
4.4 Web頁面的用色要求 141
4.5 頁面顏色的選擇 141
4.5.1 主色 142
4.5.2 輔色 142
4.6 配色方法 145
4.6.1 配色竅門 146
4.6.2 幾種配色方案 147
4.7 給色彩制作檔案 149
本章小結 150
第5章 CSS樣式表 151
5.1 樣式表的寫法 151
5.1.1 樣式表寫法分類 151
5.1.2 文字屬性控制 153
5.1.3 表單屬性控制 154
5.1.4 鏈接 155
5.2 樣式表舉例 156
本章小結 160
第6章 表格的應用 161
6.1 表格的作用 161
6.1.1 確定頁面布局 161
6.1.2 隨心所欲地安排頁面內容 161
6.1.3 在某種程度上替代圖像 161
6.2 表格的放置 162
6.2.1 單級表格式 162
6.2.2 多級嵌套式 162
6.2.3 重復單級式 163
6.3 表格的制作 163
6.3.1 表格的寬度 163
6.3.2 表格的邊框 164
6.3.3 表元的間隙 166
6.3.4 表格的分隔線 169
6.3.5 表元內容的對齊布局 170
6.3.6 表格在頁面中的對齊/布局 172
6.4 表格的使用竅門 173
6.4.1 制作按鈕 173
6.4.2 制作線條 176
6.4.3 替代圖像 183
6.5 關于表格的幾點建議 189
6.5.1 表格的多級嵌套最好不超過三層 189
6.5.2 盡量不要使用不規(guī)則表格 189
本章小結 189
第7章 圖的應用 190
7.1 網頁圖片的使用原則 190
7.1.1 盡量使用小圖 190
7.1.2 使用高中質量的圖片 190
7.2 網頁圖片的選擇 191
7.2.1 內容的選擇 191
7.2.2 色調的選擇 191
7.2.3 質量的選擇 191
7.2.4 選擇圖片的方法 192
7.3 網頁圖片的修飾 192
7.3.1 圖的淡化 192
7.3.2 圖的羽化 193
7.3.3 圖的單色化 194
7.3.4 修改背景色 196
7.3.5 背景透明化 198
7.3.6 背景模糊 201
7.3.7 圖像的組合 202
7.3.8 圖像勾邊 202
7.4 增加網頁立體效果 206
7.4.1 陰影效果 206
7.4.2 倒影效果 207
7.4.3 光影效果 212
7.4.4 浮雕效果 213
7.5 在哪里使用圖最恰當 214
7.5.1 背景 214
7.5.2 首頁 215
7.5.3 coverpage 215
7.5.4 文字密集處 215
7.5.5 提交按扭 215
7.6 隱形圖的使用 215
7.7 圖和表格的結合 216
7.7.1 圖和表格底色的結合 216
7.7.2 巧用表格背景圖 217
7.8 用CSS的濾鏡功能處理圖片 220
7.8.1 Alpha濾鏡 220
7.8.2 Blur濾鏡 222
7.8.3 FlipH和FlipV濾鏡 223
7.8.4 Chroma濾鏡 225
7.8.5 Dropshadow濾鏡 226
7.8.6 Glow濾鏡 227
7.8.7 Gray濾鏡 228
7.8.8 Light濾鏡 228
7.8.9 Shadow濾鏡 230
7.8.10 Wave濾鏡 231
7.8.11 CSS濾鏡的綜合應用 232
7.9 用Script程序使圖片產生意想不到的效果 233
7.10 關于GIF動畫 234
7.11 圖的替代品 234
7.11.1 表格 234
7.11.2 特殊字符 234
本章小結 235
第8章 分隔線的應用 236
8.1 線的類型 236
8.1.1 復雜型 236
8.1.2 簡單型 237
8.1.3 其他型 237
8.2 線的制作 238
8.2.1 制作精美的線條 238
8.2.2 制作10×10像素的小圖 238
8.2.3 在HTML中勾勒表格邊框 238
8.2.4 用表格背景色做線 239
8.2.5 用表格背景圖做線 239
8.2.6 使用HTML中的 239
本章小結 240
第9章 文字的處理 241
9.1 文字的擺放 241
9.1.1 文字的布局 241
9.1.2 文字的擺放規(guī)則 243
9.2 使用CSS的濾鏡效果處理文字 244
9.2.1 Alpha濾鏡 244
9.2.2 Blur濾鏡 245
9.2.3 FlipH, FlipV濾鏡 246
9.2.4 DropShadow濾鏡 247
9.2.5 Glow濾鏡 248
9.2.6 Shadow濾鏡 248
9.2.7 Wave濾鏡 249
9.2.8 CSS濾鏡的綜合應用 249
9.3 使用Script程序處理文字 250
本章小結 253
第10章 按鈕及圖標 254
10.1 根據(jù)頁面主題收集按鈕和圖標 254
10.2 根據(jù)頁面主題設計按鈕和圖標 255
10.3 使用Script程序制作按鈕 256
10.4 實戰(zhàn):借助軟件制作導航按鈕和圖標 257
10.4.1 ActionBars 257
10.4.2 AllWebMenus 265
本章小結 275
第11章 表單應用 276
11.1 創(chuàng)建表單頁面 276
11.1.1 創(chuàng)建表單頁面的準備工作 277
11.1.2 設計表單頁面 278
11.2 表單元素的修飾 282
11.2.1 增加表單邊框 282
11.2.2 隱藏表單邊框 283
11.2.3 修改表單邊框 284
11.2.4 修改submit外表 285
11.3 表單區(qū)域的修飾 285
11.3.1 增加表單區(qū)域外框 286
11.3.2 使用小圖片 287
11.3.3 使用區(qū)域背景圖 287
11.3.4 使用精心制作的按鈕圖片 288
11.3.5 使用標題圖片 288
11.4 表單頁面實例 288
本章小結 289
第12章 隱藏信息, 換取空間 290
12.1 隱藏文字 290
12.2 菜單的應用 293
12.2.1 彈出式菜單 294
12.2.2 伸縮式菜單 294
12.2.3 下拉菜單 295
12.3 標簽的應用 296
12.3.1 圖像的標簽 296
12.3.2 鏈接的標簽 297
12.4 共享空間 297
12.4.1 圖像共享空間 298
12.4.2 文字共享空間 299
本章小結 299
第13章 網頁廣告 300
13.1 廣告的分類 300
13.1.1 留給別人的廣告 300
13.1.2 留給自己的廣告 301
13.2 廣告的規(guī)格 301
13.2.1 468×60 301
13.2.2 88×31 301
13.2.3 120×60 302
13.2.4 125×125 302
13.2.5 其他 302
13.3 廣告的位置 303
13.3.1 頁眉 304
13.3.2 頁中 304
13.3.3 頁腳 305
13.3.4 專辟的廣告區(qū) 305
13.4 設置廣告收費標準 306
13.5 跟蹤Web廣告 307
13.6 廣告隨機顯示系統(tǒng)的制作 308
13.6.1 用JavaScript實現(xiàn)廣告的互換顯示 308
13.6.2 使用Meta + iframe 技術 309
13.7 網頁廣告的設計制作 311
13.7.1 廣告的設計 313
13.7.2 制作GIF格式的動畫廣告 316
13.8 關于Rich Media Banner 322
本章小結 323
附錄一 相關網址 324
附錄二 CSS的基本語法 329
附錄三 網頁廣告常見問答 335
附錄四 瀏覽器相容性圖表 338