本节书摘来自异步社区《HTML与CSS入门经典（第8版）》一书中的第1章，第1.3节,作者： 【美】Julie C. Meloni , Michael Morrison 更多章节内容可以访问云栖社区“异步社区”公众号查看。

1.3 理解Web内容交付

在许多不同的地方发生了多个过程，最终产生了你看到的Web内容。这些过程发生得很快——在几毫秒之内——而且是在幕后发生的。换句话说，当我们认为所作的一切是打开一个Web浏览器，输入Web地址，并且立即看到请求的内容时，幕后的技术正在为我们辛勤地工作。图1.1展示了浏览器和服务器之间的基本交互。

https://yqfile.alicdn.com/2cae06ce7fcd2e6e59419d682d77a8e750e9d4cf.png" >

但是，这个过程中有许多步骤，在你看到整个请求网站的内容之前，可能在浏览器和服务器中有多次往返。

假定你想要进行一次Google搜索，所以你认真地在地址栏输入 http://www.google.com 或者从书签列表中选择Google书签。你的浏览器几乎立即显示出如图1.2所示的画面。

图1.2显示了一个包含文本和一个图形（Google标志）的网站。从Web服务器读取这些文本和图像并且在你的屏幕上显示所发生的简单过程如下。

1．你的Web浏览器发出对位于 http://www.google.com/ 地址的index.html文件的一个请求。index.html文件不必是你在地址栏上输入的地址的一部分；你将在第2章中学习到更多关于index.html文件的知识。

2．在接收到对一个具体文件的请求后，Web服务器进程在它的目录中查找具体的文件，并且将该文件的内容发送回你的浏览器。

3．Web浏览器接受index.html文件的内容，这是由HTML代码标记的文本，并且根据HTML代码显示内容。在显示内容的同时，浏览器发现用于Google标识的HTML代码，这个标识在图1.2中可以看到。HTML代码类似以下代码：

<img src="logos/logo.gif" width="384" height="121" border="0" alt="google"/>

这个代码标记提供了告诉浏览器显示该标识所需要的文件源位置（src）、宽度（width）、高度（height）、边框类型（border）以及辅助文本（alt）。你将通过稍后的课程学习更多关于特性的知识。

4．浏览器查看标记中的src特性以查找源位置。在这个例子中，图像logo.gif可以在读取HTML文件的相同Web地址中找到。

5．浏览器请求 http://www.google.com/logos/logo.gif 上的文件。

6．Web服务器解释该请求，寻找该文件，并且将该文件的内容发送给请求它的浏览器。

7．Web浏览器在你的显示器上显示该图像。

正如你在Web内容交付过程的描述中看到的，Web浏览器所作的只是像你可以看到内容的一个像框。浏览器组合Web内容部件并且按照文件中的HTML命令安排这些部分。

你还可以在“本地”或者你的硬盘驱动器上查看Web内容，而不需要一个Web服务器。内容读取和显示的过程和前面列出的浏览器查找并且解释HTML文件的代码和内容的过程相同，但是旅程较短，浏览器在你自己的计算机硬盘上而不是远程机器上寻找文件。解释嵌入在文件中的基于服务器的编程语言需要一个Web服务器，但是这超出了本书的范围。实际上，你可以在没有Web服务器的情况下完成本书的所有课程，但是在你之外没有人能看到你的杰作。