产品经理必学的H5知识

这是Kevin的第 828 篇原创，

持续日更，做产品经理的创业斜杠青年。

如今国内的移动端场景，仍然还是在微信、头条类产品。从用户使用时长分布来看，平均每个用户使用微信的时间一天在2小时以上。

2017年，移动应用的使用时长如下

▲  国内app时长 

在微信中有自带的内嵌浏览器，许多公司把浏览器打开访问成了业务的核心路径。同时H5又有传播的优势，因此在移动端里H5成了许多互联网产品的首选产品形态。

巧妙利用H5，还能够减少开发成本、运营周期，在这里我分享我在微信生态中，H5的设计技巧、技术优势。

H5拥有可以用技术上解决的优势

H5在微信里，你一定会会遇见下面这个落地页

▲  微信中关闭H5页面入口 

上面的页面显示结果来自下面6个原因

1、微信会有系统检测，只要检测到你的域名带有诱导分享、擦边球（不良信息、虚假信息等）的内容，就会自动拦截。
2、同行或用户举报次数过多，触发微信团队人工检测，手动封杀你的域名。
3、分享转发量过大，触发系统自动检测，当检测到内容有违规的，就会封杀。
4、通常只要微信后台或者人工有检测到主体侵权，内容侵权，暴力内容，推广、营销信息、广告类内容，不实信息内容，骚扰类内容，误导类内容，就会将你的域名加入黑名单，用户访问就会提示“该网页已停止访问”。

用技术避免，H5在微信中停止访问

首要技术是给域名做多域名跳转。

在微信群或者自己朋友圈转发，所以可以设置一个固定入口+海量落地页分享的形式，来实现H5页面的防封！

1、分享域名独立入口；

2、随机落地页域名（包括子域名随机）；

3、页面做文字加密处理（Base64，Unicode编码，sojson.v5等）；

4、利用大站的短链接做落地页，比如新浪、腾讯、搜狐、百度等等；

5、做伪静态，实现用户每次打开域名不同，网址也不同；

域名封杀是没办法避免的，但用一些特殊域名做子域名泛解析，实现域名防封的功能。活动方案链接防封方法实施起来，还要根据用户的实际内容，来做详细的解决方案，实现“千人千面”的效果，最终实现微信域名的终极防封目的。

由此可以看见即使H5在微信传播，用技术方案可以减少链接被封，保证通避免用户的服务受阻场景。

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

H5可以内嵌在APP、或小程序里面。因此在某些平台下，即使有严格要求杜绝某类产品，H5可以成为一个潜在的后门。

▲  H5页面的配置化入口 

通过后台进行配置化开关，一个H5可以让一个纯工具的产品变成为电商产品。

在审核前通过配置化下架支付入口，审核通过后再上架电商内容，产品就可以有了变现能力。

3.H5方便拉新、促活

微信小程序才出来，很多人都难以区分微信小程序和APP、以及H5和微信小程序的区别。

主要的原因是：对于绝大部分应用，除了用户体验外，H5能够实现和APP所有的功能。

但H5页面内部点击分享按钮无法直接调用，而分享功能需要点击右上角更多来操作。小程序则天然的支持分享和生态传播

然后用户可能不知道通过右上角小标里面的功能分享，因此需要在产品设计上增加分享提示。

▲  产品设计上增加入口 

移动端应用，选择H5的好处就是拉新、制造快速传播。同时如今微信服务号也支持在H5上获取用户信息。所以产品以内容定位、资讯信息的，H5方式开发的hybrid应用是最优项。所以H5上减少了用户在PC上输入手机号登录注册方式的冗余操作。

4.H5的访问速度是关键

由于H5的方式，核心影响用户访问的是仍然是访问速度。所以一般采用前后端分离，会降低访问速度。通过API方式传输数据，避免服务端渲染，加速访问。

超过3秒的访问时间，用户就会离开。尤其是有复杂的H5功能、页面组件，那么H5的访问速度、和用户前置条件判断是关键。

所以H5上尽可能只做数据的查询、展示、删除，数据的编辑就不用再H5上了。

右下可看到H5大部分成了APP拉起的媒介，可以直接下载应用。通过权限设计，用户点击H5访问应用下载地址。

以上就是今天的分享。