H5 是 HTML5 吗?

23,197 阅读7分钟

背景

作为程序员经常会被业务人员问一些技术相关的热门词,比如:“H5页面是什么?” , 我的回答是:“符合 HTML5 标准实现的页面,大家为了方便,简称 H5“。 真的是这样的吗? 当连续有人问相关的问题,并详细了解一些业务以后,慢慢的发现 H5 已经不单单是一个技术相关的词。

之前被我们产品人员也问到一个类似的问题:“怎么通过技术手段来判断一个网站是H5的页面,还是普通页面?”,听到这个问题我懵了,按照我前面的解释 “符合 HTML5 标准实现的页面就是 H5页面”,那当前互联网上看到的网站基本上都在采用了 HTML5 标准。详细了解业务以后才知道,他的要求是把微信里面那种好友之间,或者朋友圈分享的那种带有主题性质的宣传页面(实在是不知道怎么描述)和我们平时电脑上访问的页面通过技术区分识别出来。这个功能能不能实现,具体怎么实现这里不讨论,但是可以看出在业务人员和一些客户眼里,在微信上分享的那种炫酷的页面就是H5页面。 那这里的 H5 还是 HTML5 吗? 从这种应用上来说已经不是了。

另外一个案例,被一个刚开始学习前端的学生问到一个问题:“React 制作的页面都是 SPA(single page web application,单页应用程序) 的,那 HTML5 可以实现 SPA 吗?”,当被问到这个问题的时候我一下子也不知道怎么回答,只是让他先去学习一下 HTML5 ,以及 SPA 到底是什么?要搞清楚。 HTML是超文本标记语言,是一种规范,一种标准,“5” 是HTML第五次重大修改,可以理解为第五个版本,包含了很多功能特性。 SPA 是通过 HTML 与 Javscript 实现的单页应用程序,就是在一个页面上展示所有数据,通过 Javascript 去动态更新程序。所以 SPA 的实现和是不是 HTML5 没有大的关系。这位同学问出这样的问题,我的猜想是这样的,我们在前面提到的那种在微信上分享的那种页面大多数都是一个单页面,然后通过手指向下滚动来浏览一张张炫酷的动画。导致他认为这样的页面就是所谓的 SPA 页面,再加上多数人都认为这种页面都 HTML5 实现的页面,所有他才会问出 HTML5 和 SPA 扯在一起。

我相信现在大多数人认为的 H5 页面,就是在手机微信分享的那种炫酷的网页。 HTML5,作为技术人员都知道是一种标准,一种规范。

H5 这个词的由来?

如果 H5 不等于 HTML5 了,那 H5 到底是什么呢? 维基百科没有定义,百度百科也没有定义,知乎上也没有人说清楚。没有一个标准的定义,只在大家口口相传,出现各种理解扭曲。H5 真的是一个诡异的词。

出现现在这样个状况,我的猜想是这样的,HTML5 在 2013 年左右就发布,在 2014 年底宣布标准制定完成,但是市面的浏览器的支持主要还是在手机上,电脑上主要有 IE 的存在导致标准普及缓慢,所以开始有开发者在手机上做很多酷炫的页面,当这些酷炫的效果在业务人员看到了以后,开始加以有效的利用,特别是在活动宣传和广告方面,为了宣传业务人员会问技术人员:“这种炫酷的效果是怎么实现的?”,技术人员说:“我用的是HTML5的技术”。业务人员的宣传营销能力那是相当厉害,在客户面前大量的宣传:“我们用到了一个牛逼技术,让你的手机网页非常炫酷好看”,慢慢的客户都知道了有一种技术可以把页面在手机上做的非常好看,非常炫酷,然后客户又开始对其他人说:“我们的这个网页用了现在最新的技术,叫什么什么5页面,对H5页面”。然后客户之间口口相传,当以后遇到同样的业务需求的时候,找另外一家供应商说:“我要一个H5页面,要长的类似什么..一样的网页”,然后这一家做网站的公司开始也把这种网站也开始叫着H5页面。最后铺天盖地的“H5页面”就出来了。(这里只是我的一个猜想,具体是什么个情况还有待验证)

随后,在一些招聘岗位出现了“H5开发工程师”。
书籍出现了 《H5营销…》。
社会上的培训机构出现了H5技术培训,“0基础学习H5…”,“H5速成班”。
出现了很多专门做H5网站的公司,就连百度都有一个叫做 “百度H5”的产品。

这是一种健康的现象吗?

我开始有点好奇那些培训机构和相关书籍是怎么定义 H5 这个词的。

移动营销页面

值得高兴的一件事情是,由于市场业务的推动,让移动互联网等到了快速的发展。甚至提高了前端开发在市场中的主要性。但是,还是存在一些问题。

  • 培训机构宣传的那种 “0基础120天速成H5工程师” … ,学员学习的应该还是的前端知识,所以这里的 H5 应该是 HTML5 标准相关体系的技术栈的培训。市场业务把一个以活动推广(营销)为导向的手机上炫酷的页面理解为 H5 页面。这是存在一个信息不对称的问题,这个问题也经常让技术人员与业务人员难以沟通。
  • 用词不严谨,在国内没有一家机构对 “H5”这个词有合理的解释,估计也是不好解释。像百度这样的 H5 产品,感觉他们把 H5 理解为创意,还有人理解为微场景,还有人理解为手机上的PPT。
  • 把 HTML5 理解为一种技术也是不合理的,它应该是一种规范,一种标准(多次强调)。
  • 如果 HTML6 标准发布以后怎么办? 是不是这些所有的名称需要换一遍,“H5网站”,“H6开发工程师”,“H6营销宝典”,“请问你们公司做H6吗?” …

回头我们再来看一下,我们看到的那些手机炫酷的网站真的全是 HTML5 新特征实现的吗?不一定。那是不是只用 HTML5 的新特性就能够写出这样的网站呢?不一定,它有时候还需要CSS3 做动画,用JavaScript去控制行为 。

在 2012 左右,那时候还没有发布 HTML5,不过看到了移动互联网的苗头,我和朋友一起开始做手机建站,主要面向一些中小型企业,客户的需求很简单,就是通过手机可以打开自己的官方网站,同时可以把网站上的产品随时随地分享给他们的客户看(这种需求后来被响应式相关技术满足了)。那时候人们理解这种网站就是手机网站。到现在客户需求还是很明确,就是需要在手机上做一些博取眼球的营销页面,通常都是一些活动页面。在国际上有个词叫做 Minisite ,它的解释是:“知名企业为了配合企业的市场运作活动,会推出一些小型网站也就是MiniSite进行线上营销”。所以我认为当前市场上客户所说的 H5 页面,应该是一种移动端的 MiniSite (Mobile MiniSite)。或者把它叫做 “移动营销页面”,简称 MMP (Mobile Marketing Page) 。

结束

不过 H5 这个词已经很难改掉了,如果我现在继续给客户说,H5 是符合 HTML5 的简称,HTML5 是一种标准,一种规范,那我们讨论的东西肯定不是同一个东西。

但是我希望,作为开发者,在一些技术解释上不应该误导业务人员。作为业务人员,在对外宣传的时候也不应该误导客户。命名这种事情我们应该严谨。

  • HTML5 页面,是按照 HTML5 规范实现的页面,其中用到了许多新的特性。
  • H5,是HTML标签中的 标题标签,代表五级标签。

本文作者:郭小铭