整理自網絡
"WAP網頁設計" 和 "移動設備網頁設計"
wap網頁叫法的由來起源於wap無線協議，這個協議是由WML語言描述Internet的內容，最後呈現在無線網絡上（GSM,GPRS,CDMA）。
以前設備的內存、計算能力、屏幕分辨率不足以支持HTML，所以產生了WML無線標記語言。
現在的移動設備都可以支持HTML了，所以已經沒有人再用WML組織WAP站點了，一般都是HTML+CSS。
但是還有很多人管移動設備網頁開發叫WAP開發。這種說法是錯的。
所以， WAP開發是另一種技術，使用WML無線標記語言，非常老舊，已經廢棄。現在都叫web app
小屏幕移動設備開發原則
針對於小屏幕移動設備的界面設計，在某些指定任務的界面，應優先於讓用戶關注當前任務，而不是應用程序本身。
手機瀏覽器內核
Trident（微軟，主要用在WP7系統內置瀏覽器）
Presto（Opera，主要爲Opera Mobile瀏覽器、OperaMini瀏覽器，速度最快，處理JS腳本最兼容）
Webkit（Android原生瀏覽器、蘋果safari、谷歌的Chrome android4.0都是使用webkit，速度快）
Gecko（火狐的，消耗內存大）
全球就這四個原生內核！它們能做pc的瀏覽器，也能做手機瀏覽器。
國內都基於webkit開發，我們最主要關注的內核！
UC的U3內核、QQ的X5內核、華爲的T9內均基於Webkit！
要關注你產品的羣體用什麼手機，想想這種手機用的內核。
支持H5的程度是手機瀏覽器好壞的其一標準。
如何製作移動網站
自適應網頁設計，讓同一個網頁代碼，能夠在不同設備上都能有更好的瀏覽體驗，這樣，移動設備可以通過原網址瀏覽桌面站點，看到的卻是自動適應屏幕大小後的網站。儘管這種方式使得域名統一了，但如果對於結構複雜的網站來說，代碼設計具有相當高的難度。（自適應的網頁使用的是同一個網址，不會出現重定向）
移動網站是按照移動端的設計規則來重新建立一個移動網站，儘管內容和桌面網站一樣（也可以與桌面網站不同），但卻有兩個不同的網址。通常的移動網站使用子域名的方式實現。桌面網站的網址檢測到移動設備後自動重定向到移動網站頁面。
如何將桌面網站修改成移動網站（自適應網站）
1.在HTML頭部增加viewport標籤（控制顯示尺寸、是否允許縮放、初始比例、上下限等）
2.MobileOptimized標籤（微軟爲IE Mobile版設置的定義寬度標記）
3.HandeldFriendly標籤（是否對手持設備友好，只有true或false）
4.在css文件尾部增加針對不同屏幕分辨率的規則，佈局使用相對寬度，隱藏側欄（就是使用了媒體查詢）
經過以上四步，半小時的開發量就可以將一般的桌面網站變爲自適應網站。
示例代碼（醫小護wap的head）
1. <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"
/>
viewport定義手機視口content=width=device-width 瀏覽器頁面的寬度等於設備的寬度initial-scale=1.0 初始的縮放比例minium-scale=1.0 頁面最小也要和設備的寬度一樣（minium-scale=0.5是壓縮至設備寬度的一半）maximum-scale=1.0 頁面最大放大也只能和設備一樣寬度（maximum-scale=3是最多放大至設備寬度的3倍）user-scalable=no 禁止用戶縮放（這個html是微信中的，所以禁止了，一般不禁止）另：content="initial-scale=2.0" 是將頁面放大兩倍。
<meta name="format-detection" content="telephone=no" />
手機號碼不被顯示爲撥號鏈接
IOS設備對meta定義的私有屬性：
<meta name="apple-mobile-web-app-status-bar-style" content="black" >
在web app應用下狀態條（屏幕頂部條）的顏色，還可定義爲black-translucent(灰色半透明)
<meta name="apple-mobile-web-app-capable" content="yes" >
網站開啓對web app程序的支持
2、3、4例子參考下面那道問題
在移動網站中需要添加哪幾個Meta標籤？
viewport，幾乎已經是公認的標準了，最初是由蘋果公司創建，用於iphone上面的safari
例子：<meta name="viewport" content="width=device-width, initial-scale=1.0" />
HandheldFriendly，這個標籤和下面介紹的MobileOptimized是功能機時代的事實上標籤，它用來標示移動站點。
例子：<meta name="HandheldFriendly" content="true" />
MobileOptimized，這是windows專有的meta標籤，識別移動內容的一種方法，缺點是需要給出特定的寬
例子：<meta name="MobileOptimized" content="320" />
HandheldFriendly和MobileOptimized這兩個標籤的支持情況未知，但是viewport是必須的！