`

HTML5 介绍

 
阅读更多

什么是 HTML5

HTML 5是近十年来Web开发标准最巨大的飞跃。和以前的版本不同,HTML 5并非仅仅用来表示Web内容,它的新使命是将Web带入一个成熟的应用平台,在HTML 5平台上,视频,音频,图象,动画,以及同电脑的交互都被标准化。

HTML5 主要新功能

HTML5 是继 HTML4.01, XHTML 1.0 和 DOM 2 HTML 后的又一个重要版本,旨在消除Internet 程序(RIA)对 Flash, Silverlight, JavaFX 一类浏览器插件的依赖。除了原先的DOM接口,HTML5增加了更多API,如:

·       本地音频视频播放;

·       动画;

·       地理信息;

·       硬件加速;

·       本地运行(即使在 Internet 连接中断之后);

·       本地存储;

·       从桌面拖放文件到浏览器上传;

·       语义化标记。

那些支持 HTML5 的浏览器在处理 HTML 代码错误的时候必须更灵活,而那些不支持 HTML5 的浏览器将忽略 HTML5 代码。

HTML 语法的变化

HTML5 引入了新的 HTML 元素和属性,有的是传统通用元素的语义化版本,如取代  div 元素的 nav, footer 等元素,也有一些全新的元素,如 audio, video。一些在 HTML4 中不被推荐使用的元素,如 font 和 center 将被弃用。HTML5 引入的新 HTML 元素包括:

·       article:文章

·       aside:内容旁边的侧边栏内容

·       audio:音频

·       canvas:2D 绘图

·       command:命令按钮

·       datalist:下拉选择框

·       details:对象的细节

·       dialog:对话框

·       embed:外部插件或对象

·       figure:一组媒体对象以及标签文字

·       footer:页脚

·       header:页首

·       hgroup:文档某一部分的信息

·       keygen:表单生成的 Key

·       mark:标注的文字

·       meter:预先定义的范围内的度量

·       nav:导航条

·       output:输出

·       progress:进度条

·       rp:标识 rubby 内容

·       rt:rubby 内容的解释

·       ruby:rubby 内容

·       section:定义一个部分

·       source:媒体的资源

·       time:日期时间

·       video:视频

这些新标签,可以让你的 HTML 文档更容易加载,且更容易被搜索引擎抓取其中的有用信息。比如,搜索引擎可以直接抓取它最关心的 article 标签里面的内容。

HTML5 同那些流行的技术如何共存

如今的 Web 世界已经习惯了各种插件和 API,HTML5 为 Web 开发与设计者带来了方便与不便,HTML5 将如何同现在的这些流行技术共存?

·         HTML5 与 Flash

这个争论由来已久,Flash 被某些开发设计者滥用导致一些网页加载缓慢,而 HTML5 为之带来一线曙光。相对 Windows 用户来说,Mac 用户可能会从 HTML5 获得更多好处,因为苹果一直不愿支持 Flash。

现在看来,就视频游戏而言,Flash 是更好的选择,但取决于你的浏览器,如果你的视频不是很复杂,HTML5 是更好的选择。Web开发与设计者从这些争论中应该吸取的东西是,Flash 之外还有别的选择,但 Flash 有牢固的地盘,在为客户提供开发设计的时候,需要对他们的目标客户做一些研究。

·         HTML5 与 IE 9

IE9 经常高调宣扬它对 HTML5 的兼容,它确实将是一个很好地支持 HTML5 的浏览器,因为,IE9 使用 Windows 现代图形 API 以及 PC 的图形加速卡输出文字和图形。微软还曾宣称,IE9 将支持 GPU 加速的 HTML5,将图形滚动,3D 图形显示等处理交由图形加速卡。

·         HTML5 与 Ajax

现在的 HTML 语言的一个问题是,它是一种轻量级的应用界面,那些喜欢使用 Ajax 实现在线应用的开发者会发现 HTML 非常不好用。Ajaxwith.com 认为,HTML 适合用来加载界面,JavaScript 用来执行命令,虽然 HTML 在作为界面语言方面并不好用,但鉴于多数开发者对它的熟悉程度,HTML 还是不可缺少。HTML5 会让 Ajax 应用的实现变得更容易。

·         HTML5 with CSS

你需对你的 CSS 代码就行整理以支持 HTML5,因为 h1, h2 之类的标签将不再使用,为了实现同 HTML5 的兼容,最好的方式是使用 CSS reset,将那些常见的 HTML 标签的 CSS 属性清零,woork 认为,最好的 CSS Reset 是 Eric Meyers CSS reset。

HTML 5 将带来什么?

全新的,更合理的 Tag,多媒体对象将不再全部绑定在 object 或 embed Tag 中,而是视频有视频的 Tag,音频有音频的 Tag。本地数据库。这个功能将内嵌一个本地的 SQL 数据库,以加速交互式搜索,缓存以及索引功能。同时,那些离线 Web 程序也将因此获益匪浅。不需要插件的富动画。Canvas 对象将给浏览器带来直接在上面绘制矢量图的能力,这意味着我们可以脱离 Flash 和 Silverlight,直接在浏览器中显示图形或动画。将提供 API 实现浏览器内的编辑,拖放,以及各种图形用户界面的能力。内容修饰 Tag 将被剔除,而使用 CSS。理论上讲,HTML 5 是培育新 Web 标准的土壤,让各种设想在他的组织者之间分享。

HTML5 的更多意义

HTML5 的意义远不止上面这些,它最大的意义在于改变了 Web 文档的结构方式,借助 header, footer, section, article 这些标签,我们可以实现更具结构化,语义化的 Web 文档。这样,搜索引擎可以更容易索引 Web 站点,我们也可以搜索到更快,更准确的信息。

另外,借助 Microdata, HTML5 还可以实现更强大的语义结构,这个标准化的数据格式(类似 microformats,对浏览器和搜索引擎都意义深远),可以让你的站点不仅能够提供数据,还能提供数据定义。

不过,和任何新技术的降临一样,其中也会牵扯到一些问题,对 Web 设计者而言,最大的一个问题就是因为这些新标签的引入,各浏览器之间将缺少一种统一的数据描述格式。

分享到:
评论

相关推荐

    企业html5介绍bootstrap模板.rar

    本资源“企业html5介绍bootstrap模板.rar”是一个包含HTML5和Bootstrap技术的企业级网站模板,旨在帮助开发者快速搭建企业官网。 HTML5引入了许多新的标签,如、、等,这些语义化标签使代码结构更清晰,更利于搜索...

    学校实训项目-企业html5介绍bootstrap模板.zip

    在这个“学校实训项目-企业html5介绍bootstrap模板.zip”压缩包中,我们主要涉及的是前端网页开发技术,尤其是HTML5和Bootstrap框架的应用。这个实训项目是针对学生进行的,旨在帮助他们掌握现代网页设计和开发的...

    HTML5详细介绍

    ### HTML5详细介绍 #### 1、HTML5概述 HTML5是一种新的网络标准,旨在替代HTML4.0、XHTML1.0以及DOM Level 2 HTML等旧标准。它的诞生标志着Web开发进入了新时代。 - **发展目标**:HTML5的目标是简化Web开发流程...

    htm5入门 html5介绍 html5的新特性 css3

    ### HTML5 入门与新特性详解 #### HTML5简介 HTML5是万维网联盟(W3C)制定的最新一代超文本标记语言标准,它不仅改进了之前的HTML版本,还引入了许多新特性和API,使得Web开发更加高效、灵活且功能强大。HTML5的...

    企业html5介绍bootstrap模板

    这个"企业HTML5介绍Bootstrap模板"旨在为企业提供一个高效、快速的起点,以创建具有现代设计感和卓越用户体验的网站。 Bootstrap的核心特性包括一套精心设计的CSS样式、JavaScript组件以及对HTML5的支持。这些特性...

    HTML5实战开发坦克大战视频教程

    资源名称:HTML5实战开发坦克大战视频教程 教程内容:HTML5游戏公开课-坦克大战01.HTML5介绍.HTML5发展.HTML5学习网站推荐HTML5游戏公开课-坦克大战02.HTML5快速体验①(canvas.video.header.footer等)HTML5游戏公开...

    HTML5从入门到精通

    - HTML5介绍:文档开篇介绍HTML5的基本概念,包括其发展背景、设计理念以及与之前HTML版本的主要区别。 - HTML5简介:这部分可能会介绍HTML5的基本语法、结构以及新的标签和属性,让读者对HTML5有一个总体的认识。...

    html5入门到精通 视频教程

    HTML5介绍 HTML5开发教程-1.相关概念和准备工作 HTML5开发教程-2.HTML5基础 HTML5开发教程-3.HTML核心元素1 HTML5开发教程-4.HTML核心元素2 HTML5开发教程-5.CSS基础 1.HTML常用标记超链接表格表单 2.HTML常用标题...

    绿色家乡美食HTML5模板

    【绿色家乡美食HTML5模板】是一款专为展示家乡美食而设计的、大气的全站网页模板,适用于构建具有鲜明地域特色和绿色环保理念的美食网站。该模板以绿色为主题,旨在营造一种清新自然、健康美味的视觉体验,让用户在...

    HTML介绍完美版资料.ppt

    "HTML5 介绍完美版资料" HTML5 是 Hypertext Markup Language 超文本标记语言(HTML)的第五次重大修改。它是一个新的网络标准,目标是取代现有的 HTML 4.01 和 XHTML 1.0 标准。HTML5 希望能够减少互联网应用(RIA...

    单页html5介绍网站模板

    单页HTML5介绍网站模板是现代网页设计中一种流行的趋势,尤其适用于个人作品展示、小型企业宣传或简单项目介绍。这种模板将所有内容整合到一个单一的页面上,通过滚动来浏览不同部分,提供了一种简洁且直观的用户...

    HTML5简介ppt

    html5的入门

    HTML 5 从入门到精通

    ### HTML5介绍 HTML5是万维网联盟(W3C)制定的标准,旨在改进其前身HTML4的功能。它引入了许多新特性,包括多媒体支持、绘图功能、本地存储以及增强的表单控件等,使网页开发者能够创建更加动态和丰富的网络应用。...

    分享最好的HTML5编码教程和参考手册

    - **ScrubdinHTML5**:一份详尽的HTML5介绍资料,适合初学者快速入门。 - **Scribd的HTML5图例演讲**:通过视觉化的方式,帮助理解HTML5的关键概念和技术。 - **HTML5WTF**:由Simon Schoeters编写,深入浅出地讲解...

    旅游景区介绍html5模板

    旅游景区介绍html5模板是一款旅行社旅游景点介绍旅游线路规划网站模板下载。

Global site tag (gtag.js) - Google Analytics