回響式設計、改造與最佳化

回響式設計、改造與最佳化

《回響式設計、改造與最佳化》是2015年9月電子工業出版社出版的圖書,作者是【美】Phil Dutson(菲爾 達特森)。

基本介紹

  • 書名:回響式設計、改造與最佳化
  • 作者:【美】Phil Dutson(菲爾 達特森)
  • 譯者:趙榮嬌 馬立銘 譯
  • ISBN:978-7-121-26512-9
  • 頁數:256頁
  • 定價:89.00元
  • 出版社電子工業出版社
  • 出版時間:2015年9月
  • 裝幀:平裝
  • 開本:16
內容簡介,內容提要,作者簡介,目錄,

內容簡介

由於移動設備的大量使用,各種螢幕尺寸、各種作業系統、各種訪問設備及各種需求均對用戶體驗提出了新的挑戰。為了讓我們的網站在各個終端上的用戶體驗都儘可能接近完美,我們需要採用回響式移動設計。《回響式設計、改造與最佳化》重點介紹了Phil Dutson的開發經驗,主要是關於移動設備及其設計,甚至一點點代碼就可以幫助你以最好的方式為數百萬手機用戶提供內容;同時,順便簡單地介紹了一些主題,以解決常見的回響式移動設計中可能會遇到的問題。

內容提要

由於移動設備的大量使用,各種螢幕尺寸、各種作業系統、各種訪問設備及各種需求均對用戶體驗提出了新的挑戰。為了讓我們的網站在各個終端上的用戶體驗都儘可能接近完美,我們需要採用回響式移動設計。《回響式設計、改造與最佳化》重點介紹了Phil Dutson的開發經驗,主要是關於移動設備及其設計,甚至一點點代碼就可以幫助你以最好的方式為數百萬手機用戶提供內容;同時,順便簡單地介紹了一些主題,以解決常見的回響式移動設計中可能會遇到的問題。

作者簡介

Phil Dutson 是ICON Health & Fitness 客戶端和移動執行解決方案的架構師。他是Sams Teach Yourself jQuery Mobile in 24 Hours、jQuery, jQuery UI, and jQueryMobile Recipes and Examples、The Android Developer’s Cookbook,2nd Edition 的作者。他熱愛技術的學習和寫作,每次他與兒子玩Ingress 時都向世界傳播啟蒙訊息。

目錄

第 1部分 創建回響式部局
第 1章 內容事項. .................................. 2
構成內容的要素. ......................................3
信息採集.........................................3
信息確認.........................................5
選擇合適的內容. ......................................7
內容性能.........................................7
搜尋引擎最佳化考量..........................10
用戶期望.......................................11
討論內容滑塊. .......................................12
小結. .......14
第 2章 為什麼移動優先....................... 15
瀏覽 Web. ............................................16
從小尺寸開始時的注意事項. ....................19
網站主題.......................................20
網站導航.......................................22
行銷圖像.......................................24
網站搜尋.......................................25
小結. .......27
第 3章 使用柵格................................ 28
選擇柵格. ..................29
Pure.Grids...................................30
Bootstrap.....................................30
Foundation..................................31
Gridpak........................................31
Golden.Grid.System.....................32
Skeleton......................................32
使用回響式柵格. ....................................32
使用自適應柵格. ....................................36
兩全其美...................38
小結. .......38
第 4章 顯示表格數據.......................... 40
定義表格數據. .......................................41
聯繫地址列表. ................................41
發票和收據....................................41
表單..................41
配方和卡片....................................42
電子郵件站點和套用.......................42
使用表格數據. .......................................42
顯示錶單.......................................43
使用表格.......................................47
使用 CSS改變外觀. .......................47
創建多個表格. ................................50
使用下載連結. ................................53
小結. .......56
第 5章 使用測量單位.......................... 57
使用像素. ..................58
使用百分比...........................................60
使用 em和 rem單位.............................63
viewport測量. ......................................65
小結. .......69
第 6章 使用媒體查詢.......................... 70
viewport.meta標籤..............................71
實現突變點...........................................73
使用媒體查詢. ................................74
IE6-8瀏覽器支持. .........................80
設備專屬的媒體查詢..............................80
iPad..................80
iPhone.4S以下. ............................81
iPhone.5和 5S.............................82
Nexus.7(第二代).......................82
Galaxy.S4....................................83
小結. .......83
第 7章 排版設計................................ 84
Web字型. ............................................85
字型格式.......................................85
瀏覽器和設備支持.................................87
設備差異.......................................87
瀏覽器行為....................................89
提供 Web字型..............................91
使用字型服務. .......................................93
Google字型.................................93
Adobe.Typekit..............................94
Fonts.com...................................94
Font.Squirrel................................95
icon字型.............95
小結. .......96
第 8章 改造現有網站.......................... 97
選擇一個合適的移動布局. .......................98
塊級布局.......................................98
回響式布局..................................100
自適應布局..................................102
利用組件開展工作...............................103
導航...........................................103
搜尋...........................................105
內容區域.....................................105
滑塊...........................................106
連結...........................................107
移動化的注意事項...............................108
不要濫用懸停. ..............................108
點擊呼叫.....................................109
模態視窗.....................................109
輸入框........................................111
小結. .....112
第 2部分 使用回響式媒體
第 9章 回響式圖片............................114
圖片應該是回響式的............................115
圖片分發.....................................115
使用 JavaScript的解決方案. ................125
Picturefill組件.. ...........................126
Pixity組件..................................127
小結. .....129
第 10章 回響式視頻. ......................... 130
使用視頻............................................131
分發系統............................................131
Limelight.網路.............................132
Akamai......................................133
Brightcove.................................133
Vimeo........................................134
YouTube....................................135
製作適配移動設備的視頻. .....................136
使用固定比例. ..............................137
使用本地播放器...........................140
使用外掛程式.....................................141
小結. .....142
第 11章 圖像壓縮............................. 143
圖片類型............................................144
JPEG/JPG.................................144
GIF............................................146
PNG..........................................147
WebP........................................148
縮工具............................................150
JPEGmini...................................150
PNGGauntlet.............................151
圖像最佳化工具 Radical..................151
ImageAlpha...............................151
ImageOptim...............................153
TinyPNG....................................153
壓縮結果............................................154
小結. .....155
第 3部分 性能最佳化
第 12章 條件.JavaScript. ................ 158
為什麼使用條件 JavaScript. .................159
滑塊...........................................160
圖片庫........................................160
使用條件 JavaScript...........................162
JavaScript媒體查詢....................163
使用 JavaScript外掛程式..........................168
jRespond...................................168
mediaCheck...............................169
ConditionerJS............................169
小結. .....170
第 13章 Web組件............................ 171
使用 Web組件...................................172
Web組件示例....................................172
音頻元素.....................................172
視頻元素.....................................174
日期輸入.....................................175
使用 DOM處理.. .................................176
Shadow.DOM............................177
使用模板.....................................178
編輯內容.....................................179
Web組件 Polyfill................................180
Polymer.....................................181
Polymer元素..............................181
X-Tag.......................................182
使用 Brick...................................183
小結. .....183
第 14章 設備檢測與伺服器請求. .......... 185
設備檢測............................................186
使用腳本檢測. ..............................186
讀取 user-agent字元串. ..............188
實現設備資料庫...........................190
HTTP頭部. ........................................191
使用客戶端提示. ..................................194
小結. .....196
第 15章 伺服器最佳化. ..........................197
伺服器配置.........................................198
Web.伺服器.......................................198
Apache......................................198
Nginx.........................................199
IIS.199
Tomcat......................................200
NodeJS.....................................200
伺服器外掛程式.........................................201
SPDY........................................201
Cache........................................205
PageSpeed................................207
小結. .....210
第 16章 高性能與開發工具. ................. 211
開發工具............................................212
瀏覽器開發者工具...............................212
Chrome.開發者工具.. ...................212
Firefox.......................................218
Internet.Explorer........................223
構建工具............................................226
Grunt.........................................226
Gulp...........................................228
小結. .....229

相關詞條

熱門詞條

聯絡我們