產(chǎn)品經(jīng)理必學(xué)的H5知識

這是Kevin的第 828 篇原創(chuàng)，

持續(xù)日更，做產(chǎn)品經(jīng)理的創(chuàng)業(yè)斜杠青年。

如今國內(nèi)的移動(dòng)端場景，仍然還是在微信、頭條類產(chǎn)品。從用戶使用時(shí)長分布來看，平均每個(gè)用戶使用微信的時(shí)間一天在2小時(shí)以上。

2017年，移動(dòng)應(yīng)用的使用時(shí)長如下

▲  國內(nèi)app時(shí)長 

在微信中有自帶的內(nèi)嵌瀏覽器，許多公司把瀏覽器打開訪問成了業(yè)務(wù)的核心路徑。同時(shí)H5又有傳播的優(yōu)勢，因此在移動(dòng)端里H5成了許多互聯(lián)網(wǎng)產(chǎn)品的首選產(chǎn)品形態(tài)。

巧妙利用H5，還能夠減少開發(fā)成本、運(yùn)營周期，在這里我分享我在微信生態(tài)中，H5的設(shè)計(jì)技巧、技術(shù)優(yōu)勢。

H5擁有可以用技術(shù)上解決的優(yōu)勢

H5在微信里，你一定會會遇見下面這個(gè)落地頁

▲  微信中關(guān)閉H5頁面入口 

上面的頁面顯示結(jié)果來自下面6個(gè)原因

1、微信會有系統(tǒng)檢測，只要檢測到你的域名帶有誘導(dǎo)分享、擦邊球（不良信息、虛假信息等）的內(nèi)容，就會自動(dòng)攔截。
2、同行或用戶舉報(bào)次數(shù)過多，觸發(fā)微信團(tuán)隊(duì)人工檢測，手動(dòng)封殺你的域名。
3、分享轉(zhuǎn)發(fā)量過大，觸發(fā)系統(tǒng)自動(dòng)檢測，當(dāng)檢測到內(nèi)容有違規(guī)的，就會封殺。
4、通常只要微信后臺或者人工有檢測到主體侵權(quán)，內(nèi)容侵權(quán)，暴力內(nèi)容，推廣、營銷信息、廣告類內(nèi)容，不實(shí)信息內(nèi)容，騷擾類內(nèi)容，誤導(dǎo)類內(nèi)容，就會將你的域名加入黑名單，用戶訪問就會提示“該網(wǎng)頁已停止訪問”。

用技術(shù)避免，H5在微信中停止訪問

首要技術(shù)是給域名做多域名跳轉(zhuǎn)。

在微信群或者自己朋友圈轉(zhuǎn)發(fā)，所以可以設(shè)置一個(gè)固定入口+海量落地頁分享的形式，來實(shí)現(xiàn)H5頁面的防封！

1、分享域名獨(dú)立入口；

2、隨機(jī)落地頁域名（包括子域名隨機(jī)）；

3、頁面做文字加密處理（Base64，Unicode編碼，sojson.v5等）；

4、利用大站的短鏈接做落地頁，比如新浪、騰訊、搜狐、百度等等；

5、做偽靜態(tài)，實(shí)現(xiàn)用戶每次打開域名不同，網(wǎng)址也不同；

域名封殺是沒辦法避免的，但用一些特殊域名做子域名泛解析，實(shí)現(xiàn)域名防封的功能?；顒?dòng)方案鏈接防封方法實(shí)施起來，還要根據(jù)用戶的實(shí)際內(nèi)容，來做詳細(xì)的解決方案，實(shí)現(xiàn)“千人千面”的效果，最終實(shí)現(xiàn)微信域名的終極防封目的。

由此可以看見即使H5在微信傳播，用技術(shù)方案可以減少鏈接被封，保證通避免用戶的服務(wù)受阻場景。

2.H5做成配置化，快速審核

H5可以內(nèi)嵌在APP、或小程序里面。因此在某些平臺下，即使有嚴(yán)格要求杜絕某類產(chǎn)品，H5可以成為一個(gè)潛在的后門。

▲  H5頁面的配置化入口 

通過后臺進(jìn)行配置化開關(guān)，一個(gè)H5可以讓一個(gè)純工具的產(chǎn)品變成為電商產(chǎn)品。

在審核前通過配置化下架支付入口，審核通過后再上架電商內(nèi)容，產(chǎn)品就可以有了變現(xiàn)能力。

3.H5方便拉新、促活

微信小程序才出來，很多人都難以區(qū)分微信小程序和APP、以及H5和微信小程序的區(qū)別。

主要的原因是：對于絕大部分應(yīng)用，除了用戶體驗(yàn)外，H5能夠?qū)崿F(xiàn)和APP所有的功能。

但H5頁面內(nèi)部點(diǎn)擊分享按鈕無法直接調(diào)用，而分享功能需要點(diǎn)擊右上角更多來操作。小程序則天然的支持分享和生態(tài)傳播

然后用戶可能不知道通過右上角小標(biāo)里面的功能分享，因此需要在產(chǎn)品設(shè)計(jì)上增加分享提示。

▲  產(chǎn)品設(shè)計(jì)上增加入口 

移動(dòng)端應(yīng)用，選擇H5的好處就是拉新、制造快速傳播。同時(shí)如今微信服務(wù)號也支持在H5上獲取用戶信息。所以產(chǎn)品以內(nèi)容定位、資訊信息的，H5方式開發(fā)的hybrid應(yīng)用是最優(yōu)項(xiàng)。所以H5上減少了用戶在PC上輸入手機(jī)號登錄注冊方式的冗余操作。

4.H5的訪問速度是關(guān)鍵

由于H5的方式，核心影響用戶訪問的是仍然是訪問速度。所以一般采用前后端分離，會降低訪問速度。通過API方式傳輸數(shù)據(jù)，避免服務(wù)端渲染，加速訪問。

超過3秒的訪問時(shí)間，用戶就會離開。尤其是有復(fù)雜的H5功能、頁面組件，那么H5的訪問速度、和用戶前置條件判斷是關(guān)鍵。

所以H5上盡可能只做數(shù)據(jù)的查詢、展示、刪除，數(shù)據(jù)的編輯就不用再H5上了。

右下可看到H5大部分成了APP拉起的媒介，可以直接下載應(yīng)用。通過權(quán)限設(shè)計(jì)，用戶點(diǎn)擊H5訪問應(yīng)用下載地址。

以上就是今天的分享。