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显示隐藏一个div特效的具体实现
Feb 10 HTML / CSS
CSS实现的一闪而过的图片闪光效果
Apr 23 HTML / CSS
css3实现可滑动跳转的分页插件示例
May 08 HTML / CSS
使用CSS3制作一个简单的Chrome模拟器
Jul 15 HTML / CSS
CSS3条纹背景制作的实战攻略
May 31 HTML / CSS
css3实现小箭头各种图形效果
Jul 08 HTML / CSS
详解利用css3的var()实现运行时改变scss的变量值
Mar 02 HTML / CSS
HTML5中如何显示视频呢 HTML5视频播放demo
Jun 08 HTML / CSS
HTML5中5个简单实用的API(第二篇,含全屏、可见性、拍照、预加载、电池状态)
May 07 HTML / CSS
HTML5新增加的功能详解
Sep 05 HTML / CSS
使用spring mvc+localResizeIMG实现HTML5端图片压缩上传的功能
Dec 16 HTML / CSS
HTML5超文本标记语言的实现方法
Sep 24 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
星际争霸秘籍
2020/03/04 星际争霸
用文本文件制作留言板提示(下)
2006/10/09 PHP
php识别翻转iphone拍摄的颠倒图片
2018/05/17 PHP
PHP7内核之Reference详解
2019/03/14 PHP
Laravel 解决composer相关操作提示php相关异常的问题
2019/10/23 PHP
Node.js生成HttpStatusCode辅助类发布到npm
2013/04/09 Javascript
JavaScript 模拟类机制及私有变量的方法及思路
2013/07/10 Javascript
JavaScript字符串插入、删除、替换函数使用示例
2013/07/25 Javascript
JavaScript jQuery 中定义数组与操作及jquery数组操作
2015/12/18 Javascript
Angularjs中$http以post请求通过消息体传递参数的实现方法
2016/08/05 Javascript
jQuery插入节点和移动节点用法示例(insertAfter、insertBefore方法)
2016/09/08 Javascript
微信小程序 共用变量值的实现
2017/07/12 Javascript
javascript cookie的基本操作(添加和删除)
2017/07/24 Javascript
JS实现图片切换效果
2018/11/17 Javascript
详解vue中router-link标签所必备了解的属性
2019/04/15 Javascript
JS使用正则表达式实现常用的表单验证功能分析
2020/04/30 Javascript
webpack+express实现文件精确缓存的示例代码
2020/06/11 Javascript
通过实例解析vuejs如何实现调试代码
2020/07/16 Javascript
跟老齐学Python之再深点,更懂list
2014/09/20 Python
python实现随机森林random forest的原理及方法
2017/12/21 Python
Python+PyQT5的子线程更新UI界面的实例
2019/06/14 Python
详解python pandas 分组统计的方法
2019/07/30 Python
Python continue语句实例用法
2020/02/06 Python
详解matplotlib中pyplot和面向对象两种绘图模式之间的关系
2021/01/22 Python
精选奢华:THE LIST
2019/09/05 全球购物
bonprix荷兰网上商店:便宜的服装、鞋子和家居用品
2020/07/04 全球购物
各营销点岗位职责范本
2014/03/05 职场文书
保护黄河倡议书
2014/05/16 职场文书
小学网上祭英烈活动总结
2014/07/05 职场文书
群众路线教育实践活动自我剖析思想汇报
2014/10/04 职场文书
2015年五一劳动节活动总结
2015/02/09 职场文书
2015年中个人总结范文
2015/03/10 职场文书
2015年食品安全宣传周活动总结
2015/07/09 职场文书
祝福语集锦:送给毕业同学祝福语
2019/11/21 职场文书
Mysql数据库值的添加、修改、删除及清空操作实例
2021/06/20 MySQL
实战Python爬虫爬取酷我音乐
2022/04/11 Python