首页>前端>正文

什么是HTML?HTML5是什么?HTML5有那些优势和特性?_上海前端培训

时间:2018-05-17 18:02:12   来源:上海尚学堂   阅读:


一、什么是HTML


在了解html5之前,首先要说一下html语言,尽管是更新后的5,但很多的地方还是保留了html的优势。
 
HTML是HyperText Markup Language超级文本标记语言的缩写,是标准通用标记语言下的一个应用,也是一种规范,一种标准,它通过标记符号来标记要显示的网页中的各个部分。从第一版的出现到现在,html已经经历了5次的改版,从HTML 2.0到HTML 5,html用自身的优势证明了其在网站中的优势,以至于替代了古老的C语言编程来架构部分网站。  

HTML有以下特点 :

1、简易性:超级文本标记语言版本升级采用超集方式,从而更加灵活方便。
2、可扩展性:超级文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超级文本标记语言采取子类元素的方式,为系统扩展带来保证。 
3、平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超级文本标记语言可以使用在广泛的平台上,这也是万维网(WWW)盛行的另一个原因。 
4、通用性:另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。 

二、什么是HTML5

HTML5是HTML(超文本标记语言)的第五次更新的产品,这是一种解释型的语言,文件的扩展名的后缀为.htm或者.html的形式,这是众多厂商联合开发出来的产品,据说W3C将会在2022年推出标准版。虽然现在仍处于不断的完善中,但新增的新特性,新功能,不仅能节约Web开发者的时间和周期,还能提升用户的体验,更好的为开发者服务。
 
在HTML的时代,满屏的都是div元素,结构混乱,不易阅读,代码臃肿。在HTML5中,新增了许多语义化的布局标签,比如nav,header,footer,article等,使布局的网页结构清晰明了。还新增了音频,视频,图像,绘图,动画等功能,在以前,这些都是要用flash才能完成的。使用HTML5新增的功能能做出许多酷炫的效果。



三、HTML5特性

 

1、语义特性(Class:Semantic)

 
HTML5赋予网页更好的意义和结构。更加丰富的标签将随着对RDFa的,微数据与微格式等方面的支持,构建对程序、对用户都更有价值的数据驱动的Web。
 

2、本地存储特性(Class: OFFLINE & STORAGE)

 
基于HTML5开发的网页APP拥有更短的启动时间,更快的联网速度,这些全得益于HTML5 APP Cache,以及本地存储功能。Indexed DB(html5本地存储最重要的技术之一)和API说明文档。
 

3、设备兼容特性 (Class: DEVICE ACCESS)

 
从Geolocation功能的API文档公开以来,HTML5为网页应用开发者们提供了更多功能上的优化选择,带来了更多体验功能的优势。HTML5提供了前所未有的数据与应用接入开放接口。使外部应用可以直接与浏览器内部的数据直接相连,例如视频影音可直接与microphones及摄像头相联。
 

4、连接特性(Class: CONNECTIVITY)

 
更有效的连接工作效率,使得基于页面的实时聊天,更快速的网页游戏体验,更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术,Server-Sent Event和WebSockets就是其中的两个特性,这两个特性能够帮助我们实现服务器将数据“推送”到客户端的功能。
 

5、网页多媒体特性(Class: MULTIMEDIA)

 
支持网页端的Audio、Video等多媒体功能, 与网站自带的APPS,摄像头,影音功能相得益彰。
 

6、三维、图形及特效特性(Class: 3D, Graphics & Effects)

 
基于SVG、Canvas、WebGL及CSS3的3D功能,用户会惊叹于在浏览器中,所呈现的惊人视觉效果。
 

7、性能与集成特性(Class: Performance & Integration)

 
没有用户会永远等待你的Loading——HTML5会通过XMLHttpRequest2等技术,解决以前的跨域等问题,帮助您的Web应用和网站在多样化的环境中更快速的工作。
 

8、CSS3特性(Class: CSS3)

 
在不牺牲性能和语义结构的前提下,CSS3中提供了更多的风格和更强的效果。此外,较之以前的Web排版,Web的开放字体格式(WOFF)也提供了更高的灵活性和控制性。

 

四、HTML5的优势有哪些?

 

1,跨平台性

 
  在HTML5到来之前,由于平台的多样性,导致每开发一套产品,就要针对不同的平台开发多套版本,耗费大量的时间和精力,而且还增加了大量的开发成本,而HTML5技术的出现却能很好的解决这个问题,开发者只要使用一套程序,就能够很容易的实现多个平台的展现功能,降低了开发难度,节约了开发时间和成本的投入。
 

2,即时更新


之前原生应用上线Appstore,都需要等待很长的审核时间,一旦出现问题需要更新,则还要重新审核,无形中浪费了大量的时间。而HTML5是通过浏览器进行加载的,所以不存在这样的问题,如果出现什么问题,可以及时的更新上线,不需要等待审核时间。
 

3,离线缓存功能

HTML5中最酷的特性就是离线缓存。通过JavaScript提供了数种不同的离线储存功能,相对于传统的Cookie而言有更好的弹性以及架构,并且可以储存更多的内容。它拥有更好的安全和性能,即使浏览器关闭后也可以保存。
 

4,视频和音频的支持

 
之前在实现播放媒体功能时,一直是开发者比较痛苦的事情,需要让你的视频和音频通过HTML5标签和来访问资源。并且为了它们能正确播放必须赋予一大堆的参数。这样你就要不断的重复标签,你的代码也会变得十分繁琐。现在,这一切都将变的非常简单。
 

5,清晰的代码

 
HTML5可以让你写出简单清晰的代码。使用HTML5你可以通过使用语义学的HTML header标签描述内容来最后解决你的div及其class定义问题。让你的代码更加清晰易于理解。
 

6、现在就用HTML5
 

截至目前而言,主流的网页浏览器Firefox5、Chrome 12和Safari 5都已经支援了许多的HTML5标准,而且目前最新版的IE也支援了许多HTML5标准,随着使用者陆续升级到新版的浏览器,开发者应该在现在就可以招收开发!兼容性问题会随着时间的推移而越来越少。但对于不得不照顾低版本用户的网站,网上也有大量的相关解决方案。

上海前端培训编辑整理,更多前端文章推荐:
【上海前端培训】使用html+css+js实现日历与定时器》;
Html5前端如何实现文字边框阴影》;
实现HTML5 移动页面自适应手机屏幕的4种方法

分享:0

电话咨询

客服热线服务时间

周一至周五 9:00-21:00

周六至周日 9:00-18:00

咨询电话

021-67690939
15201841284

微信扫一扫