內容簡介
Fireworks網頁元素與網頁效果圖設計《美工神話Fireworks網頁元素與網頁效果圖設計》主要以Fireworks網頁效果圖設計為主線，介紹網頁效果圖的設計流程和網頁中各種頁面元素的設計。書中按照網頁的構成元素，如布局、色彩、LOGO、導航設計、通欄設計等進行分類講解，以豐富的實例幫助讀者快速掌握網頁效果圖的各類設計方法和技巧。《美工神話Fireworks網頁元素與網頁效果圖設計》從實用的角度出發，將軟體使用技能與設計藝術完美結合；從設計構思到作品完成，將經典案例的整個過程一一剖析給讀者。學習完《美工神話Fireworks網頁元素與網頁效果圖設計》，讀者從中不但可以深入了解Fireworks軟體的精妙之處，更能夠領悟到更多優秀的設計思想、設計理念和寶貴的設計經驗。
作者簡介
劉濤，Adobe認證平面教師，原北京新東方職業教育中心電腦美術講師，原天極網校電腦美術講師，教育部考試中心《全國計算機套用技術職業技能考試》命題和評審教師，全國大學生就業指導衛星專網客座講師，網名froglt，藍色理想經典論壇版主。
技術專長：致力於電腦美術教學工作，精通Adobe軟體，是國內第一批Adobe認證講師，第二批Macromedia認證講師。
2005年在全國青年教師計算機教育優秀論文評比中獲優秀獎，積累了大量教學和實戰經驗。已經出版數十本圖書，在網路上發表各類文章數十篇。擅長網站建設、網站開發和美術設計，長期研究設計美學方面的內容。
工作經歷：2001年～2002年，就職於北京金世紀學校，任電腦美術講師。2002年～2005年，就職於北京新東方學校電腦部，任電腦美術講師。2005年至今，就職於東方標準，任電腦美術講師。
編輯推薦
《美工神話Fireworks網頁元素與網頁效果圖設計》附帶的光碟中提供了Fireworks網頁效果圖源檔案，以及豐富的創作素材，更多資源可以到www.go2here.net.cn下載。
《美工神話Fireworks網頁元素與網頁效果圖設計》適合網頁設計、網站製作的相關人員閱讀和使用，還可以作為大中專院校相關專業的教學輔導和參考用書，或者作為相關培訓機構的教材。
180個按鈕導航png檔案
300個網頁效果圖Png檔案
數千個網頁製作素材檔案
書中實例源檔案及素材
經典ID：sq4537（小強不是蟑螂，經典論壇FireWorks版主）這是一本網頁效果圖蹬計的技巧大全，並不是簡單講解枯燥無味的理論，而是結合了大量的實際案例進行分析，告訴你為什麼要這樣做。
經典ID：17526918（淘金者，經典論壇Fireworks版主）網頁設計的關鍵是效果圖設計，初學者如何快速的提高自己的設計水準、少走彎路呢？我建議大家可以先學習模仿，從模仿中吸取優秀設計師的設計理念，包括色彩、布局、修飾……
經典ID：ROCkHward（洛克，經典論壇Fireworks版主）書中兩個完整的網站建設變例，全面介紹了從網頁效果圖設計、切片、最佳化到web標準布局的完整流程，對於網頁設計的初學者而言大有幫助。
經典ID：凌志（杯莫停，平面設計區總版主）模仿他人作品是快速提高自己軟體操作能力的一種方法，但是刻意地模仿遠遠不能達到設計的目的，你必須了解設計的內涵，明確他人的設計意圖。閱讀這《美工神話Fireworks網頁元素與網頁效果圖設計》後，你將會找到答案。
經典ID：webs2008（設計BOB，經典論壇榮譽管理團隊）網頁效果圖設計足軟體套用和沒計理論相結合的產物，《美工神話Fireworks網頁元素與網頁效果圖設計》最大的特點是不儀介紹了設計工具的使用，還詳細闡明了相關的設汁原理，即為什麼要這么做。
經典ID：moonjeep（夢之譜，經典論壇超級版主）好的設計跫技術與藝術的完美結合，《美工神話Fireworks網頁元素與網頁效果圖設計》對這兩方面都有全面面和詳細的介紹，相信一定對你大有幫助。
目錄
第1章 網頁效果圖設計的一般流程 1
1.1 網頁效果圖設計流程概述 3
1.1.1 創建輔助線 3
1.1.2 繪製結構底圖 4
1.1.3 添加內容 5
1.1.4 切片 5
1.1.5 最佳化 6
1.1.6 導出 7
1.1.7 布局 9
1.2 網站策劃 10
1.2.1 收集客戶資料 10
1.2.2 分析網站類型 10
1.2.3 確定網站風格 11
1.3 各類網站的布局特點分析 12
1.3.1 資訊類網站 13
1.3.2 電子商務類網站 16
1.3.3 互動遊戲類網站 18
1.3.4 教育類網站 23
1.3.5 功能型網站 25
1.3.6 綜合類網站 26
第2章 網頁的布局 29
2.1 網頁布局基礎 30
2.1.1 網頁中的基本元素 30
2.1.2 網頁的構成 33
2.1.3 網頁的空間與頁面尺寸 36
2.1.4 頁面元素的分布情況 38
2.2 網頁的布局設計 39
2.2.1 布局方法 39
2.2.2 確定版面率 40
2.2.3 格線設計 43
2.3 網頁布局的分類 45
2.3.1 滿版布局形式 45
2.3.2 十字布局形式 45
2.3.3 九宮格布局形式 46
2.3.4 米字布局形式 47
2.4 網頁布局技巧 49
2.4.1 黃金分割式布局(完美的比例給人視覺上的享受) 49
2.4.2 左右對齊式布局(沒有浪費的空間，表現商業性形象) 52
2.4.3 全景式布局(用趣味性吸引瀏覽者) 53
2.4.4 衛星式布局(以太陽為中心的衛星環繞型) 55
2.4.5 照片組合式布局(新世界以全景式自由的展現出來) 57
2.4.6 包圍式布局(限定範圍的效果) 59
2.4.7 散開式布局(山水畫般的自由和優雅) 62
2.4.8 單側齊行式布局(理性與自由共存的版式設計) 64
2.4.9 對稱式布局(以中心為基線，左右對稱) 66
第3章 網頁的色彩設計 69
3.1 網頁設計要素——色彩 70
3.1.1 色彩決定印象 70
3.1.2 色彩印象無法更改 71
3.1.3 色彩無處不在，具有多重效果 72
3.2 色彩的原理 73
3.2.1 光與色彩 73
3.2.2 物體色 74
3.2.3 色彩類型 75
3.2.4 色彩三要素 76
3.3 色相環的作用 79
3.3.1 色相環的構成 79
3.3.2 色相環中的顏色特點 80
3.3.3 色彩之間的關係 81
3.4 網頁中的色彩 88
3.4.1 RGB色彩模式 89
3.4.2 HTML語言對顏色的描述 90
3.4.3 216網頁安全色 91
3.5 色彩索引 91
3.5.1 紅色 91
3.5.2 橙色 93
3.5.3 黃色 94
3.5.4 綠色 96
3.5.5 藍色 97
3.5.6 紫色 99
3.5.7 黑色 101
3.5.8 白色 102
3.5.9 灰色 103
3.5.10 色彩索引配色法 104
3.6 色調的變化效果 104
3.6.1 鮮艷的色調 105
3.6.2 亮色調 105
3.6.3 淡色調 106
3.6.4 中間色調 106
3.6.5 淺濁色調 107
3.6.6 暗色調 107
3.6.7 深色調 108
3.7 色彩的四種功能 108
3.7.1 主色 108
3.7.2 背景色 109
3.7.3 融合色 112
3.7.4 強調色 113
3.8 實用配色網站推薦 114
第4章 Fireworks圖像處理關鍵技術精講 117
4.1 Fireworks基本操作技巧集錦 118
4.2 矢量繪製關鍵技術 120
4.2.1 兩種方法繪製圓角矩形 120
4.2.2 防止對圓角矩形變形的時候圓角改變 121
4.2.3 巧妙消除路徑邊緣的鋸齒 122
4.2.4 多種方法繪製虛線 123
4.2.5 製作網頁效果圖中的清晰小字 124
4.2.6 使文字按照路徑排列 125
4.2.7 製作電視掃描線的效果 126
4.2.8 自定義紋理 127
4.2.9 添加和修改漸變色填充 128
4.2.10 巧妙製作漸隱的線條 130
4.2.11 解決圖示縮小後變形的問題 132
4.3 圖像處理關鍵技術 134
4.3.1 蒙版的3種用途 134
4.3.2 選區和路徑的轉換 143
4.3.3 製作圖像條形碼效果 146
4.3.4 Fireworks中的外掛濾鏡 148
4.3.5 製作淡彩鋼筆畫效果 151
4.3.6 製作特殊的漸變色效果 153
4.3.7 製作格線化圖像效果 154
4.3.8 製作老照片效果 157
4.3.9 使用【曲線】命令校正圖像的色彩 158
4.3.10 使用【色階】命令調整圖像的色彩 165
第5章 Fireworks網頁製作關鍵技術精講 169
5.1 GIF動畫製作關鍵技術 170
5.1.1 使用Fireworks製作補間動畫 170
5.1.2 巧用“補間”技術作圖 171
5.1.3 巧做網頁LOGO中的光描動畫 174
5.2 Fireworks行為相關關鍵技術 176
5.2.1 使用Fireworks製作互動按鈕 176
5.2.2 使用Fireworks的行為實現圖像翻轉特效 179
5.2.3 把Fireworks中的互動效果添加到網頁中 183
5.3 切片和最佳化的關鍵技術 187
5.3.1 在Fireworks中對圖像進行最佳化 187
5.3.2 選擇合適的圖像最佳化格式 188
5.3.3 巧妙去除GIF圖像周圍的白邊 192
5.3.4 導出效果圖切片 192
5.4 Fireworks效率工具問題集合 198
5.4.1 巧妙執行重複的操作 198
5.4.2 對大量的圖像素材進行批量處理 201
第6章 網頁的LOGO設計 205
6.1 LOGO設計的基本構成要素 206
6.1.1 LOGO中的線條 206
6.1.2 LOGO中的形狀 208
6.1.3 用線條和形狀構成LOGO 209
6.1.4 LOGO中的英文字型 210
6.1.5 LOGO中的中文字型 212
6.2 40種常用LOGO設計技巧 217
6.3 Web2.0風格LOGO設計要素 226
6.4 實用LOGO設計網站推薦 228
6.5 LOGO設計案例分析 229
第7章 網頁的導航設計 233
7.1 網站的欄目構成 234
7.2 導航的視覺設計 236
7.3 導航的互動設計 240
7.4 沒有“導航”的導航——搜尋 241
第8章 網頁的通欄設計 243
8.1 網頁通欄概述 244
8.1.1 網頁中的通欄 244
8.1.2 網頁通欄的設計形式 246
8.1.3 網頁通欄的尺寸 247
8.2 圖像素材的選擇 247
8.2.1 說服力的強弱 248
8.2.2 內容的相關度 250
8.2.3 發掘圖像背後的故事 251
8.2.4 色彩的層次 252
8.2.5 與眾不同 252
8.2.6 幽默詼諧 253
8.2.7 唯美主義 253
8.2.8 戲劇化 254
8.2.9 強調臉部 254
8.3 圖像裁剪的技巧 256
8.3.1 將圖像轉化為相同的尺寸 256
8.3.2 製作不同比例的圖像 257
8.3.3 統一人物肖像的尺寸 257
8.3.4 對人物肖像進行裁剪 258
8.3.5 裁剪掉無關的部分 260
8.3.6 調整圖像的角度 260
8.3.7 放大後裁剪 261
8.3.8 只保留局部 262
8.3.9 改變圖像傳遞的信息 263
8.3.10 一圖多用 263
8.3.11 突破空間 266
8.3.12 邊緣的處理 267
8.4 圖像設計的技巧 269
8.4.1 添加框線 269
8.4.2 疊加效果 270
8.4.3 添加元素的效果 271
8.4.4 剪貼簿效果 272
8.4.5 捲曲效果 273
8.4.6 製作“拍立得”效果 276
8.4.7 異形邊緣 276
8.4.8 小圖銳化 279
8.5 通欄廣告的設計技巧 279
8.5.1 選擇合適的素材 279
8.5.2 環境背景設計 280
8.5.3 產品的展示 281
8.5.4 字型的選擇和設計 282
第9章 簡單風格的小型網站設計 285
9.1 案例分析 286
9.1.1 頁面布局形式 286
9.1.2 添加文字和圖像 289
9.2 案例實現 293
9.2.1 製作效果圖 293
9.2.2 切片、最佳化和導出 296
9.2.3 布局頁面 299
第10章 標準型網站設計 311
10.1 案例分析 313
10.1.1 頁面布局形式 313
10.1.2 頁眉的設計 314
10.1.3 通欄的設計 316
10.1.4 內容區域的設計 318
10.1.5 頁腳的設計 319
10.1.6 字型的選擇 320
10.2 案例分析 320
10.2.1 製作結構底圖 320
10.2.2 頁眉設計 324
10.2.3 通欄設計 325
10.2.4 製作內容區域 327
10.2.5 製作頁腳 328
10.2.6 切片、最佳化和導出 330
10.2.7 布局頁面 334
……
