HTML+CSS+JavaScript网页制作:Web前端开发(第3版)
上QQ阅读APP看书,第一时间看更新

1.1 Web简介

对于网页设计开发者而言,在动手制作网页之前,应该先了解Web的基础知识。

1 Web的基本概念

1.1.1 WWW和浏览器的基本概念

WWW是World Wide Web的缩写,又称3W或Web,中文译名为“万维网”。它作为应用于Internet的新一代用户界面,摒弃了以往纯文本方式的信息交互手段,采用超文本(Hypertext)方式工作。利用该技术可以为企业提供全球范围的多媒体信息服务,使企业获取信息的手段有了根本性的改善,与之密切相关的是浏览器(Browser)。

浏览器实际上就是用于网上浏览的应用程序,其主要作用是显示网页和解释脚本。对多数设计者而言,不需要知道有关浏览器实现的技术细节,只要知道如何熟练掌握和使用它即可。用户只需要操作鼠标,就可以得到来自世界各地的文档、图片或视频等信息。

浏览器种类很多,目前常用的有Google的Chrome、Microsoft的Edge、Mozilla的Firefox、Opera、Apple的Safari浏览器等。

浏览器的核心部分是Rendering Engine(渲染引擎),一般称为“浏览器内核”,负责对网页语法(如HTML、JavaScript)进行解释并渲染(显示)网页。不同的浏览器内核对网页编写语法的解释会有所不同,因此同一网页在不同内核的浏览器里的渲染效果也可能不同。这正是网页编写者需要在不同内核的浏览器中测试网页显示效果的原因。现在主流浏览器采用的内核见表1-1。

表1-1 主流浏览器采用的内核

1.1.2 URL

URL(Universal Resource Locator,统一资源定位器)就是Web地址,俗称“网址”。Internet上的每一个网页都具有一个唯一的名称标识,通常称之为URL地址。这种地址可以指向本地磁盘,也可以指向局域网上的某一台计算机,但更多地指向Internet上的站点。URL的基本结构如下所示。

其中各部分的含义如下所述。

1.通信协议

通信协议是指URL所链接的网络服务的性质,如HTTP代表超文本传输协议,FTP代表文件传输协议等。

2.服务器名称

服务器名称是指提供服务的主机的名称。冒号后面的数字是通信端口编号,可有可无。这个编号用来告诉HTTP服务器的TCP/IP软件该打开哪一个通信端口。因为一台计算机常常会同时作为Web、FTP等服务器使用,为便于区别,每种服务器要对应一个通信端口。

3.文件夹与文件名

文件夹是存放文件的地方,如果是多级文件目录,必须依次指定各级文件夹,直到找到文件所在的位置。文件名是指包括文件名与扩展名在内的完整名称。

1.1.3 超文本

超文本技术是一种把信息根据需要链接起来的信息管理技术。用户可以通过一个文本的链接指针打开另一个相关的文本。只要单击页面中的超链接(通常是带下画线的条目或图片),便可跳转到新的页面或另一位置以获得相关的信息。

超链接是内嵌在文本或图像中的。文本超链接在浏览器中通常带有下画线,只有当用户的鼠标指向它时,指针才会变成手指形状。

1.1.4 超文本标记语言HTML

网页是WWW的基本文档,它是用HTML(HyperText Markup Language,超文本标记语言)编写的。HTML严格来说并不是一种标准的编程语言,它只是一些能让浏览器看懂的标记。当网页中包含正常文本和HTML标记时,浏览器会“翻译”由这些HTML标记提供的网页结构、外观和内容等信息,从而将网页按设计者的要求显示出来。图1-1所示是显示在Windows“记事本”程序中用HTML编写的网页源代码,图1-2所示是该源代码经过浏览器“翻译”后显示的网页画面。

图1-1 HTML编写的网页源代码

图1-2 浏览器“翻译”后显示的网页画面

1.1.5 HTTP

HTTP(HyperText Transfer Protocol,超文本传输协议)是用于从WWW服务器传输超文本到本地浏览器的传送协议,用于传送WWW方式的数据。当用户想浏览一个网站的时候,只要在浏览器的地址栏里输入网站的地址就可以了,例如www.baidu.com,在浏览器的地址栏里出现的是http://www.baidu.com。

HTTP采用了请求/响应模型。客户端向服务器发送一个请求,请求头包含请求的方法、URI(Uniform Resource Identifier,统一资源标识符)、协议版本,以及包含请求修饰符、客户信息和内容的类似于MIME(Multipurpose Internet Mail Extensions,多用途互联网邮件扩展类型)的消息结构。服务器以一个状态行作为响应,内容包括消息协议的版本、服务器信息、实体元信息以及可能的实体内容。