❶ h5開發和原生app開發以及web開發有什麼區別呢
一、開發方面
原生App
⊙ 每一種移動操作系統都需要獨立的開發項目【點擊查看APP開發的真正報價】
⊙ 每種平台都需要獨立的開發語言。Java(Android), Objective-C(iOS)以及Visual C++(Windows Mobile)等等
⊙ 需要使用各自的軟體開發包，開發工具以及各自的控制項
移動Web App
⊙ 因為運行在移動設備的瀏覽器上，所以只需要一個開發項目
⊙ 這種應用可以使用HTML5,CSS3以及JavaScript以及伺服器端語言來完成（PHP,Ruby on Rails,Python）
⊙ 這里可沒有標準的SDK，基本任意選擇別忘了有一些跨平台的開發工具，比如PhoneGap, Sencha Touch 2，APPcan以及Appcelerator Titanium等等。
二、能力方面
原生App
⊙ 能夠與移動硬體設備的底層功能，比如個人信息，攝像頭以及重力加速器等等
移動Web App
⊙ 只能使用有限的移動硬體設備功能。
三、獲取方法
原生App
⊙ 直接下載到設備
⊙ 以獨立的應用程序運行(並不需要瀏覽器)
⊙ 用戶必須手動去下載並安裝這些原生App
⊙ 有一些商店與賣場來幫助用戶尋找你的App，目前app市場不計其數
移動Web App
⊙ 從移動設備上的瀏覽器訪問
⊙ 不需要安裝額外的軟體
⊙ 軟體更新只需要伺服器就夠了
⊙ 因為現在沒有什麼商品或賣場提供這種App，所以如何搜索這些移動Web App相當不簡單。四、版本控制
原生App
⊙ 用戶可以自由地選擇是否更新軟體版本，所以會出現不同用戶同時使用不同版本的情況移動Web App
⊙ 所有的用戶都是用同樣的版本五、優勢
原生App⊙ 比移動Web App運行快
⊙ 一些商店與賣場會幫助用戶尋找原生App
⊙ 官方賣場的應用審核流程會保證讓用戶得到高質量以及安全的App
⊙ 官方會發布很多開發工具或者人工支持來幫助你的開發移動Web App
⊙ 跨平台開發
⊙ 用戶不需要去賣場來下載安裝App
⊙ 任何時候都可以發布App，因為根本不需要官方賣場的審核
⊙ 如果你已經有了一個Web App，你可以使用 responsive web design來輔助改進六、缺陷
原生App
⊙ 開發成本高，尤其是當需要多種移動設備來測試時
⊙ 因為是不同的開發語言，所以開發，維護成本也高
⊙ 因為用戶使用的App版本不同，所以你維護起來很困難
⊙ 官方賣場審核流程復雜且慢，會嚴重影響你的發布進程移動Web App
⊙ 無法使用很多移動硬體設備的獨特功能
⊙ 要同時支持多種移動設備的瀏覽器讓開發維護的成本也不低
⊙ 如果用戶使用更多的新型瀏覽器，那問題就更不好處理了
⊙ 對於用戶來說，這種App很難被用戶發現。
想要了解更多有關APP開發的相關信息，推薦咨詢豬八戒網。豬八戒網有千萬服務商為企業、公共機構和個人提供定製化的解決方案，將創意、智慧、技能轉化為商業價值和社會價值。2011年豬八戒網獲得IDG投資並被評選為中國2011年度「最佳商業模式十強」企業；專業性值的信賴。
❷ 如何測試html5移動web開發
1、jsp就不用了
2、html5與開發平台無關，記事本也行
3、與平常網站一樣的發布，手機就可以訪問，手機網站一般域名為：m.xxx.com
如：m.dell-brand.com
4、注意一下：
1）html上加入<meta name="viewport" content=" initial-scale=1.0,user-scalable=no" />
發確保網頁的效果
2）
加上以下語句可使網頁在蘋果設備上運行更好
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
3）加入這句話可以定義iphone的添加到主屏幕的圖標
<link rel="apple-touch-icon" href="/images/logo.png" />
❸ html5開發移動web網站的問題我想用html5做一個類似電子商務的手機網站，主要有一下幾點疑問：
1、jsp就不用了
2、html5與開發平台無關，記事本也行
3、與平常網站一樣的發布，手機就可以訪問，手機網站一般域名為：m.xxx.com
如：m.dell-brand.com
4、注意一下：
1）html上加入<meta name="viewport" content=" initial-scale=1.0,user-scalable=no" />
發確保網頁的效果
2）
加上以下語句可使網頁在蘋果設備上運行更好
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
3）加入這句話可以定義iphone的添加到主屏幕的圖標
<link rel="apple-touch-icon" href="/images/logo.png" />
❹ 基於HTML5的移動Web開發支持哪些新功能
HTML5的設計目的是為了在移動設備上支持多媒體。新的語法特徵被引進以支持這一點，如video、audio和canvas 標記。HTML5還引進了新的功能，可以真正改變用戶與文檔的交互方式，包括：epub360 等H5編輯工具都是圍繞這個標准設計的：
· 新的解析規則增強了靈活性
· 新屬性
· 淘汰過時的或冗餘的屬性
· 一個HTML5文檔到另一個文檔間的拖放功能
· 離線編輯
· 信息傳遞的增強
· 詳細的解析規則
· 多用途互聯網郵件擴展（MIME）和協議處理程序注冊
· 在SQL資料庫中存儲數據的通用標准（Web SQL）
HTML5在2007年被萬維網聯盟(W3C)新的工作組採用。這個工作組在2008年1月發布了HTML 5的首個公開草案。眼下，HTML5處於「呼籲審查」狀態，W3C預期它將在2014年年底達到其最終狀態。
特性
HTML5賦予網頁更好的意義和結構。更加豐富的標簽將隨著對RDFa的，微數據與微格式等方面的支持，構建對程序、對用戶都更有價值的數據驅動的Web。
本地存儲特性（Class: OFFLINE & STORAGE）
基於HTML5開發的網頁APP擁有更短的啟動時間，更快的聯網速度，這些全得益於HTML5 APP Cache，以及本地存儲功能。Indexed DB（html5本地存儲最重要的技術之一）和API說明文檔。
設備兼容特性 (Class: DEVICE ACCESS)
從Geolocation功能的API文檔公開以來，HTML5為網頁應用開發者們提供了更多功能上的優化選擇，帶來了更多體驗功能的優勢。HTML5提供了前所未有的數據與應用接入開放介面。使外部應用可以直接與瀏覽器內部的數據直接相連，例如視頻影音可直接與microphones及攝像頭相聯。
連接特性（Class: CONNECTIVITY）
更有效的連接工作效率，使得基於頁面的實時聊天，更快速的網頁游戲體驗，更優化的在線交流得到了實現。HTML5擁有更有效的伺服器推送技術，Server-Sent Event和WebSockets就是其中的兩個特性，這兩個特性能夠幫助我們實現伺服器將數據「推送」到客戶端的功能。
網頁多媒體特性(Class: MULTIMEDIA)
支持網頁端的Audio、Video等多媒體功能， 與網站自帶的APPS，攝像頭，影音功能相得益彰。
三維、圖形及特效特性（Class: 3D, Graphics & Effects）
基於SVG、Canvas、WebGL及CSS3的3D功能，用戶會驚嘆於在瀏覽器中，所呈現的驚人視覺效果。
性能與集成特性（Class: Performance & Integration）
沒有用戶會永遠等待你的Loading——HTML5會通過XMLHttpRequest2等技術，解決以前的跨域等問題，幫助您的Web應用和網站在多樣化的環境中更快速的工作。
CSS3特性(Class: CSS3)
在不犧牲性能和語義結構的前提下，CSS3中提供了更多的風格和更強的效果。此外，較之以前的Web排版，Web的開放字體格式（WOFF）也提供了更高的靈活性和控制性。
❺ 淺淡HTML5移動Web開發(二)
3、HTML5新增標簽
在html5中新增量很多標簽，加強連html標簽的語義化，如等等，這些標簽都各自有自己大意義，不再僅僅是span和div，雖然html4中也有很多語義化的標簽，但是不如html5豐富。除了這些新增的標簽，還有一些此前就有的標簽，但是類別新增，最具代表性的就是表單form，而本文要介紹的就是form。
以上除了type=text外，其他的都是新增的，如果瀏覽器支持這些屬性的話，就會自動調用相應組件，如在移動設備中type=number/email/text時，瀏覽器會調用不同版面的鍵盤，這樣加快用戶的輸入，體驗也更美好，如下
如果是type=range則會出現這樣的組件，供選擇范圍，如果是type=color則會出現顏色選擇器，如果是type=date則出現日期選擇器，如果是type=search,則在輸入時候出現一個一鍵清除的按鈕，點擊輸入的文字全部清除
另外，除了input的type新增量類別，還增加一些很實用的屬性，如placeholder，我們知道，input中我們常常會默認一些文案，當用戶輸入的時候會自動清除，html5之前我們是靠javascript實現的，但是有了html5，我們可以輕松實現，只需要placeholder=”默認文案”。
4、選擇符
選擇符大致分為元素選擇符、關系選擇符、屬性選擇符、偽類選擇符、偽對象選擇符，在PC端，我們用的最多的就是元素選擇符、關系選擇符和屬性選擇符如
div{……}、div.class{……}、div#id{……}、div span{……}、div[class=”classname”]{}
偽類選擇符和偽對象選擇符有很多，靈活運用可以減少很多不必要的代碼。如E:nth-child(n){ …… }、E:nth-of-type(n){ …… }、E:disabled{ …… }、E:empty{ …… }、E:first-letter/E::first-letter{ …… }、E:first-line/E::first-line{ …… }、E:before/E::before{ ……}、E:after/E::after{…… }、E::selection{ …… }等，這里不細說。
以上是環球青藤小編為考生整理的HTML5移動Web開發的相關內容，希望對大家有幫助!更多HTML5相關內容盡在本平台，記得及時查看哦!
❻ 移動前端開發和web前端開發有什麼區別
移動前端開發和 Web 前端開發的區別是:
1、前端是相對比較大的概念，一般是指用戶能夠看到、直接接觸的界面都算是前端，比如iOS界面，安卓界面，網頁界面，PC/Mac桌面軟體的界面。最常見的是Web前端，也就是針對於網頁端開發的工作。
2、Web App即Web application，也就是以瀏覽器作為客戶端的軟體。例如，用桌面客戶端來收發郵件，但也可以直接用瀏覽器登陸gmail或者QQ郵箱，直接使用網頁版的軟體來使用。總之就是使用網頁版代替本地軟體。
Mobile Web App就是在手機端打開的Web App。例如Gmail的移動端軟體
3、目前，移動客戶端的開發主要包括三種類型：
Native App（原生APP）：也就是完全使用移動設備系統語言寫的客戶端。iOS系統就是使用Objective-C語言來編寫本地應用，也可以使用蘋果於2014年蘋果開發者大會上發布的SWIFT語言；Android平台就是使用Java語言來開發。原生APP就是從界面到交互都是使用官方標准語言來編寫，效率和穩定性都是最好的，但欠缺靈活性。
Web App：這個就是在移動瀏覽器里打開的，使用Web前端開發語言HTML CSS JavaScript來開發的，基本上就是個網頁，
Hybrid App：主要使用HTML5實現。一般使用Native語言實現一個容器，然後使用HTML CSS JS來實現用戶界面和交互。這樣方式既克服了Web App容器暴露偏底層的介面這樣的問題，同時比起原生的開發靈活性要高。這樣就更新可以更方便快捷，也不依賴於市場。例如，豌豆莢其實是個PC端的hybrid app 。
對於以上三種開發方式的比較和分析搜索引擎裡面有太多的內容了，這里也就不再贅述了。
4、移動端網頁布局方法與pc的差異。
主要是css方面，外加如何做到同一url，不同客戶端展現不一致的做法，俗稱pc和mobile都兼容。還有會說一下rem的相關用法和一段比較經典的rem.js
最後總結一下：
其實這兩者最顯著的區別就是，web app是不依賴於具體的設備的，通用性較強，只要手機或PC有相應內核的瀏覽器就基本OK。而mobile的app則依賴於具體的設備，一旦更換設備，需要重新下載才能繼續使用。
移動前端開發 主要來說的是Native Client的開發Android為Java，iOS為Objective-C，然後么HTML5應用號稱跨平台其實差異很大。
Web前端開發么基本上就是HTML JavaScript CSS，不過有些人把Servelt/JSP, PHP,Ruby,Python,C#之類的只要關繫到頁面的也叫做Web前端開發。
app是應用，每個操作系統有專門的開發工具和語言
web是網頁，使用html+css+js，有工具可以生成轉化為app，不過效果一般
❼ 如何用html5構建移動端的webapp
H5e教育html5開發為您解答：
移動web在當今的發展速度是一日千里，作為移動領域的門外漢，在這段時間的接觸後，發現前端開發這一塊做一個小小的總結。
1.四大瀏覽器內核
1.Trident (IE瀏覽器) :因為在早期IE佔有大量的市場份額，所以以前有很多網頁是根據這個Trident的標准來編寫的，但是實際上這個內核對真正的網頁標准支持不是很好，同時存在許多安全Bug。
2.Gecko:( FireFox )優點就是功能強大、豐富，可以支持很多復雜網頁效果和瀏覽器擴展介面，缺點是消耗很多的資源，比如內存。
3.Webkit: ( Chrome/ Safari / UC )優點就是Webkit擁有清晰的源碼結構、極快的渲染速度，缺點是對網頁代碼的兼容性較低，會使一些編寫不標準的網頁無法正確顯示。
4.Presto: ( 歐朋 ) Presto內核被稱為公認的瀏覽網頁速度最快的內核，同時也是處理JS腳本最兼容的內核，能在Windows、Mac及Linux操作系統下完美運行。
移動端開發主要對象是手持設備，其中絕大部分是IOS和Android系統，基於Webkit內核，可使用Chrome瀏覽器調試即可。
2.手機瀏覽器
瀏覽器已經逐漸從傳統桌面轉向手機端，競爭也越來越激烈。目前國內市場主流的手機瀏覽器：UC、網路、歐朋、QQ、海豚、safari、Chrome，這些瀏覽器都是基於webkit內核的，兼容性方面不存在問題，同時對html5和css3的支持很好，所以，大膽地應用html5和css3技術吧。
在開始編寫webapp時，前端工程師使用HTML5，而放棄HTML4，因為HTML5可以實現一些HTML4中無法實現的豐富的WEB應用程序 的體驗，可以減少開發者很多的工作量，當然了你決定使用HTML5前，一定要對此非常熟悉，要知道HTML5的新標簽的作用。比如定義一塊內容或文章區域 可使用section標簽，定義導航條或選項卡可以直接使用nav標簽等等。
3.終端解析度
手機解析度比PC解析度要龐雜得多，各種解析度有木有？大小差距那麼大有木有？這在一定程度上給頁面製作帶來了不小的麻煩。所以針對這樣的因素，必須有充分的考慮。考慮到瀏覽器自適應，需要設計和製作完成各種不同的方法。
1) 市場上主流手機生產商的產品解析度。經過調研發現，目前主流的手機解析度為：480*800像素、320*480像素，而1280*720像素（720P）會是接下來的趨勢。這些都是很粗略的統計，要有精確的數據需要花費不少的精力，那是數據分析人員的工作。
2) 項目目標群所持設備的解析度。項目目標群即用戶，用戶擁有什麼樣的手機解析度，從一定程度上來說比第一點來得更加重要，它決定著項目開發的方向。
4.響應式web開發
在編寫CSS時，我不建議前端工程師把容器（不管是外層容器還是內層）的寬度定死。為達到適配各種手持設備，我建議前端工程師使用自適應布局模式（支付 寶 採用了自適應布局模式），因為這樣做可以讓你的頁面在ipad、itouch、ipod、iphone、android、web safarik、chrome都能夠正常的顯示，你無需再次考慮設備的解析度。
響應式web開發不是一項開創性的技術變革，簡單地說，響應式web設計採用了媒體查詢、流式布局、液態圖片三項技術，把它們組合在一起來製作頁面，使得頁面不只在傳統桌面，在平板電腦和手機上，各種不同的解析度都能夠完美顯示。而要做到這點，我覺得不難，請繼續往下：
1) 准備工作：
a) 插件安裝：window resize。您可以通過下載安裝谷歌瀏覽器插件，安裝成功後，當您調整瀏覽器窗口時，在瀏覽器右下角會有灰度提示當前窗口和類似於手機視圖的大小提示。
b) 編輯器安裝：Hbulder或Webstorm
c) 弄清視圖和屏幕的區別。視圖是瀏覽器的內容顯示區域，屏幕是設備的物理顯示區域。比如視圖寬度我們一般用width表示，而屏幕寬度是用device-width來表示。相信做過手機頁面的童鞋都經常見過這段代碼：
<meta name="viewport" content="width=device-width,initial-scale=1.0">
其中width=device-width就是說把頁面寬度設置成和屏幕寬度一樣。
d) 響應式設計創意網站收集 。這里有很多響應式Web設計的網站，供您參考和學習。
2) 征途ING：
e) 響應式web設計之媒體查詢：
為了減少http請求，我想在css樣式表裡進行媒體查詢會是個不錯的選擇，而不是在頁面head部分使用link進行載入。樣式表裡的媒體查詢格式為：
@media screen and (max-width:960px){}
大括弧內部書寫樣式。該語句相當於判斷語句，有兩個條件，一個是視口寬度最大不超過960px，screen代表顯示屏，這兩個條件都具備了，就調用大括弧內的樣式。
f) 響應式web設計之流式布局：
流式布局以百分比進行布局。最重要是時刻關注元素的父級層，所有的元素都是以父級層為基準。流式布局的應用是為了和媒體查詢完美地結合，形成平滑的布局變 化跳轉效果。一般而言，media里的樣式多以width、padding、margin、font-size、line-height這些為主。
g) 響應式web設計之液態圖片：
要實現液態圖片，只需加入如下代碼：img{max-width:100%;}
web移動頭部書寫
1、首先我們來看看webkit內核中的一些私有的meta標簽，這些meta標簽在開發webapp時起到非常重要的作用
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
這個meta標簽表示：強制讓文檔的寬度與設備的寬度保持1:1，並且文檔最大的寬度比例是1.0，且不允許用戶點擊屏幕放大瀏覽；
<meta content="yes」 name=" apple-mobile-web-app-capable" />
meta標簽是iphone設備中的safari私有meta標簽，它表示：允許全屏模式瀏覽；
<meta content="black" name=" apple-mobile-web-app-status-bar-style" />
meta標簽也是iphone的私有標簽，它指定的iphone中safari頂端的狀態條的樣式；
<meta content="telephone=no" name="format-detection" />
meta標簽表示：告訴設備忽略將頁面中的數字識別為電話號碼
❽ 移動web開發和html5開發有什麼不同
總體上應該一樣，技術體系都差不多。不過pc需要兼容的瀏覽器更多些,mobile下andorid,ios都是基於webkit，所以相對好些。
移動前端開發可分為：
1、手機網頁開發。這部分跟web前端開發差別不大，使用的技術都是html+css+js。區別為手機瀏覽器是webkit的天下，pc端是IE的天下。手機網頁可以理解成pc網頁的縮小版加一些觸摸特性。因為是在瀏覽器中進行的網頁開發，所有最終代碼具有跨系統平台的特性。
2、app前端開發。使用的技術也是html+css+js，但它需要基於PhoneGap等開發平台調用手機核心功能介面（包括地理定位，加速器，聯系人，聲音和振動等）模擬native app，這部分跟web前端開發完全不同。最終代碼發布要分別編譯成各系統平台的app。
❾ 主流HTML5移動web開發框架
1.H5 做移動開發也分兩種，一種就是正常的網頁，一種是封裝的成 App 在手機上跑的。下面我只大致介紹一下又哪些框架，具體的特性不是三兩句能說完的，題主可以自行搜索相關資料。 後者比較知名的框架就是 PhoneGap、MUI 等等了。
2.而前者具體分的話還分 CSS 框架和 JS 框架。樣式框架有很多了，常見的有 jQuery Mobile、Bootstrap、Kendo UI、Amaze UI 等等。JS 框架一般是 AngularJS、Backbone、ReactJS 等等，但說實話這些 JS 框架都比較繁重，一般是為比較復雜的場景設計的，如果你的頁面需求很簡單，那麼大可以不用它們只用樣式框架就好了。