在微信上做 HTML5 网页和普通的网页开发有何不同

html-css012

在微信上做 HTML5 网页和普通的网页开发有何不同,第1张

如果考虑的范围只是微信内置浏览器和手机上的浏览器应用(safari、chrome)的话,差不多有几个不同点吧:

最突出的差别,前端要注意分享功能!上线之前,每个页面基本都要review一边分享功能是不是完善的。

微信最近提供了新的接口,所以以后会有更多与微信贴合紧密的特性。

html5接口上的差异。safari和chrome的话提供的html5接口会更多,而微信内置浏览器的接口比较少,印象最深的是usermedia。前几天在项目里还发现,微信里固定定位的支持还是不够好,safari在这点上现在好很多了。所以如果想让

web

应用在微信里体验更好一些的话,iscroll类的模块是免不了的。

微信浏览器的兼容性问题,在android上比较明显。印象比较深的是三星的机型上不支持background-size-cover,必须使用-webkit-background-size才行。小米的输入框比较难搞。。。

开发、调试上的问题。android

chrome比较好,有远程调试功能。微信里面基本木有办法。遇到棘手的问题,一般会使用modernizr来做特性检测,或者使用远程log工具调试。

最普遍的介绍:

通常我们所说的H5就是H5广告,大多是在微信上宣传营销使用的,而HTML5是第五代HTML的标准,可以说,H5都是基于 HTML5 实现的,包括目前我们看到的大部分网页,基本上所有H5都遵循HTML5这个规范,不然就会出现问题。

通俗的讲,H5是一个网页,就像一个很大的容器,里面可以放文本、图片、音视频等基本的流媒体格式的文件。

特点是什么:

众所周知的是,H5虽然是一个网页的形式,但是主要是靠微信扫码、公众号、微信群和朋友圈等渠道传播,这便自然的与微信这一个词捆绑在一起(到今天我们还经常能听见微信H5这种叫法),恰逢微信的发展势头如火如荼,H5这种新型的广告形式,搭借日活3亿的微信也得迅速发展,这也在一种程度上推动了H5技术的发展,,技术的碰撞总是能带来创意的疯狂肆意生长。一席间,H5一词便火遍大街小巷,误打误撞就像当初熊猫的错误的叫法一样,技术专业领域的从事人员也渐渐妥协,不再纠结“H5”这个词是不是不准确。

举例说明应用场景:

既然H5作为广告的一种形式,那么在不同应用场景是有一定区别的,比如市场策划说它是一些品牌文案,设计师眼中它是平面UI界面,编程开发人员说它是一个HTML网页,推广营销人员说它是一个活动……那么我们从创意形式、行业、场景三个维度来划分目前H5的实际应用表现:

创意形式:视频H5 、一镜到底、 全景VR、 快闪、 答题测试 、合成海报、 游戏、 拟态类、 数据表单 、横屏H5、 长页面

行业:互联网/IT、 汽车、 地产/酒店 、金融/银行、 文化/娱乐、 服饰/时尚 、电商/商业、教育/培训、 媒体/政府、 旅游/会展

场景:邀请函、 招聘 、品牌推广、 产品宣传、 婚礼庆典 、活动营销 、节日主题、 数据报告、 微杂志 、微官网、 年会

如何制作:

专业H5页面制作工具推荐:意派∙Epub360

推荐理由:意派Epub360可以实现高质量的H5页面功能,专业组件化的功能,简易上手的操作,企业用户更容易快速完成专业的H5页面上线。

总结:

代码开发和H5工具制作的本质没啥大的区别,因为H5作为网页都是基于html,css这些代码组成,符合html5书写规范,有区别就在于成本、实现难度、制作效率、数据安全、灵活行和兼容性等大的方面。