手機端網頁設計開發

1、設計手機網站網頁需要用到什麼技術？

智能手機一般都是用html5，著名的框架有jquery mobile等。從手機網站設計來講，需要自適應手機屏幕大小，最好是採用HTML5+CSS3，從行業網站類別上講，網站設計應注意的有背景顏色、網站布局等等。像【Mcmore手機商城】正是使用了以上的設計理念。

2、手機端網站開發主要用到了哪幾項技術？

一般的手機網站基本都是三種技術創建手機網站。建議你先搜並讀下 web app 與native app之爭 這篇文章。

　Web App：

優勢1.開發成本低  2.適配多種移動設備成本低  3.跨平台和終端  4.迭代更新容易5.無需安裝成本

　2.Native App

優勢：1.提供最佳的用戶體驗，最優質的用戶界面，最華麗的交互

 2.針對不同平台提供不同體驗

　  　3.可節省帶寬成本

4.可訪問本地資源

5.盈利模式明朗

3.混合開發模式（跨平台）

它雖然看上去是一個Native App，但只有一個UI WebView，裡面訪問的是一個Web
App，比如街旁網最開始的應用就是包了個客戶端的科，其實裡面是HTML5的網頁，後來才推出真正的原生應用。再徹底一點的，如掌上百度和淘寶客戶端Android版，走的也是Hybrid
App的路線，不過掌上百度裡面封裝的不是WebView，而是自己的瀏覽內核，所以體驗上更像客戶端，更高效。

目前,手機操作系統所佔市場份額排名：android,ios,RM,microsoft,symn。

二、開發所用的技術：

混合開發：phonegap。

開源，跨平台，兼容性強，在ios,blackberry,android都可運行。

採用的技術：css3,javascript,html5。

原生態(標准開發技術)：

android:java

ios:object C

symn:C++

3、有手機版的網頁製作軟體嗎

有啊，quickwap:
QuickWAP 是一款以WAP協議為基礎開發的輔助ASP+XHTML MP語言或ASP+WML編寫WAP網頁程序的ActiveX組件。它解決了WAP開發中所遇到的常見問題，並且給出了完善的解決方案，同時全力支持Microsoft SQL Server2000和Microsoft Access2000以上版本資料庫，是開發功能強大的動態WAP網站不可多得的輔助軟體。
使用QuickWAP組件編寫WAP網頁程序，不僅運行穩定，處理速度也會比相同功能的ASP+XHTml ML網頁程序要快很多倍，功能容易得到擴展，而且支持QuickWAP+ASP+WML或QuickWAP+ASP+XHTML一起使用進行WAP程序開發。

不過WAP馬上要過時了，現在3G快成熟了，手機也支持WWW了。

4、手機html5前端開發用什麼框架

jquery mobile和bootstrap都是較好的框架。為了使用便利，下文列舉了目前最強大應用最廣泛的幾款前端開發框架。

1. Bootstrap
Boostrap絕對是目前最流行用得最廣泛的一款框架。它是一套優美，直觀並且給力的web設計工具包，可以用來開發跨瀏覽器兼容並且美觀大氣的頁面。它提供了很多流行的樣式簡潔的UI組件，柵格系統以及一些常用的JavaScript插件。

2. Fbootstrapp
Fbootstrapp基於Bootstrap並且提供了跟Facebook iframe apps和設計相同的功能。包含用於所有標准組件的基本的CSS和HTML，包括排版、表單、按鈕、表格、柵格、導航等等，風格與Facebook類似。

3. BootMetro
BootMetro框架的靈感來自於Metro UI CSS，基於Bootstrap 框架構建，用於創建Windows 8 的Metro風格的網站。它包括所有Bootstrap的功能，並添加了幾個額外的功能，比如頁面平鋪，應用程序欄等等。

4. Kickstrap
Kickstrap是Bootstrap的一個變體。它基於Bootstrap，並在它的基礎上添加了許多app，主題以及附加功能。這使得這個框架可以單獨地用於構建網站，而不需要額外安裝什麼。你需要做的僅僅是把它放到你的網站上，然後用就可以了。

5. Foundation
Foundation 是一款強大的，功能豐富的並且支持響應式布局的前端開發框架，你可以通過Foundation快速創建原型，利用它所包含的大量布局框架，元素以及最優範例快速創建在各種設備上可以正常運行的網站以及app。Foundation在構建的時候秉承移動優先的策略，它擁有大量實用的語義化功能，並且使用Zepto類庫來取代jQuery，這樣可以帶來更好的用戶體驗，並且提高運行的速度。

6. GroundworkCSS
GroundworkCSS 是前端框架家族裡面新添的一款小清新框架。它是基於Sass和Compass的一個高級響應式的HTML5，CSS以及JavaScript工具包，可以用於快速創建原型並且建立在各種瀏覽設備上可以正常工作的網站和app。

7. Gumby
Gumby 是一款基於Sass和Compass的簡單靈活並且穩定的前端開發框架。
它的流式-固定布局（fluid-fixed layout）可以根據桌面端以及移動設備的解析度自動優化要呈現的網頁內容。它支持多種網格布局，包括多列混雜的嵌套模式。Gumby提供兩套PSD的模板，方便你在12列和16列的網格系統上進行設計。

8. HTML KickStart
HTML Kickstart 是一款可以用來方便創建任何布局的集合HTML5，CSS和jQuery的工具包。它提供了干凈，符合標准以及跨瀏覽器兼容的代碼。

9. IVORY
IVORY 是一款輕量，簡單但是強大的前端框架，可以用於320到1200像素寬度的響應式布局。它基於12列的響應式網格布局，包含表格，按鈕，表格，分頁，撥動開關，工具提示，手風琴，選項卡等網站中常用的組件和樣式。

10.Kube
最後，如果你的新項目需要一款實在的，不需要復雜的額外功能組件的，足夠簡單的框架，那麼 Kube 將會是你正確的選擇。Kube是一款最小化的，支持響應式的前端框架，它沒有強加的樣式設計，因此給了你充分的自由來開發自己的樣式表。它提供了一些web元素的基本樣式，比如網格，表單，排版，表格，按鈕，導航，鏈接以及圖片等等。

5、手機端網頁設計尺寸多少

iPhone手機網頁的設計尺寸

iPhone5尺寸是640x1136px解析度是326PPI
iPhone4和iPhone4S尺寸是640x960px解析度是326PPI
iPhone和iPodTouch第一代、第二代、第三代尺寸是320x480px解析度是163PPI

安卓網頁的設計尺寸

320dp：一個普通的手機屏幕（240X320，320×480，480X800）
480dp：一個中間平板電腦像（480×800）
600dp：7寸平板電腦（600×1024）
720dp：10寸平板電腦（720×1280，800×1280）

ipad網頁的設計尺寸

iPad第三代第四代尺寸是2048x1536px解析度是264PPI
iPad第一代第二代尺寸是1024x768px解析度是132PPI
iPad Mini尺寸是1024x768px解析度是163PPI

6、請問移動端網頁開發怎麼開發？

下面是我從網上收集整理的wap2.0手機網站開發需要注意的7個問題：
手機網頁編碼需要遵循什麼規范？
遵循XHTML Mobile Profile規范（WAP-277-XHTMLMP-20011029-a.pdf），簡稱為XHTML MP，也就是通常說的WAP2.0規范。 XHTMLMP是為不支持XHTML的全部特性且資源有限的客戶端所設計的。它以XHTML Basic為基礎，加入了一些來自XHTML 1.0的元素和屬性。這些內容包括一些其他元素和對內部樣式表的支持。和XHTML Basic相同，XHTML MP是嚴格的XHTML 1.0子集。
網頁文檔推薦使用擴展名？
推薦命名為xhtml，按WAP2.0的規范標准寫成html/htm等也是可以的。但少數手機對html支持的不好。
為什麼現今大多數的網站一行字數上限為14個中文字元？
由於手持設備的特殊性，其頁面中實際文字大小未必是我們在CSS中設定的文字大小，尤其是在第三方瀏覽器中。例如Nokia5310，其內置瀏覽器 頁面內文字大小與CSS設定相符，但是第三方瀏覽器OperaMini與UCWEB頁面內文字大小卻大於CSS設定。經測試，其文本大概在16px左右。 假如屏幕解析度寬度為240px，去除外邊距，那麼其一行顯示14個字以內，是比較保險（避免文本換行）的做法。
使用WCSS還是CSS?
WCSS (WAP Cascading Style Sheet 或稱 WAP CSS)是移動版本的CSS樣式表。它是CSS2的一個子集，去掉了一些不適於移動互聯網特性的屬性，並加入一些具有WAP特性的擴展（如-wap-input-format/-wap-input-required/display:-wap-marquee等）。 需要留意的是，這些特殊的屬性擴展並不是很實用，所以在實際的項目開發當中，不推薦使用WCSS特有的屬性。
避免空值屬性
如果屬性值為空，在web頁面中是完全沒有問題的，但是在大部分手機網頁上會報錯。
網頁大小限制
建議低版本頁面不超過15k，高版本頁面不超過60k。
用手機模擬器和第三方手機瀏覽器的在線模擬器來測試頁面是不是靠譜？
有條件的話，我們當然建議在手機實體上進行測試，因為目標客戶群的手機設備總是在不斷變化的，這些手機模擬器通常不能完全正確的模擬頁面在手機上的顯示情況，比如圖片色彩，頁面大小限制等就很難再模擬器上測試出來。當然，一些第三方手機瀏覽器的在線模擬器還是可以進行測試的，第三方瀏覽器相對來說受手機設備的影響較小。

7、html5如何開發手機端頁面？誰有好的教程

web方式的手機應用那，我理解一種是純Web的，其實就是設計在手機瀏覽器裡面用的Web應用，這種應用，以前是WAP方式。現在智能手機流行以後，手機計算能力增強，所以在手機裡面開始跑HTML頁面，而且很多手機瀏覽器比較激進，開始支持HTML5，這樣的話，其實你可以理解為在手機屏幕大小的屏幕上設計HTML5頁面應用，由於屏幕大小不一樣的原因，有個響應式設計的問題，還有一種叫hybrid（混合動力）應用，這種東西，外表看來是獨立的手機APP，但裡面的主界面其實是用Web頁面實現的，在外面套個手機瀏覽器框架的殼兒，就成了手機APP應用，這種東西有很多框架可用，你在框架下設計頁面，然後框架把你頁面打包成手機應用，著名的框架比如：PhoneGap。

8、手機端的頁面怎麼開發，和web html有區別嗎？

二者是沒有區別的。
手機端的網頁開發手段很多，目前html5發展不是很平衡，導致各大瀏覽器對h5的支持不竟如人意。但是出現了令人驚喜的地方，其中最令人激動的就是增加了@media屬性(屬於css3，在此不對html5和css3做嚴格區分，實則二者是兩個不同的技術)。自此，網頁製作可以根據用戶所持設備的像素寬度來辨明是否是在使用手機，從而在用戶使用移動設備的時候下載移動頁面。但是，也有一定的不足，就是現階段手機標准很不規范，各大廠商為了賺錢，解析度已經發展到不可理喻的地步了。
所以，目前現階段的手機網頁開發，主要的手段是幾種：
其一，在meta標簽裡面加入對像素寬度的限制語句，然後再通過css的相對寬度來實現。但這樣界面會出現亂排的現象，所以這種手段幾乎沒人用。
其二，這種方法最為普遍。網站頁面分為兩個，分別面向電腦和手機，用戶請求頁面的時候，通過頭部信息來判斷是否為電腦瀏覽器，再針對不同的請求發送不同的網頁文件。這種網頁一般不是靜態。
開發手機網頁的時候，推薦你使用chrome的開發者工具就行了，chrome開發者工具可以模擬手機頁面開發，裡面還模擬了很多的設備，從而便於用戶開發。