HTML5的结构和语义(1):前言


Posted in HTML / CSS onOctober 17, 2008

超文本标记语言(HTML)5 第一次向 HTML 中引入新的元素。新的结构元素包括 aside、figure 和 section。新的内联元素包括 time、meter 和 progress。新的内嵌元素有 video 和 audio。新的交互元素有 details、datagrid 和 command。

超文本标记语言(HTML)的开发到 1999 年 HTML 4 就停止了。万维网联盟(W3C)把重点转向将 HTML 的底层语法从标准通用标记语言(SGML)改为可扩展标记语言(XML),以及可缩放向量图型(SVG)、XForms 和 MathML 这些全新的标记语言。浏览器厂商则把精力放到选项卡和富站点摘要(RSS)阅读器这类浏览器特性上。Web 设计人员开始学习使用异步 JavaScript XML(Ajax),在现有的框架下通过层叠样式表(CSS)和 JavaScript™ 语言建立自己的应用程序。但是在接下来的八年中,HTML 本身没有任何变化。

最近,它又复活了。三家重要的浏览器厂商 — Apple、Opera 和 Mozilla Foundation — 成立了 Web Hypertext Application Technology Working Group(WhatWG)来开发传统 HTML 的新版本。最近,W3C 也注意到了这些活动,也启动了自己的新一代 HTML 项目,双方的成员有很多是相同的。这两个项目最终很可能合并。虽然很多细节还在争论之中,但下一版本 HTML 的大体轮廓已经清楚了。

Web 开发人员从 1999 年就一直期待 HTML 的新版本(通常称为 HTML 5,但是也称为 Web Applications 1.0),现在它终于发布了。它保持了 HTML 原来的特色:没有名称空间或模式。元素不必结束。浏览器会宽容地对待错误。p 仍然是 p,table 仍然是 table。

如果在 1999 年将一位 Web 开发人员冷冻起来,现在再解冻,那么他会遇到一些新的让人迷惑的元素。是的,他熟悉的元素(比如 div)仍然保留了;但是,HTML 现在还包含 section、header、footer 和 nav 等新元素。em、code 和 strong 仍然存在,但是增加了 meter、time 和 m。img 和 embed 仍然可用,但是还增加了 video 和 audio。但是,他仔细观察一下就会发现,这些元素实际上没什么区别。其中许多元素可能在 1999 年是开发人员需要而没有得到的。通过与他已经掌握的元素进行简单的类比,这些新元素都很容易理解。实际上,与 Ajax 或 CSS 相比,它们非常容易掌握。

最后,当他打开 300MHz 的笔记本(运行的是 Windows 98,也是在 1999 年冷冻起来的)时,他可能对 Netscape 4 和 Windows® Internet Explorer® 5 中显示的新页面效果很吃惊。当然,这些老式浏览器不认识新元素,会完全忽略它们,但是页面仍然会显示,内容仍然是完整的。

这并不是什么虚构的故事。HTML 5 的设计原则就是在不支持它的浏览器中能够平稳地退化。原因很简单:我们都是这样的 “原始人”。浏览器现在有选项卡、CSS 和 XmlHttpRequest,但是它们的 HTML 显示引擎仍然停留在 1999 年的水平。除了用户量大大增加之外,Web 其实在本质上没什么进步。HTML 5 考虑到了这一点。它目前为 Web 开发人员一些真正的好处,随着浏览器的缓慢升级,页面浏览者会逐渐享受到这些好处。

我们来看看 HTML 5 提供了什么。

(待续)

HTML / CSS 相关文章推荐
超酷炫 CSS3垂直手风琴菜单
Jun 28 HTML / CSS
纯CSS3实现的阴影效果
Dec 24 HTML / CSS
详解CSS 3 中的 calc() 方法
Jan 12 HTML / CSS
html5定制表单_动力节点Java学院整理
Jul 11 HTML / CSS
W3C公布最新的HTML5标准草案
Oct 17 HTML / CSS
html5 Canvas画图教程(1)—画图的基本常识
Jan 09 HTML / CSS
详解canvas绘图时遇到的跨域问题
Mar 22 HTML / CSS
Html+Css+Jquery实现左侧滑动拉伸导航菜单栏的示例代码
Mar 17 HTML / CSS
Canvas 文本填充线性渐变的使用详解
Jun 22 HTML / CSS
5个HTML5的常用本地存储方式详解与介绍
Mar 27 HTML / CSS
使用canvas仿Echarts实现金字塔图的实例代码
Nov 11 HTML / CSS
浅谈css清除浮动(clearfix和clear)的用法
May 21 HTML / CSS
HTML5的结构和语义(3):语义性的块级元素
Oct 17 #HTML / CSS
HTML5的结构和语义(2):结构
Oct 17 #HTML / CSS
HTML5的结构和语义(4):语义性的内联元素
Oct 17 #HTML / CSS
HTML5中语义化 b 和 i 标签
Oct 17 #HTML / CSS
HTML5的结构和语义(5):内嵌媒体
Oct 17 #HTML / CSS
HTML5的结构和语义(5):交互
Oct 17 #HTML / CSS
HTML5 语义化结构化规范化
Oct 17 #HTML / CSS
You might like
10条PHP高级技巧[修正版]
2011/08/02 PHP
php中利用explode函数分割字符串到数组
2014/02/08 PHP
PHP sleep()函数, usleep()函数
2016/08/25 PHP
一端时间轮换的广告
2006/06/26 Javascript
jQuery 1.2.x 升? 1.3.x 注意事项
2009/05/06 Javascript
jquery 多行滚动代码(附详细解释)
2010/06/17 Javascript
javascript学习笔记(四) Number 数字类型
2012/06/19 Javascript
Javascript setInterval的两种调用方法(实例讲解)
2013/11/29 Javascript
JS制作手机端自适应缩放显示
2015/06/11 Javascript
DOM中事件处理概览与原理的全面解析
2016/08/16 Javascript
Windows系统下安装Node.js的步骤图文详解
2016/11/15 Javascript
解决vue中无法动态修改jqgrid组件 url地址的问题
2018/03/01 Javascript
JavaScript对象拷贝与Object.assign用法实例分析
2018/06/20 Javascript
JS的函数调用栈stack size的计算方法
2018/06/24 Javascript
vue里面使用mui的弹出日期选择插件实例
2018/09/16 Javascript
layui table表格数据的新增,修改,删除,查询,双击获取行数据方式
2019/11/14 Javascript
webpack优化之代码分割与公共代码提取详解
2019/11/22 Javascript
使用Python脚本实现批量网站存活检测遇到问题及解决方法
2016/10/11 Python
关于Tensorflow中的tf.train.batch函数的使用
2018/04/24 Python
Python Numpy计算各类距离的方法
2019/07/05 Python
python Tensor和Array对比分析
2020/01/08 Python
Python实现病毒仿真器的方法示例(附demo)
2020/02/19 Python
Python生成六万个随机,唯一的8位数字和数字组成的随机字符串实例
2020/03/03 Python
tensorflow 20:搭网络,导出模型,运行模型的实例
2020/05/26 Python
Python实现粒子群算法的示例
2021/02/14 Python
CSS3毛玻璃效果(blur)有白边问题的解决方法
2016/11/15 HTML / CSS
荷兰包包购物网站:The Little Green Bag
2018/03/17 全球购物
幼儿园中秋节活动反思
2014/02/16 职场文书
优秀大学生自荐信
2014/06/09 职场文书
单位委托书
2014/10/15 职场文书
项目安全员岗位职责
2015/02/15 职场文书
护士自我推荐信范文
2015/03/24 职场文书
话题作文之诚信
2019/11/28 职场文书
新手必备Python开发环境搭建教程
2021/05/28 Python
如何使用PyCharm及常用配置详解
2021/06/03 Python
2022年四月新番
2022/03/15 日漫