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 相关文章推荐
分享8款纯CSS3实现的搜索框功能
Sep 14 HTML / CSS
使用CSS3创建动态菜单效果
Jul 10 HTML / CSS
纯css实现照片墙3D效果的示例代码
Nov 13 HTML / CSS
HTML5 device access 设备访问详解
May 24 HTML / CSS
HTML5中的进度条progress元素简介及兼容性处理
Jun 02 HTML / CSS
HTML5中的Web Notification桌面右下角通知功能的实现
Apr 19 HTML / CSS
详解android与HTML混合开发总结
Jun 06 HTML / CSS
HTML5 图片预加载的示例代码
Mar 25 HTML / CSS
HTML5 直播疯狂点赞动画实现代码 附源码
Apr 14 HTML / CSS
uniapp+Html5端实现PC端适配
Jul 15 HTML / CSS
HTML5拖拽文件上传的示例代码
Mar 04 HTML / CSS
纯 CSS 自定义多行省略的问题(从原理到实现)
Nov 11 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
新版mysql+apache+php Linux安装指南
2006/10/09 PHP
使用PHP的日期与时间函数技巧
2008/04/24 PHP
过滤掉PHP数组中的重复值的实现代码
2011/07/17 PHP
获取URL文件名后缀
2013/10/24 PHP
PHP面向对象精要总结
2014/11/07 PHP
ThinkPHP框架搭建及常见问题(XAMPP安装失败、Apache/MySQL启动失败)
2016/04/15 PHP
ajax+php实现无刷新验证手机号的实例
2017/12/22 PHP
XHTML-Strict 内允许出现的标签
2006/12/11 Javascript
网页中的图片的处理方法与代码
2009/11/26 Javascript
Javascript this 的一些学习总结
2012/08/02 Javascript
js获得指定控件输入光标的坐标兼容IE,Chrome,火狐等多种主流浏览器
2013/05/21 Javascript
Javascript浅谈之引用类型
2013/12/18 Javascript
ie7+背景透明文字不透明超级简单的实现方法
2014/01/17 Javascript
jQuery内置的AJAX功能和JSON的使用实例
2014/07/27 Javascript
jQuery搜索子元素的方法
2015/02/10 Javascript
jQuery实现列表内容的动态载入特效
2015/08/08 Javascript
JavaScript如何动态创建table表格
2020/08/02 Javascript
jquery中$.fn和图片滚动效果实现的必备知识总结
2017/04/21 jQuery
原生JavaScript实现的简单省市县三级联动功能示例
2017/05/27 Javascript
vue中如何创建多个ueditor实例教程
2017/11/14 Javascript
vue项目中引入noVNC远程桌面的方法
2018/03/05 Javascript
Vue-router 中hash模式和history模式的区别
2018/07/24 Javascript
解决vue中修改了数据但视图无法更新的情况
2018/08/27 Javascript
js继承的这6种方式!(上)
2019/04/23 Javascript
vue 使用高德地图vue-amap组件过程解析
2019/09/07 Javascript
[00:12]2018DOTA2亚洲邀请赛 sylar表现SOLO技艺
2018/04/06 DOTA
Python操作SQLite简明教程
2014/07/10 Python
Pycharm学习教程(1) 定制外观
2017/05/02 Python
spyder 在控制台(console)执行python文件,debug python程序方式
2020/04/20 Python
Django实现前台上传并显示图片功能
2020/05/29 Python
美国一家运动专业鞋类零售商:Warehouse Shoe Sale(WSS)
2018/03/28 全球购物
工作人员思想汇报
2014/01/09 职场文书
房地产财务管理制度
2014/02/02 职场文书
汉语言文学毕业求职信
2014/07/17 职场文书
印刷技术专业自荐信
2014/09/18 职场文书
Pytorch中的数据集划分&正则化方法
2021/05/27 Python