第1章 网页制作基本知识.doc

第1章 网页制作基本知识 刚开始学习网页制作的人，往往不知道从何入手。针对这种情况，本章简单介绍一下网页相关的基础知识和网站建设的基本流程，以使大家对网页有个感性的认识，并从宏观的角度了解一下网站建设。 1.1 认识网站与网页 如果读者曾经有过上网的经历，对网站和网页应该不会感到陌生。网页就是我们上网时在浏览器中看到的一个个画面，网站则是一组相关网页的集合。一个小型网站可能只包含几个网页，而一个大型网站则可能包含成千上万个网页。 另外，打开某个网站时显示的第一个网页被称为网站的主页（或首页），它可以说是网站的门户，通过它不仅可以了解网站的性质和内容，还可以访问网站中的其它页面。 下面，我们从网页制作的角度来了解网页的本质和网页的功能组成，以及IP地址、域名、网址、静态网页和动态网页等概念。 1.1.1 网页的本质 图1-1上图显示了腾讯网的主页，由该画面可以看出，网页主要由文字、图像和动画等元素组成。事实上，我们看到的网页包括了一组文件，它们分别是网页文件（扩展名为：.html、.asp等）、图像文件（扩展名为.jpg、.gif等）和Flash动画文件（扩展名为.swf）等。在浏览器中选择“文件”→“另存为”菜单，将网页保存到磁盘中，便可看到网页的组成文件，如图1-1中、下图所示。 图1-1 网页及其组成 1.1.2 网页的功能组成 从浏览者的角度看，网页中无非就是一些文字、图像、动画等。但从专业的角度来讲，网页中的元素各有其不同的作用，可以将它们分为站标、导航栏、广告条、标题栏和按钮等，如图1-2所示。 图1-2 网页的功能组成 站标 站标也叫Logo，是网站的标志，其作用是使人看见它就能够联想到企业。因此，网站Logo通常采用企业的Logo。 Logo一般采用蕴含企业文化和特色的图案，或是与企业名称相关的字符或符号及其变形，当然也有很多是图文组合，如图1-3所示。 图1-3 网站Logo 在网页设计中，通常把Logo放在页面的左上角，大小没有严格要求：不过，考虑到网页显示空间的限制，要求Logo的尺寸不能太大。此外，Logo普遍没有过多的色彩和细腻的描绘。 导航条 导航条是链接到网站内主要页面的超链接组合，它可以引导浏览者轻松找到网站中的各个页面，导航条也因此而得名。同时，导航条也是网站中所有重要内容的概括，可以让浏览者在最短时间内了解网站的主要内容。 设计导航条时，应注意以下几点。 如果网站内容不多，可根据网站风格尝试灵活摆放导航条，也可以使用图片或Flash动画等制作导航条，如图1-4所示。 如果网站栏目很多，可以将导航条分为多排放置在Logo的下方或右侧。为便于观看，可为各排设置不同的底色，如图1-5所示。 图1-4 灵活摆放的导航条 图1-5 多排导航条 广告条 广告条又称Banner，其功能是宣传网站或替其它企业做广告。Banner的尺寸可以根据版面需要来安排。 在Banner的制作过程中有以下几点需要注意。 Banner可以是静态的，也可以是动态的。现在使用动态的居多，动态画面容易引起浏览者的注意。 Banner的体积不易过大，尽量使用GIF格式图片与动画或Flash动画，因为这两种格式的文件体积小，载入时间短。 Banner中的文字不要太多，只要达到一定的提醒效果就可以，通常是一两句企业的广告语。 Banner中图片的颜色不要太多，尤其是GIF格式的图片或动画。要避免出现颜色的渐变和光晕效果，因为GIF格式仅支持256种颜色，颜色的连续变换会看出明显的断层甚至光斑，影响效果。 标题栏 此处的标题栏不是指整个网页的标题栏，而是网页内部各板块的标题栏，是各板块内容的概括。它使得网页内容的分类更清晰、明了，大大地方便了浏览者。 标题栏可以是文字加不同颜色的背景，也可以是图片，这要根据网站的内容和规模来决定，如图1-6所示。 图1-6 标题栏 按钮 在现实生活中，按钮通常是启动某些装置或机关的开关。网页中的按钮也沿用了这个概念。网页中的按钮被点击之后，网页会实现相应的操作，比如页面跳转或数据的传输等，图1-7是比较常见的几个网页按钮。 图1-7 按钮 1.1.3 IP地址、域名与网址 1. IP地址 虽然互联网上连接了不计其数的服务器与客户机，但它们并不是杂乱无章的。每一个主机在互联网上都有唯一的地址，我们称这个地址为IP地址（Internet Protocol Address）。IP地址有4个小于256的数字组成，数字之间用点间隔。例如“26”就是一个IP地址。 2. 域名 由于IP地址在使用过程中难于记忆和书写，人们又发明了一种与IP地址对应的字符来表示地址，这就是域名。每一个网站都有自己的域名，并且域名是独一无二的。例如，我们只需要在