網頁中的圖形設計是線上內容用戶體驗的關鍵,尤其是現在的用戶會使用多種設備訪問網頁,如智慧型手機、平板電腦、筆記本電腦、桌面電腦,甚至是智慧型電視。《回響式Web圖形設計》以創建回響式Web的角度,介紹了基礎的HTML和CSS語法,並深入研究了回響式Web設計中色彩、布局、圖像、排版、動畫、視頻和音頻等方面的內容。 《回響式Web圖形設計》結構整、輕鬆易懂,能夠幫助Web設計新手快速入門,並打下堅實的基礎。
基本介紹
- 書名:回響式Web圖形設計
- 作者:施密特 (Christopher Schmitt)
- 出版社:人民郵電出版社
- 頁數:226頁
- 開本:16
- 品牌:人民郵電出版社
- 外文名:Fundamental Concepts for Web and Interactive Projects
- 譯者:曾斌
- 出版日期:2014年4月1日
- 語種:簡體中文
- ISBN:711534776X
基本介紹,內容簡介,作者簡介,圖書目錄,
基本介紹
內容簡介
《回響式Web圖形設計》由人民郵電出版社出版。
作者簡介
作者:(美國)施密特(Christopher Schmitt) 譯者:曾斌
圖書目錄
第1章了解HTML
1.1為什麼要學習HTML?
1.1.1HTML使得網際網路更受歡迎
1.1.2學習HTML,更好地理解網頁設計
1.1.3學習HTML很容易
1.2HTML編程基礎
1.2.1文本編輯器
1.2.2文字處理軟體不是文本編輯器
1.2.3用HTML編寫代碼
1.3構建網頁
1.3.1指定DOCTYPE
1.3.2保存和查看頁面
1.4布置頁面內容
1.4.1HTML標題
1.4.2HTML文本標籤
1.4.3為網站創建連結
1.4.4添加title屬性
1.4.5網站的連結
1.5總結
第2章使用CSS設定樣式
2.1CSS來幫忙
2.2初識樣式
2.2.1聲明
2.2.2選擇器
2.2.3更多的CSS選擇器
2.3添加CSS格式
2,3.1連結到CSS
2,3.2內聯樣式
2.4塊和行內格式化
2.4.1HTML的通用元素
2.4.2偽類和偽元素
2.5專門為IE寫CSS
2.6常規流和定位
2.6.1靜態文本流(static)
2.6.2固定定位(fixed)
2.6.3相對定位(reIatjve)
2.6.4絕對定位(absolute)
2.7總結
第3章網頁排版
3.1網頁字型
3.1.1size屬性和值
3.1.2那么,你應該使用什麼測量值呢?
3.1.3粗細、樣式、變形和修飾
3.2網頁安全字型實踐
3.2.1網頁安全字型
3.2.2移動安全字型
3.3製作更好的字型棧
3.4網頁中的“Real Fonts”
3.4.1@font—face屬性
3.4.2生成嵌入檔案
3.4.3免費字型
3.4.4商業字型
3.5總結
第4章網頁設計中的挑戰
4.1網路環境
4.1.1揭示瀏覽器問題
4.1.2使用測試頁
4.1.3顏色
4.1.4螢幕和像素
4.1.5可訪問性
4.2決定你的跨瀏覽器目標
4.3針對不同設備開發網站
4.3.1重置和標準化瀏覽器樣式
4.3.2特殊前綴
4.3.3檢驗
4.3.4測試
4.4總結
第5章網頁中的顏色
5.1網頁顏色編碼
5.1.1十六進制顏色標記
5.1.2重寫HTML的默認顏色
5.1.3圖像框線
5.1.4帶透明度的CSS顏色
5.2顏色屬性
5.3原色系統
5.4顏色組合
5.5構建配色方案
5.5.1尋找基色
5.5.2文化與顏色
5.5.3瀏覽顏色的啟示
5,5.4構思方案
5.6一致的顏色
5.6.1校正顏色
5.6.2拾取顏色
5.7CSS顏色表
5.8總結
第6章網站圖像
6.1位數的問題
6.1.1像素深度
6.1.2色調分離和抖動
6.1.3更多位意味著更多顏色
6.1.4為什麼位深度如此重要?
6.2光柵圖像格式
6.2.1GIF圖像格式
6.2.2JPEG圖像格式
6.2.3PNG圖像格式
6.3圖像壓縮表
6.4SVG:網頁中的矢量檔案
6.5總結
第7章為網頁創建圖像
7.1使用
7.1.1為網頁設定工作區
7.1.2設定文檔尺寸
7.1.3導出光柵圖像
7.1.4使用Illustrator導出矢量圖像
7.2使用Photoshop
7.2.1新建文檔
7.2.2導出光柵圖像
7.3管理Web圖像檔案
7.4減小檔案尺寸
7.4.1壓縮光柵圖像
7.4.2使用HTTP壓縮
7.5總結
第8章透明度和陰影
8.1使用GIF圖像創造透明度
8.1.1雜邊
8,2PNG半透明圖像
8.2.18位PNG
8.2.224位PNG
8.3CSS透明度
8.3.1圓角
8.3.2圖像蒙版
8.3.3元素透明
8.3.4背景色透明度
8.3.5文本陰影
8.3.63D文本陰影
8.3.7盒陰影
8.4總結
第9章收藏夾圖示和移動書籤
9.1收藏夾圖示在哪裡
9.2收藏夾圖示的圖像格式
9.3將收藏夾圖示插入到網站中
9.3.1為子網站設定收藏夾圖示
9.3.2推廣收藏夾圖示
9.4為網頁創建收藏夾圖示
9.5移動書籤
9.5.1檔案格式
9.5.2命名規範
9.5.3自動圖像處理
9.5.4插入圖示
9.6混合收藏夾圖示與移動書籤
9.7總結
第10章列表和圖示字型
10.1無序列表
10.1.1CSS項目符號圖示
10.1.2插入定製圖示
10.2定義列表
10,3有序列表
10.3.1改變順序
10.3.2設定目錄
10.3.3添加有序標記的另一種寫法
10.4高效列表設計
10.5圖示字型
10.5.1選擇一種圖示字型
10.5.2突出字元或者短語
10.5.3創建可點擊的單獨圖示
10.6總結
第11章圖像映射
11.1創造圖像映射
11.1.1基礎的手工編碼
11.1.2使用Fireworks
112回響式圖像映射
11.3總結
第12章頁面布局
12.1CSS浮動
12.1.1float屬性
12.1.2多重浮動
12.1.3clear屬性
12.2浮動頁面布局
12.2.1頁面結構
12.2.2兩欄流式布局
12.2.3兩欄固定布局
12.2.4三欄流式布局
12.2.5三欄固定布局
12.2.6使用浮動布局的優缺點
12.3CSS框架
12.3.1格線系統
12.3.2最後看看框架
12.4回響式布局
12.4.1適應媒體查詢
12.4.2流式布局
12.4.3文本回流
12.4.4媒體查詢實戰
12.4.5回響式框架
12.5總結
第13章回響Web設計中的圖像
13.1縮放圖像和媒體
13.2縮放圖像帶來的問題
13.2.1大尺寸圖像
13.2.2更大尺寸的圖像
13.2.3把網速考慮進來
13.3自適應圖像解決方案
13.3.1另尋他法
13.3.2壓縮Retina圖像
13.4多圖像解決方案
13.4.1picture元素
13.4.2srcset屬性
13.4.3使用圖像補丁腳本
13.5總結
第14章對齊圖像
14.1圖像與文本的對齊
14.1.1baseline
14.1.2text—bottom
14.1.3text—top
14.1.4top和bottom
14.1.5middIe
14.2在瀏覽器視窗中居中圖像
14.2.1使用CSS設定背景
14.2.2僅用CSS
14.2.3幸虧有jQuery,我們不用把數字寫死了
14.3在瀏覽器中伸展圖像
14.4總結
1.1為什麼要學習HTML?
1.1.1HTML使得網際網路更受歡迎
1.1.2學習HTML,更好地理解網頁設計
1.1.3學習HTML很容易
1.2HTML編程基礎
1.2.1文本編輯器
1.2.2文字處理軟體不是文本編輯器
1.2.3用HTML編寫代碼
1.3構建網頁
1.3.1指定DOCTYPE
1.3.2保存和查看頁面
1.4布置頁面內容
1.4.1HTML標題
1.4.2HTML文本標籤
1.4.3為網站創建連結
1.4.4添加title屬性
1.4.5網站的連結
1.5總結
第2章使用CSS設定樣式
2.1CSS來幫忙
2.2初識樣式
2.2.1聲明
2.2.2選擇器
2.2.3更多的CSS選擇器
2.3添加CSS格式
2,3.1連結到CSS
2,3.2內聯樣式
2.4塊和行內格式化
2.4.1HTML的通用元素
2.4.2偽類和偽元素
2.5專門為IE寫CSS
2.6常規流和定位
2.6.1靜態文本流(static)
2.6.2固定定位(fixed)
2.6.3相對定位(reIatjve)
2.6.4絕對定位(absolute)
2.7總結
第3章網頁排版
3.1網頁字型
3.1.1size屬性和值
3.1.2那么,你應該使用什麼測量值呢?
3.1.3粗細、樣式、變形和修飾
3.2網頁安全字型實踐
3.2.1網頁安全字型
3.2.2移動安全字型
3.3製作更好的字型棧
3.4網頁中的“Real Fonts”
3.4.1@font—face屬性
3.4.2生成嵌入檔案
3.4.3免費字型
3.4.4商業字型
3.5總結
第4章網頁設計中的挑戰
4.1網路環境
4.1.1揭示瀏覽器問題
4.1.2使用測試頁
4.1.3顏色
4.1.4螢幕和像素
4.1.5可訪問性
4.2決定你的跨瀏覽器目標
4.3針對不同設備開發網站
4.3.1重置和標準化瀏覽器樣式
4.3.2特殊前綴
4.3.3檢驗
4.3.4測試
4.4總結
第5章網頁中的顏色
5.1網頁顏色編碼
5.1.1十六進制顏色標記
5.1.2重寫HTML的默認顏色
5.1.3圖像框線
5.1.4帶透明度的CSS顏色
5.2顏色屬性
5.3原色系統
5.4顏色組合
5.5構建配色方案
5.5.1尋找基色
5.5.2文化與顏色
5.5.3瀏覽顏色的啟示
5,5.4構思方案
5.6一致的顏色
5.6.1校正顏色
5.6.2拾取顏色
5.7CSS顏色表
5.8總結
第6章網站圖像
6.1位數的問題
6.1.1像素深度
6.1.2色調分離和抖動
6.1.3更多位意味著更多顏色
6.1.4為什麼位深度如此重要?
6.2光柵圖像格式
6.2.1GIF圖像格式
6.2.2JPEG圖像格式
6.2.3PNG圖像格式
6.3圖像壓縮表
6.4SVG:網頁中的矢量檔案
6.5總結
第7章為網頁創建圖像
7.1使用
7.1.1為網頁設定工作區
7.1.2設定文檔尺寸
7.1.3導出光柵圖像
7.1.4使用Illustrator導出矢量圖像
7.2使用Photoshop
7.2.1新建文檔
7.2.2導出光柵圖像
7.3管理Web圖像檔案
7.4減小檔案尺寸
7.4.1壓縮光柵圖像
7.4.2使用HTTP壓縮
7.5總結
第8章透明度和陰影
8.1使用GIF圖像創造透明度
8.1.1雜邊
8,2PNG半透明圖像
8.2.18位PNG
8.2.224位PNG
8.3CSS透明度
8.3.1圓角
8.3.2圖像蒙版
8.3.3元素透明
8.3.4背景色透明度
8.3.5文本陰影
8.3.63D文本陰影
8.3.7盒陰影
8.4總結
第9章收藏夾圖示和移動書籤
9.1收藏夾圖示在哪裡
9.2收藏夾圖示的圖像格式
9.3將收藏夾圖示插入到網站中
9.3.1為子網站設定收藏夾圖示
9.3.2推廣收藏夾圖示
9.4為網頁創建收藏夾圖示
9.5移動書籤
9.5.1檔案格式
9.5.2命名規範
9.5.3自動圖像處理
9.5.4插入圖示
9.6混合收藏夾圖示與移動書籤
9.7總結
第10章列表和圖示字型
10.1無序列表
10.1.1CSS項目符號圖示
10.1.2插入定製圖示
10.2定義列表
10,3有序列表
10.3.1改變順序
10.3.2設定目錄
10.3.3添加有序標記的另一種寫法
10.4高效列表設計
10.5圖示字型
10.5.1選擇一種圖示字型
10.5.2突出字元或者短語
10.5.3創建可點擊的單獨圖示
10.6總結
第11章圖像映射
11.1創造圖像映射
11.1.1基礎的手工編碼
11.1.2使用Fireworks
112回響式圖像映射
11.3總結
第12章頁面布局
12.1CSS浮動
12.1.1float屬性
12.1.2多重浮動
12.1.3clear屬性
12.2浮動頁面布局
12.2.1頁面結構
12.2.2兩欄流式布局
12.2.3兩欄固定布局
12.2.4三欄流式布局
12.2.5三欄固定布局
12.2.6使用浮動布局的優缺點
12.3CSS框架
12.3.1格線系統
12.3.2最後看看框架
12.4回響式布局
12.4.1適應媒體查詢
12.4.2流式布局
12.4.3文本回流
12.4.4媒體查詢實戰
12.4.5回響式框架
12.5總結
第13章回響Web設計中的圖像
13.1縮放圖像和媒體
13.2縮放圖像帶來的問題
13.2.1大尺寸圖像
13.2.2更大尺寸的圖像
13.2.3把網速考慮進來
13.3自適應圖像解決方案
13.3.1另尋他法
13.3.2壓縮Retina圖像
13.4多圖像解決方案
13.4.1picture元素
13.4.2srcset屬性
13.4.3使用圖像補丁腳本
13.5總結
第14章對齊圖像
14.1圖像與文本的對齊
14.1.1baseline
14.1.2text—bottom
14.1.3text—top
14.1.4top和bottom
14.1.5middIe
14.2在瀏覽器視窗中居中圖像
14.2.1使用CSS設定背景
14.2.2僅用CSS
14.2.3幸虧有jQuery,我們不用把數字寫死了
14.3在瀏覽器中伸展圖像
14.4總結