移動Web手冊

第1章 移動世界
移動價值鏈
運營商
網絡供應商
運營商補貼
補貼還是不補貼
開發者和消費者心理份額
設備供應商和硬件
跟隨一部手機
什麽是智能手機
全球設備市場
尋找合適的統計
智能手機銷售市場份額
操作系統銷售市場份額
操作系統使用量
設備市場的變化
操作系統廠商和軟件
現存操作系統
挑戰者
Web作為操作系統

第2章 瀏覽器
瀏覽器類型
內置瀏覽器
可下載瀏覽器
WebView
代理瀏覽器
優勢：便宜
缺點：沒有客戶端交互
在代理瀏覽器上開發
混合瀏覽器
iOS瀏覽器的情況
其他平台的瀏覽器的情況
渲染引擎
手機上沒有WebKit
用瀏覽器賺錢
統計數據 42

第3章 安卓
結構和目的
差異化
安卓的更新
谷歌服務
安卓瀏覽器
安卓WebKit
Chrome
三星Chrome和其他瀏覽器
當前的內置瀏覽器
可下載的瀏覽器
我應該測試哪些瀏覽器呢

第4章 視口
像素
三個視口
布局視口
視覺視口
理想視口
哪一個視口
縮放
什麽是縮放
頁面縮放
拖放
最小和最大縮放比例
禁止縮放
其他縮放形式
分辨率
物理分辨率
設備像素比
dppx和dpi
meta視口
width
initial—scale
完美的meta視口
太大的元素
布局視口的最小寬度
minimum—scale和maximum—scale
@viewport 和 IE
媒體查詢
媒體類型
語法筆記
寬度和高度
在媒體查詢中使用em
device—width和device—height
device—pixel—ratio和分辨率
轉向
aspect—ratio和device—aspect—ratio
JavaScript
布局視口
視覺視口
理想視口——還是屏幕尺寸
devicePixelRatio
改變meta視口標簽
orientationchange事件
resize事件

第5章 CSS
position：fixed
overflow：auto
overflow—scrolling
background—attachment
尺寸單位vw和vh
：active和：hover
過渡和動畫

第6章 觸摸和指針事件
觸摸事件
touchcancel
手勢事件
其他事件
實例
下拉菜單
拖放
滾動層
事件和交互模式
等價事件
觸摸事件的不同之處
能否合並觸摸事件與鼠標事件
mouseover和pointerover
輸入模式的漸進增強
判斷當前的交互模式
觸摸事件的級聯
輕觸操作
其他動作
Safari：取消事件級聯
Safari：鼠標事件冒泡
剖析Click
300毫秒
同一個像素
剖析觸摸事件
touchList
獲取事件坐標
離開元素
阻止默認行為
實例：水平滾動和垂直滾動
指針事件
事件名和前綴
事件屬性
touch—action

第7章 成為移動Web開發者
理想的設備實驗室
升級
安卓
不要安裝實驗版本
獲得設備
分享設備
測試哪些東西
如何進行測試
時間
准備工作
分批測試
測試流程
克服過時的慣性思維
瀏覽器探測
JavaScript腳本庫
移動網絡
連接速度

第8章 移動Web的未來
HTML5 vs.原生應用
模擬原生應用
網絡連通性和AppCache
安裝到主屏幕
設備API
模擬Web
分享應用

在2013年，我們奇舞團內部就定了一個發展主題，叫作「從前端到終端」。因為「移動化」真的是一個很明顯的趨勢，在移動浪潮下，如果前端工程師們依然選擇守着PC平台的一畝三分地，那麼「前端工程師」這個角色很快就會被歷史所淘汰。

幸運的是，被淘汰這件事情沒有發生，也從來不會發生在「前端工程師」這樣的角色上，因為「前端工程師」是互聯網開發者中最善於學習和最勇於接受變化的一群人。從IE6時代到HTML5時代，從PC時代到移動時代，從頁面制作到全棧時代，前端這個領域時時刻刻都在改變着，唯一不變的就是變化，擁抱變化已經成為印在優秀前端工程師骨子里的特質。學習，了解，不停地學習，不停地了解……前端工程師就是在這樣一個循環過程中不斷見證着技術的發展，創造出越來越人性化的交互和人機界面。

昨天，前端工程師還在為固定布局和流動布局大傷腦筋；今天，前端工程師已經在多元化的終端設備領域里面創造了「彈性布局」，也許明天，隨着一種新的終端設備的問世，又會帶來一種全新的完全顛覆過去的認知的布局方式。

變化，代表着未知，未知，代表着創造，創造則達成成就，前端之道如是，成長即是求道的過程。