本文作于一年前容客，囿于本人知識領(lǐng)域范圍秕铛，下文中的“web頁面”一詞用詞不準確，準確表述為“H5頁面”缩挑，請讀者閱讀過程中但两，自行腦換。
用了這么多App供置，自己也做了App產(chǎn)品谨湘，注意到通過web頁面在App里的正確應(yīng)用可以輕松解決很多產(chǎn)品運營方面的問題，總結(jié)一下分享給大家芥丧。不是什么高技術(shù)含量的東西紧阔，貽笑大方了。
App里之所以用到web頁面续担，多是因為這個頁面上的內(nèi)容和結(jié)構(gòu)都是屬于高頻變化的擅耽，使用Native App頁面來實現(xiàn)的話則需要不斷發(fā)布新版本才能實現(xiàn)，這一點不現(xiàn)實物遇。而App都是可以調(diào)用原生系統(tǒng)瀏覽器或者集成到App里的瀏覽服務(wù)乖仇，因此屬于高頻變化的內(nèi)容和結(jié)構(gòu)通過web頁面來表現(xiàn)，再通過App來調(diào)用web頁面就可以輕松解決這個問題了询兴。而且乃沙，經(jīng)過優(yōu)化專門適配移動端的web界面已經(jīng)很接近Native App的頁面了，很多時候我都壓根沒有感受出來诗舰，也因此web頁面在App上被廣泛應(yīng)用警儒。
屬于高頻變化的內(nèi)容和結(jié)構(gòu)的頁面多來自產(chǎn)品運營，一般包含：運營活動頁面/廣告/應(yīng)用內(nèi)推送消息等眶根。
那蜀铲，在哪些場景下web頁面會在App里被使用呢边琉？
一，App啟動頁
說起App啟動頁蝙茶，這是一個 Caodan的故事艺骂，因為在大量的App的啟動頁上已經(jīng)做起了廣告了，而更甚得是隆夯，還有App做了兩個不一樣的啟動頁連著顯示钳恕，真挺牛B的[槍斃][槍斃]。啟動頁作為展示App品牌區(qū)域極好的手段蹄衷，并且優(yōu)質(zhì)的啟動頁內(nèi)容會不斷地在用戶內(nèi)心里加以深化忧额。每天我們看到的App不斷變化的啟動頁內(nèi)容都是通過web來實現(xiàn)的，很多人都沒有感知到那是一個web頁面愧口。圣誕節(jié)的時候睦番，打開蝦米音樂時，啟動頁內(nèi)容是帶圣誕樹帶雪一個房子耍属，現(xiàn)在想起來都暖烘烘的托嚣。而今年大紅的釘釘，支持自定義啟動頁圖片內(nèi)容厚骗，一直想給團隊做一個屬于我們自己的很酷的啟動頁示启，結(jié)果被無限拖延。
[2016/03/01 備注---后來題主通過閱讀才發(fā)現(xiàn)领舰，啟動頁的圖片更換并不是通過html的頁面來實現(xiàn)夫嗓，特此勘誤，敬請諒解]
二舍咖，App推送消息
App的推送消息從打開方式上來說可以分為兩類，第一類是點擊推送消息直接打開指定App頁面锉桑，比如多數(shù)資訊類App(知乎排霉、澎湃新聞等)；第二類是點擊推送消息打開一個web頁面民轴，再通過點擊web頁面里的內(nèi)容模塊打開指定的App頁面攻柠。第二類推送消息在電商類/生活服務(wù)類等重運營的App里應(yīng)用很多。比如圖例中的大眾點評對KTV商戶的一次推送消息杉武，這個推送消息里包含了多家的KTV商戶，用戶根據(jù)自己的喜好點擊自己喜歡的KTV商戶辙售，進入該KTV商戶的店鋪詳情頁面（指定App頁面）
三旦部，App內(nèi)運營活動/廣告Banner
這種web在App上的使用方式同上文的推送消息有異曲同工之妙祈搜，主要也是應(yīng)用在重運營的App上较店，對電商類App的一次營銷活動，對音樂類App的一個音樂精選集/音樂人的推薦容燕，通過首頁的推薦Banner位引導(dǎo)打開豐富的內(nèi)容頁面都是一個很好的方式梁呈。
四，作為過渡的Native App頁面的替代品
這一種使用方式不太常見蘸秘，但是可以作為App早期開發(fā)中過程中的一種替代手段官卡。由于web的開發(fā)效率相對App來說會高一些，在App開發(fā)的初期為了搶占用戶和市場先機而不得不在規(guī)定的時間內(nèi)發(fā)布一款功能完整的App時醋虏，可以使用這種方式來進行操作寻咒，基礎(chǔ)的核心功能使用Native App頁面來實現(xiàn)，一些非核心功能/使用App頁面實現(xiàn)起來耗費工時的頁面可以使用web頁面來實現(xiàn)颈嚼，這一點在早期的釘釘App版本里應(yīng)用很多毛秘。
五限煞，App調(diào)用第三方服務(wù)時
調(diào)用第三方服務(wù)并且涉及到復(fù)雜的數(shù)據(jù)驗證處理又必須由第三方來完成時抹恳，這種方式是一個比較不錯的解決方案，事實上晰骑，大量的第三方服務(wù)公司也是通過web來提供自己的產(chǎn)品和服務(wù)的适秩。支付服務(wù)屬于這一類范疇的最常見應(yīng)用領(lǐng)域，例如Paypal支付服務(wù)硕舆，Braintree支付服務(wù)秽荞，支付寶支付服務(wù)等。
六抚官，特殊的App-瀏覽器
當然瀏覽器這類App的主體就是web頁面扬跋，我們不再贅言。
七凌节，在App里使用web頁面時需要注意哪些事項呢?
僅作為輔助功能钦听，核心功能盡量不使用web來進行代替
web頁面的導(dǎo)航層級不宜超過兩級
從 Native App頁面進入web頁面上時一般都是App的二級或者三級導(dǎo)航的深度了，進入到web頁面后會脫離掉App的導(dǎo)航體系倍奢，用戶心理會變得有一些疑惑或者不確定朴上。如果web頁面的層級又比較復(fù)雜比較深，會造成用戶很難理解這個頁面下一步又是什么頁面卒煞，怎么回去上一個頁面痪宰，在這種疑惑和恐慌中很有可能的情況是用戶會關(guān)閉這個web頁面回到Native App上相對熟悉的頁面，導(dǎo)致web頁面的流失率很高。注意對各種機型的適配
這一點主要是考慮到開發(fā)出來的web頁面響應(yīng)式布局實現(xiàn)上衣撬，盡量使web頁面表現(xiàn)的像Native App頁面乖订，同時解決多機型適配的問題，因為在A機型上展示良好的頁面在B機型上可能完全展示不了具练。我在為Getone App接入Paypal支付時乍构，開始時沒有留意，后來發(fā)現(xiàn)我們選擇使用的新版Paypal支付頁面在大量的機型上都無法顯示（Paypal提供的支付頁面本身存在的適配問題）扛点，后來通過及時調(diào)整回舊版支付頁面才解決這個問題哥遮。對于長期高頻使用的Web頁面要提供管理后臺，方便運營人員編輯
對于產(chǎn)品運營中要頻繁使用的web頁面最好開發(fā)出來管理后臺占键，提供幾個模板昔善，運營人員每一次只需要編輯和添加內(nèi)容即可實現(xiàn)需要的web頁面，可以極大提高運營的效率畔乙。
那又有哪些方式可以實現(xiàn)通過App來瀏覽web頁面君仆，并且提供一個比較好的體驗?zāi)兀?/p>
這一點涉及到技術(shù)領(lǐng)域了，作為一個產(chǎn)品汪對此的了解實在有限牲距，了解到的實現(xiàn)方式有以下兩種返咱，使用系統(tǒng)內(nèi)核瀏覽服務(wù)和使用第三方提供的瀏覽服務(wù)。鵝廠提供了X5瀏覽服務(wù)SDK牍鞠，號稱表現(xiàn)性能優(yōu)異咖摹，在微信里公眾號文章使用的就是X5瀏覽服務(wù)。關(guān)于這方面更多的知識了解可以用關(guān)鍵詞“webview”+"瀏覽服務(wù)"去問問度娘难述。
希望這篇文字能對你解決問題有所啟發(fā)萤晴。碼字這么辛苦，點個贊或者打個賞吧[可愛][可愛]胁后。
2016/12/21 補記：
- 最近學(xué)會了使用Markdown店读，想到簡書是支持的，就抽空上來看看這篇文章攀芯，重新用我學(xué)會的markdown來排了一下版面屯断，還真是挺好用的，高效簡潔侣诺；
- 隨著工作經(jīng)驗的增長殖演，了解了更多的知識，回頭發(fā)現(xiàn)囿于當時的經(jīng)驗水平年鸳，本文中提到的一些內(nèi)容是不太準確的趴久，讀者們應(yīng)該都比我聰明，貽笑大方了搔确，多包涵彼棍；
- 沒想到這篇無心之作竟然閱讀量都2000+了已添，覺得有點受到鼓舞了，以后我會再繼續(xù)加油的滥酥，堅持寫作。
