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中用animation的steps属性制作帧动画
Apr 25 HTML / CSS
CSS3模块的目前的状况分析
Feb 24 HTML / CSS
css3和jquery实现的可折叠导航菜单适合放在手机网页的导航菜单
Sep 02 HTML / CSS
CSS3实现swap交换动画
Jan 19 HTML / CSS
详解CSS3浏览器兼容
Dec 14 HTML / CSS
浅谈CSS3鼠标移入图片动态提示效果(transform)
Nov 06 HTML / CSS
css3 transform过渡抖动问题解决
Oct 23 HTML / CSS
HTML5 progress和meter控件_动力节点Java学院整理
Jul 06 HTML / CSS
移动端Html5页面生成图片解决方案
Aug 07 HTML / CSS
Html5之自定义属性(data-,dataset)
Nov 19 HTML / CSS
Html5基于canvas实现电子签名并生成PDF文档
Dec 07 HTML / CSS
简单实现一个手持弹幕功能+文字抖动特效
Mar 31 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
PHP与MySQL开发中页面出现乱码的一种解决方法
2007/07/29 PHP
PHP采集利器 Snoopy 试用心得
2011/07/03 PHP
thinkPHP下ueditor的使用方法详解
2015/12/26 PHP
PHP实现活动人选抽奖功能
2017/04/19 PHP
PHP实现腾讯与百度坐标转换
2017/08/05 PHP
Laravel timestamps 设置为unix时间戳的方法
2019/10/11 PHP
Laravel配合jwt使用的方法实例
2020/10/25 PHP
Ext JS 4实现带week(星期)的日期选择控件(实战一)
2013/08/21 Javascript
DIV始终居中的js代码
2014/02/17 Javascript
谷歌showModalDialog()方法不兼容出现对话窗口的解决办法
2016/02/15 Javascript
jQuery简单设置文本框回车事件的方法
2016/08/01 Javascript
获取select的value、text值的简单示例(jquery与javascript)
2016/12/07 Javascript
vue2.0结合Element实现select动态控制input禁用实例
2017/05/12 Javascript
vue页面加载闪烁问题的解决方法
2018/03/28 Javascript
简述vue路由打开一个新的窗口的方法
2018/11/29 Javascript
浅谈layer弹出层按钮颜色修改方法
2019/09/11 Javascript
Vue 解决通过this.$refs来获取DOM或者组件报错问题
2020/07/28 Javascript
[40:05]LGD vs Winstrike 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
python检测服务器是否正常
2014/02/16 Python
Python守护进程用法实例分析
2015/06/04 Python
python3获取当前文件的上一级目录实例
2018/04/26 Python
Python使用sqlalchemy模块连接数据库操作示例
2019/03/13 Python
python3 批量获取对应端口服务的实例
2019/07/25 Python
python paramiko远程服务器终端操作过程解析
2019/12/14 Python
python深copy和浅copy区别对比解析
2019/12/26 Python
Selenium+BeautifulSoup+json获取Script标签内的json数据
2020/12/07 Python
英国在线药房:Chemist.co.uk
2019/03/26 全球购物
大学生标准推荐信范文
2013/11/25 职场文书
我的求职计划书
2014/01/10 职场文书
信息专业毕业生五年职业规划参考
2014/02/06 职场文书
企业安全生产演讲稿
2014/05/09 职场文书
精神文明建设标语
2014/06/16 职场文书
作风整顿个人剖析材料
2014/10/06 职场文书
毕业论文致谢词
2015/05/14 职场文书
党员读书活动心得体会
2016/01/14 职场文书
56句经典英文座右铭
2019/08/09 职场文书