前端设计

学习Html5建站教程（一）Html5简介

杨青 2013-07-07前端设计

Html5简介

Html5中的数字5表示这个标准是html的后续版本（在xhtml之前，html的版本号是4.01）。当然这个解释也不完全正确，因为在htnl5支持自html4.01发布以来的十年间出现在网页中的所有新东西，包括严格的xhtml风格的与法和大量的JavaScript创新。但不管怎么说，这个名字仍然很清楚的表明：html5虽然支持xhtml的规定，但它要求的则是html的规则。

提示：w3c官方html5标准的网址是：www.w3.org/TR/html5

Html5 实用至上：

Html5中添加了更多交互功能。拖放、可编辑的html内容、在Can中绘制二维图形等，这些功能在我们身边的网页中并不鲜见，只不过有的通过Adobe Flash或者微软的Silverlight等插件实现，还有部分用JavaScript代码来实现。Flash等浏览器插件不会一夜之间就消失（甚至随后几年都不会）。不过，html5的终极目标很清楚：让网站不依赖插件也能够提供视频、丰富的交互功能以及各种漂亮的效果。

Html5 文档类型：

每个html5文档的第一行都必须是一个特定的文档类型声明。

<!DOCTYPE html>

Html5的文档类型声明给人的第一印象是很简单的。特别是跟冗长的xhtml1.0文档类型声明比较，特点更明显：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

看到这如此复杂的文档类型声明，从来都是复制粘贴。

Html5的文档类型声明可以出发所有具备标准模式的浏览器的标准模式，包括那些对html5一无所知的浏览器，因此，从现在起，你可以在任何网页中都使用html5文档类型声明。

字符编码：

字符编码是一种编码，计算机根据它把文本转换成保存在文档中的字节序列。现在的编码有很多，英文的网站基本上使用的是UTF-8，杨青个人博客网站用的是gb2312简体中文编码。

如果没有添加字符编码，刚好用户浏览了UTF-8的网站后，又浏览了一个gb2312编码的中文网站，那么浏览器就会猜测，这种情况下，很可能造成网页乱码。因此最好在web标记中加上编码信息。

html5 <head>区域添加字符编码：

页面语言：

指明web中使用的语言是一种好习惯。这对搜索引擎和浏览器是有帮助的。

注：en定义语言为英语 zh-CN定义语言为中文。各国的语言代码查询：http://people.w3.org/rishida/utils/subtags/

添加样式表：

过去网页要求的type="text/css"属性就没有必要了。

添加JavaScript：

省去了language=”JavaScript”属性。如果你在IE中要花大量的时间测试包含JavaScript页面，还应该在head区域中包含一行特殊的注释：web标志（mark of web）这行注释要放在指定字符编码的元素标签后面，例如：

<head>

<title>学习Html5建站教程（一）Html5简介</title>

</head>

这条注释告诉IE将页面视为从远程网站上下载下来的。否则，IE会切换到一种特殊的锁定模式，弹出一条安全警告，在你点亮“允许阻止的内容”按钮之后才会执行JavaScript代码。其他所有浏览器都会忽略这个“web标志”注释。对远程站点和本地文件使用相同的安全设置。

本节最终结果：

如果你按照上面的步骤做了，那么会是这样一个html5文档：