网页的构造块

一个网页主要包括以下三个部分：
1.文本内容（text content）：在页面上让访问者了解页面内容的纯文字，比如关于业务、产品、家庭度假的内容，以及页面关注的其他任何内容。
2.对其他文件的引用（references to other files）：我们使用这些引用来加载图像、音频、视频文件，以及样式表（控制页面的显示效果）和JavaScript文件（为页面添加行为）。这些引用还可以指向其他的 HTML 页面和资源。
3.标记（markup）：对文本内容进行描述并确保引用正确地工作。（HTML一词中的字母 M 就代表标记。）

此外，在每个 HTML 页面的开头都有一些主要用于浏览器和搜索引擎（如 Bing、Duck Duck Go、Google、Yahoo 等）的信息。浏览器不会将这些信息呈现给访问者。
需要注意的是，网页的这些成分都仅由文本构成。这意味着网页可以保存为纯文本格式，可以在任何平台（无论是台式机、手机、平板电脑还是其他平台）上用任何浏览器查看。这个特性也确保了很容易创建 HTML 页面。

开始标签（如 < head>）用于标记元素的开始，结束标签（如 < /head>）用于标记元素的结束，有的元素没有结束标签。

< body>开始标签以上的内容都是为浏览器和搜索引擎准备的。
< !DOCTYPE html> 部 分（ 称 为DOCTYPE）告诉浏览器这是一个 HTML5 页面。DOCTYPE 应该始终位于页面的第一行。
接下来是 html 元素，它包着页面的其余部分， 即 < html lang=“en”> 和
< /html> 结 束标签（表示页面的结尾）之间的内容。在这里可以为网页指定其他语言。
再接下来是文档的头部，即 < head> 和< /head> 之间的区域。

标签的组成：元素（element）、属性（attribute）和值（value）。

有的元素有一个或多个属性，属性用来进一步描述元素。大多数元素既包含文本，也包含其他元素（就像基本页面中的 p 元素）。还有一些元素是空元素（empty element或 void element），既不包含文本也不包含其他元素。

如果一个元素包含另一个元素，它就是被包含元素的父元素，被包含元素称为子元素。子元素中包含的任何元素都是外层的父元素的后代。这种类似家谱的结构是 HTML 代码的关键特性，它有助于在元素上添加样式和应用 JavaScript 行为。
当元素中包含其他元素时，每个元素都必须嵌套正确，也就是子元素必须完全地包含在父元素中。使用结束标签时，前面必须有跟它成对的开始标签。换句话说，先开始元素 1，再开始元素2，就要先结束元素 2，再结束元素 1。

元素中包含的文本可能是网页上最基本的成分。
首先，浏览器呈现 HTML 时，会把文本中的多个空格或制表符压缩成单个空格，把回车符和换行符转换成单个空格，或者将它们一起忽略。
其次，HTML 过去只能使用 ASCII 字符。ASCII 只包括英语字母、数字和少数几个常用的符号。开发人员必须用特殊的字符引用来创建重音字符（在很多西欧语言中很常见）和许多日常符号，如 é（表示 é）、©（ 表 示 ©）等。

万维网充满生机的部分原因是页面之间的链接，以及图像、视频、音乐等。外部文件（如图像）实际上并没有放在HTML 文件中，而是单独保存的，页面只是简单地引用了这些文件。

对网页文件命名时要记住几点：

1. 文件名采用小写字母
2. 使用正确的扩展名
3. 用短横线分隔单词

URL（Uniform Resource Locator，统一资源定位符）是地址的别名。它包含关于文件存储位置和浏览器应如何处理它的信息。互联网上的每个文件都有唯一的 URL。
URL 的第一个部分称为模式（scheme）。模式告诉浏览器如何处理需要打开的文件。
URL 的第二个部分是文件所在的主机的名称，紧接着是路径，路径包含到达这个文件的文件夹以及文件自身的名称（这些都是可选的）。
有时，URL 路径不以文件名结尾，而以一个目录结尾（可以包含一个结尾的斜杠，也可以不包含）。

URL 可以是绝对的，也可以是相对的。绝对 URL（absolute URL）包含了指向目录或文件的完整信息，包括模式、主机名和路径。绝对 URL 就像是完整的通信地址，包括国家、州、城市、邮政编码、街道和姓名。无论邮件来自哪里，邮局都能找到收件人。就 URL 来说，这意味着绝对 URL 本身与被引用文件的实际位置无关，无论是在哪个主机上的网页中，某一文件的绝对 URL 都是完全一样的。
相对 URL 以包含 URL 本身的文件的位置为参照点，描述目标文件的位置。
因此，相对 URL 可以表达像“指向本页面同一目录下的 xyz 页面”这样的意思。

HTML 描述的是网页内容的含义，即语义（semantics）。在 Web 社区中，语义化 HTML（semantic HTML）指的是那些使用最恰当的 HTML 元素进行标记的内容，在标记的过程中并不关心内容显示。
HTML提供了六个标题级别，即 h1 ～ h6。其中，h1是最重要的一级，h2 是 h1 的子标题，h3 是h2 的子标题，以此类推，就像你使用文字处理软件编辑具有多级标题的文档一样。

语义很重要：
1提升可访问性和互操作性（内容对于借助辅助技术的残障访问者是可访问的，同时对于台式机、手机、平板电脑及其他设备上的浏览器都是可访问的）。
2提升搜索引擎优化（SEO）的效果。
3使维护代码和添加样式变得容易。
4（通常）使代码更少，页面加载更快。

每个 Web 浏览器都有一个内置 CSS 文件（一张样式表），它决定了每个HTML 元素的默认样式。你自己创建的 CSS可以覆盖这些样式。对于不同的浏览器，默认样式会稍有差异，但总体上相当一致。重要的是，HTML 所定义的内容的底层结构和含义是一致的。