第 1章 网站设计与网页制作基础
本章要点：
网站的概念
网站的设计与实现
HTML及其语法
1.1 网站概述
1.1.1 Internet与 Web服务
Internet是一个覆盖范围极广，功能极其强大的网络，在 Internet
上用户可以享受很多服务,Web服务是目前 Internet上很重要也是用户最多的一项服务。
Web服务最初是由日内瓦欧洲核物理研究中心（ CERN）开发的一个科研项目,1990年底研制成功并投入使用。
1993年初，美国国家超级计算机应用中心（ NCSA）开发的基于图形用户界面的 MOSAIC浏览器问世，使得 Web服务得以突飞猛进地发展。
随后,Internet上 Web服务器的数量也成几何数增长，并使得 Web
服务迅速成为 Internet上最有吸引力的服务之一。
1.1.2 网页与网站
Internet上各式超文本文件称为网页（ Page）。其中其中超文本
（ Hypertext）是一种文件格式，是一种对信息的描述方法，这种描述方法不受系统平台的限制，可以在不同的平台上使用，用户也可以在各种操作系统上浏览这些超文本文件。
在每一个页面上，可以有一些词、语句或图片等作为,链接点
（ Link）,,通过这些链接点可以快速地跳转到本网站的其它页面或其它网站上的页面。这种,链接点,方式称为超链接。
存放这些页面的服务器称为网站。
1.2 网站设计
1.2.1 网站规划
1．确定主题和目的
2．可行性分析可行性分析是指分析建设者是否有能力建设和维护网站，即这个网站的制作在经济上及技术上是否可行，是否具备一定的经济效益和社会效益，是否值得为制作和维护网站而付出时间、精力和金钱。
3．确定网站的功能、形式
1.2.2 网站实现
1．服务器选择
2．网页的编写
3．网页调试
4．网页的发布
5．维护与管理
1.3 HTML概述
1.3.1 HTML简介
HTML语言是由一个世界性的标准化组织 W3C（ World Wide
Web Consortium）制定出来的。
该语言自 1990年问世以来，迄今为止已经发行了 4个版本。
现在最新的是 HTML4.0版本，通过浏览
,http://www.w3.org/pub/www/”站点，可以了解 HTML标准的最新动态。
HTML文件本身是一个 ASCII文件，在任何文本编辑器中都可以进行编辑，当一个 HTML文件编辑好后，必须用扩展名,,htm”或
,.html”来存储，以表示该文件是 HTML文档。
一个 HTML文件是由内容和标记构成的。
1.3.2 HTML基本语法
HTML文件通常由 4个主要的标识元素构成，基本格式为：
<HTML>
<HEAD>
<TITLE>HTML文件标题演示 </TITLE>
</HEAD>
<BODY>HTML文件的内容在这里显示
</BODY>
</HTML>
下面简单介绍一些 HTML文件中常见的标记及其功能与用法
1．子标题标记
HTML定义了 6个级别的子标题，从 <H1>到 <H6>，数字越小，字号越大。定义格式为,<Hn>子标题名称 </Hn>。
２．分段、换行、原样显示标记
<P>：段落标记，它是一个双向标记，相当于回车换行 。
<BR>：也是一个换行标识，同样也是一个双向标记。不同于
<P>的是，由它定义的换行，两行之间不留空行。
<PRE>：双向标识，标识以原始文本格式进行显示。
3．超文本链接标记
<A>：双向标识，用于标识超文本链接。使用格式为：
<A>超链接标记 </A>创建的超链接可以有以下几种形式：
（ 1）链接到其它网页
（ 2）链接到本网页的其它部分
（ 3）链接到 FTP服务器定义格式为,<A HREF=FTP服务器地址 >超链接标记 </A>。
（ 4）链接到 E-mail地址定义格式为,<A HREF=”mail to,URL”>超链接标记 </A>。
（ 5）将图像作为超链接标记在网页中嵌入图像：定义格式为,<IMG
SRC=”图像文件名或 URL”>。
4．网页文本修饰标记修饰网页文本的标记非常丰富，下面列举几种主要的标记
（ 1）字体修饰
（ 2）设置字号和颜色 定义格式为：
<FONT COLOR=#c size=n>文字 …… </FONT>
（ 3）居中显示 定义格式为,<CENTER>文字 …… </CENTER>。
（ 4）横线标识
5,HTML标记应用举例
HTML代码如下：
<html>
<head>
<title>我的个人网站首页 </title>
</head>
<body>
<h1>欢迎光临个人网站：（这里是标题 1） </h1>
<hr noshade color="#000000" align="left">
<h2>互联网简介（这里是标题 2） </h2>
<p align="center">
<font color=“#FF0000” face=“黑体,>随着
<a href="http://www.w3.org/china/index.htm">Internet</a>技术的飞速发展,Internet用户正以指数级速度在增长。
<img border="0" src="file:///d:/ie.JPG" align="right" width="58"
height="63">
</font></p>
<p><br><font size="2">现在已经没有人怀疑，是 Internet打破了传统的信息传播方式，是 Internet实现了世界范围内的网络间的互联和资源共享。 </font></p>
<p>它没有地理上的差别和时间上的限制，具有其独有的互联、开放和共享模式，真正的将全世界紧密的联系在一起。 </p>
</br>
</body>
</html>
网页的浏览效果如下图小结
本章主要讲述了网站的基本概念及网站与网页的关系，
重点讲述了网站的设计过程，包括如何规划和实现。另外，还简单地讲解了 HTML语言及其基本用法。通过本章的学习，用户应该了解到,Internet上的五颜六色、精彩纷呈的网站都是经过了哪些制作步骤来实现的，具体采用了哪些技术等。尤其是和网页分不开的 HTML语言，
它是标准的超文本标记语言，其编程方法及特点和其它高级编程语言有着很大的不同之处。不管以后采用何种方法创作网页，了解 HTML语言的基本语法对制作网页是很有帮助的。
本章要点：
网站的概念
网站的设计与实现
HTML及其语法
1.1 网站概述
1.1.1 Internet与 Web服务
Internet是一个覆盖范围极广，功能极其强大的网络，在 Internet
上用户可以享受很多服务,Web服务是目前 Internet上很重要也是用户最多的一项服务。
Web服务最初是由日内瓦欧洲核物理研究中心（ CERN）开发的一个科研项目,1990年底研制成功并投入使用。
1993年初，美国国家超级计算机应用中心（ NCSA）开发的基于图形用户界面的 MOSAIC浏览器问世，使得 Web服务得以突飞猛进地发展。
随后,Internet上 Web服务器的数量也成几何数增长，并使得 Web
服务迅速成为 Internet上最有吸引力的服务之一。
1.1.2 网页与网站
Internet上各式超文本文件称为网页（ Page）。其中其中超文本
（ Hypertext）是一种文件格式，是一种对信息的描述方法，这种描述方法不受系统平台的限制，可以在不同的平台上使用，用户也可以在各种操作系统上浏览这些超文本文件。
在每一个页面上，可以有一些词、语句或图片等作为,链接点
（ Link）,,通过这些链接点可以快速地跳转到本网站的其它页面或其它网站上的页面。这种,链接点,方式称为超链接。
存放这些页面的服务器称为网站。
1.2 网站设计
1.2.1 网站规划
1．确定主题和目的
2．可行性分析可行性分析是指分析建设者是否有能力建设和维护网站，即这个网站的制作在经济上及技术上是否可行，是否具备一定的经济效益和社会效益，是否值得为制作和维护网站而付出时间、精力和金钱。
3．确定网站的功能、形式
1.2.2 网站实现
1．服务器选择
2．网页的编写
3．网页调试
4．网页的发布
5．维护与管理
1.3 HTML概述
1.3.1 HTML简介
HTML语言是由一个世界性的标准化组织 W3C（ World Wide
Web Consortium）制定出来的。
该语言自 1990年问世以来，迄今为止已经发行了 4个版本。
现在最新的是 HTML4.0版本，通过浏览
,http://www.w3.org/pub/www/”站点，可以了解 HTML标准的最新动态。
HTML文件本身是一个 ASCII文件，在任何文本编辑器中都可以进行编辑，当一个 HTML文件编辑好后，必须用扩展名,,htm”或
,.html”来存储，以表示该文件是 HTML文档。
一个 HTML文件是由内容和标记构成的。
1.3.2 HTML基本语法
HTML文件通常由 4个主要的标识元素构成，基本格式为：
<HTML>
<HEAD>
<TITLE>HTML文件标题演示 </TITLE>
</HEAD>
<BODY>HTML文件的内容在这里显示
</BODY>
</HTML>
下面简单介绍一些 HTML文件中常见的标记及其功能与用法
1．子标题标记
HTML定义了 6个级别的子标题，从 <H1>到 <H6>，数字越小，字号越大。定义格式为,<Hn>子标题名称 </Hn>。
２．分段、换行、原样显示标记
<P>：段落标记，它是一个双向标记，相当于回车换行 。
<BR>：也是一个换行标识，同样也是一个双向标记。不同于
<P>的是，由它定义的换行，两行之间不留空行。
<PRE>：双向标识，标识以原始文本格式进行显示。
3．超文本链接标记
<A>：双向标识，用于标识超文本链接。使用格式为：
<A>超链接标记 </A>创建的超链接可以有以下几种形式：
（ 1）链接到其它网页
（ 2）链接到本网页的其它部分
（ 3）链接到 FTP服务器定义格式为,<A HREF=FTP服务器地址 >超链接标记 </A>。
（ 4）链接到 E-mail地址定义格式为,<A HREF=”mail to,URL”>超链接标记 </A>。
（ 5）将图像作为超链接标记在网页中嵌入图像：定义格式为,<IMG
SRC=”图像文件名或 URL”>。
4．网页文本修饰标记修饰网页文本的标记非常丰富，下面列举几种主要的标记
（ 1）字体修饰
（ 2）设置字号和颜色 定义格式为：
<FONT COLOR=#c size=n>文字 …… </FONT>
（ 3）居中显示 定义格式为,<CENTER>文字 …… </CENTER>。
（ 4）横线标识
5,HTML标记应用举例
HTML代码如下：
<html>
<head>
<title>我的个人网站首页 </title>
</head>
<body>
<h1>欢迎光临个人网站：（这里是标题 1） </h1>
<hr noshade color="#000000" align="left">
<h2>互联网简介（这里是标题 2） </h2>
<p align="center">
<font color=“#FF0000” face=“黑体,>随着
<a href="http://www.w3.org/china/index.htm">Internet</a>技术的飞速发展,Internet用户正以指数级速度在增长。
<img border="0" src="file:///d:/ie.JPG" align="right" width="58"
height="63">
</font></p>
<p><br><font size="2">现在已经没有人怀疑，是 Internet打破了传统的信息传播方式，是 Internet实现了世界范围内的网络间的互联和资源共享。 </font></p>
<p>它没有地理上的差别和时间上的限制，具有其独有的互联、开放和共享模式，真正的将全世界紧密的联系在一起。 </p>
</br>
</body>
</html>
网页的浏览效果如下图小结
本章主要讲述了网站的基本概念及网站与网页的关系，
重点讲述了网站的设计过程，包括如何规划和实现。另外，还简单地讲解了 HTML语言及其基本用法。通过本章的学习，用户应该了解到,Internet上的五颜六色、精彩纷呈的网站都是经过了哪些制作步骤来实现的，具体采用了哪些技术等。尤其是和网页分不开的 HTML语言，
它是标准的超文本标记语言，其编程方法及特点和其它高级编程语言有着很大的不同之处。不管以后采用何种方法创作网页，了解 HTML语言的基本语法对制作网页是很有帮助的。
