达客行

H5到底是什么

58
发表时间:2018-09-17 17:20


H5是一个在线制作H5的工具,在介绍H5之前,我们先来了解一下H5到底是什么吧。

大家可能觉得,H5是微信朋友圈看到的音乐相册,或者在群里分享的测试小游戏,总之,在微信中打开的链接,如果不是公众号文章,那就是“H5”

对此,H5君表示大大的委屈。

在详细介绍H5之前,我们先来看看,H5还可以是什么吧:

无处不在的H5

首先,几乎所有在线的应用类网站,本质上都是一个“H5”

比如youtubefacebook

比如在线的office 365,(没错,这个是浏览器中打开的页面,不是我们电脑上装的excel):

以及刚刚上线不久的谷歌地图在线版:

各种高大上的网站,基本上也是H5,比如苹果的网站:

H5还可以是各种在线游戏:

甚至户外大屏中的互动内容,也是H5

当然,仅仅是用于微信营销的H5,也远远不是翻页广告页面:

H5即一种新的网页

看了那么多例子,也许你会发现,其实任何一个通过浏览器打开的网页,都可以是“H5”,那“H5”到底是什么呢?

首先,H5这个词,来自“HTML5”,且是国内的专门称呼,所以老外是完全不知道“H5”是什么的。

所谓“HTML5”,是指“HTML”的第5个版本,而“HTML”,则是指描述网页的标准语言。因此,HTML5,是第5个版本的描述网页的标准语言

等等,描述网页的标准语言到底是什么鬼?

直白点说,描述网页的标准语言,其实就是网页文件的格式。就像word可以打开doc文件,ps可以打开psd文件,我们的浏览器,无论是ChromeFirefox,还是360,都能打开html文件。而我们浏览网页,并在其中进行各种交互操作的过程,本质上都是我们的浏览器下载了一个网页文件,然后播放或者运行这个网页文件的过程。这个过程,和我们下载一个MP4的电影,然后用quickTime打开,基本上是一样的。

你可能会说,这个过程怎么会一样呢?我们访问一个网站,从来都不用下载啊,只要输入网址就可以了。实际上,当我们输入一个网址时,我们的浏览器就会自动从这个网址,下载一个网页文件,然后再打开运行,这样,我们才能使用各种在线的应用。

下图非常简单的描绘了这个过程:

如果你不信,可以下载这个简单的网页文件,然后断网,解压后双击打开里面的网页.html”文件,看看是不是能看到一个简单的页面?

网页的简单构成

当然,以上过程,是我们对浏览器打开网页的最大程度上的简化,为了让大家对H5有一个更完整的了解,这里我们再做一个重要的补充。

大多数情况下,我们的浏览器从服务器下载的并不仅仅是一个独立的网页文件,而是三种类型的文件的集合,即网页文件,CSS文件和JS文件。

网页文件,构成了一个网页的骨架,描述了一个网页中的基本构成元素,以及这些元素的结构;

CSS文件,描述了网页的外观,比如文本的字体,颜色,图片的排版,按钮的动画效果等等;

JS文件,描述了网页的功能或行为,比如,当我们点击一个按钮时,网页要有什么反应,或者我们在玩一个在线游戏时,任何一个操作,对应于网页游戏的各种反馈等等。

下图描述了这三种文件的大致分工:

 如果把一个网页比喻成一个完整人,那么html就是他的骨架,css决定了他的外观,而js则决定了他提供的功能。当然,这是对最常见的网页应用的描述,在日新月异的互联网中,我们常常可以看到这三个组合的各种变种。

H5的能力

有了以上的基本概念,让我们回到“HTML5”,就不难理解,它其实就是一种新的网页格式,配合CSSJS文件,他能够提供相比旧版本的“HTML4”网页更多的功能和效果。

我们先来回顾一下10年前的网页:

 我们现在习惯看到的各种酷炫的网页,和这些惨不忍睹的网页之间的区别,大多数应该归功于HTML5相对于之前的网页格式,而新增的能力。

根据MDN的总结,这些能力主要包括:

这里,我们不用一个一个去详细了解,只需要大概知道,相比上一个版本的网页格式“HTML4”HTML5是一个革命性的升级,使用HTML5之后,之前只能下载到本地打开的PC软件或手机APP, 现在基本上都能搬到浏览器中来运行了。

总结来说,HTML5,或者“H5”,其实就是一种新的网页形式,是在浏览器中打开的网页应用,也是未来大多数软件存在的形式。


分享到:
地址:广东省东莞市松山湖高新技术产业开发区科技产业园区新竹路4号
手机官网
微信公众号
|
|
|
|
|
|
达客行网络(东莞)有限公司
电话:0769-83077153-801   15118243816
邮箱:service@dakesun.com   QQ: 675797256
加我微信
在线客服
 
 
——————
热线电话
15118243816
83077153-801