Web App Install Banners简介

移动端,web和native app有一个比较大的区别:访问的过程。

以一个“标准”的访问流程为例:

web:用户打开一个第三方程序,比如浏览器、微信。如果是浏览器,则需要用户在地址栏里输入内容,比如:cloud.tencent.com,浏览器中显示这个站点。用户完成访问。当他再次访问的时候,大多数用户仍然需要重复这一过程,当然有经验的用户会使用书签或者利用浏览器的功能保存到一个很丑快捷入口到主屏幕。

app:用户打开一个第三方程序,比如app store,下载,安装到主屏幕,完成,使用。再次访问的时候,只需在主屏幕找到app的图标即可。这个过程是所有用户都如此,就算是第一次使用智能手机的用户也会。

这里就产生一个问题,在移动端潮流中,web的回访性就天然的低于app,因为访问的成本实在是太高了。

好在,google推出了一个技术Progressive Web Apps,他是几个技术的集合。以后慢慢介绍,先介绍一个最常用的:web app install banners。如下图:

要触发一个安装,需要满足下面的条件:

要有一个web app manifest,并且要配置好必须的字段:

  • short_name (主屏幕上的名字)
  • name (banner上的名字)
  • 192x192 png icon (图标的声明必须包含mime类型 image/png)
  • start_url 点击图标访问的地址

网站上要注册一个service worker

必须是https

至少访问两次,且两次间隔不小于5分钟

谷歌提供了一个测试工具lighthouse,可以在chrome扩展里面查找并且安装,然后在Devtools中的application中看到。点击Manifest,然后再点击Add to homescreen。

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏Python中文社区

构建一个pip安装的车辆路径显示的Python包

專 欄 ❈treelake,Python中文社区专栏作者。 简书: http://www.jianshu.com/u/66f24f2c0f36 ❈ 最近有一些...

21910
来自专栏IT大咖说

前后端高效协作开发的11条建议

内容来源:作者,深予之 (@senntyou),https://github.com/senntyou/blogs;来自,https://segmentfaul...

631
来自专栏张戈的专栏

BaiduSubmit:度娘WordPress结构化数据插件(改进版)

张戈博客曾多次提到一个会造成百度不收录问题的原因:如果网站存在实时推送机制(比如安装了百度官方推出的 BaiduSubmit 插件),那么发布文章后,在百度收录...

3385
来自专栏腾讯Bugly的专栏

《移动端本地 H5 秒开方案探索与实现》

对 APP 里的一些使用 H5 实现的功能模块,一般体验都比原生差,那么怎么提高h5加载速度?优化 h5 体验?

1.1K13
来自专栏腾讯移动品质中心TMQ的专栏

HTTP接口测试还可以这么玩

1 背景 随着H5在各行业领域的运用,无论是在APP内嵌入H5页面的hybrid应用还是直接在微信公众号或者轻应用中使用H5页面都是非常的常见(比如前端页面通过...

26210
来自专栏阿北的知识分享

这周撸了两款小程序,总结下经验。

当一个小程序Page的js文件中存在 onShareAppMessage 方法时,可以触发转发功能,但是通过小程序开发者工具生成的模板中,入口文件的js中并没有...

2315
来自专栏Python中文社区

一个多线程知乎用户爬虫的实现

專 欄 ❈默然,Python中文社区专栏作者。 博客:https://www.zhihu.com/people/moranzcw GitHub:https:/...

2395
来自专栏腾讯IVWEB团队的专栏

关于 javascript 错误捕获

我们team将出现错误的javascript代码取名为badjs,也有一个开源的badjs项目,用于捕获和分析js错误,并提供了一些基础的报表数据分析。

2520
来自专栏分布式系统进阶

利用Mesos构建多任务调度系统

3265
来自专栏web前端教室

Vue2.0,lifeCycle ['laɪfˌsaɪkl] -- 生命周期大白话~

生命周期,这词太屌了,头一次在前端相关文章中看到这个词的时候,我真是被唬住了。心里想,这前端还跟生命周期搞一块了,是不是还带转生投胎啊,跪着看了一半,我就站起来...

2368

扫码关注云+社区