[优秀毕业设计精品] 个人网页设计.doc

《[优秀毕业设计精品] 个人网页设计.doc》由会员分享，可在线阅读，更多相关《[优秀毕业设计精品] 个人网页设计.doc（40页珍藏版）》请在三一办公上搜索。

1、毕业设计(论文)题目名称： 个人网站设计 年 级： 09级 层次：本科专科学生学号： 指导教师： 学生姓名： 技术职称： 讲师 学生专业： 计算机网络 所在系： 信息工程系 制毕业设计（论文）任务书题目名称： 个人网站设计 题目性质真实题目虚拟题目学生学号： 指导教师： 学生姓名： 专业名称： 计算机网络 技术职称： 讲师 学生层次： 专科 所在系： 信息工程系 2011年10月29日毕业设计（论文）内容与要求：内容： 毕业设计领导小组负责人： （签字） 2011年10月29日毕业设计（论文）评审表过程评分评阅成绩答辩成绩总成绩(百分制) (是否评定为优秀毕业论文)1、指导教师评语建议成绩_

2、指导教师签字： 年 月 日 2、论文评阅教师评语建议成绩_ 评阅教师签字： 年 月 日 3、毕业答辩专家组评语建议成绩_ 答辩组长签字： 年 月 日 4、毕业设计领导小组推优评语组长签字： 年 月 日 毕业设计(论文)过程评分表(40)学生姓名：学生班级：总分：内容态度、纪律（10%）用所学知识分析解决问题的能力（20%）设计（论文）书写和水平（10%）考核环节团结协作有钻研精神爱护公物文明卫生遵守纪律和制度独立地、熟练地、综合应用所学知识分析解决问题的能力工作量难度取得阶段性成果的水平、学术价值和应用价值分值3342055评分评分教师：评分时间：年月日毕业设计(论文)评阅成绩表(30)学生姓

3、名：学生班级：总分：内容设计（论文）内容（10%）设计（论文）水平（10%）设计（论文）书写（10%）考核环节内容充实、有阶段性成果，即有学术或应用价值。方案选择、论证、设计、计算正确如实反映设计成果，有实验数据，又有理论分析。中文摘要符合要求语句通顺符合逻辑思路清晰图表和曲线清晰符合规范、文字工整分值1010523评分评分教师：评分时间：年月日毕业设计(论文)答辩成绩表(30)学生姓名：学生班级：总分：内容设计（论文）内容（10%）回答问题（10%）设计（论文）质量（10%）考核环节内容充实、有足够的难度和工作量，在规定的时间内能够流畅地阐明报告设计（论文）内容能够回答与设计（论文）相关的基

4、本问题和扩展问题论文有数据，有分析，所用数据可靠、分析正确分值101010评分评分教师：评分时间：年月日个人网页设计摘要随着网络信息的飞速发展，网络传媒已被越来越多的企业看好，而网站就是传媒很好的一种方式，目前有很多企业都在开发属于自己的网站，所以研究网站建设是很有必要的。本文针对开发网站的ASP(Active Server Pages)技术做了具体的阐述，说明了ASP(Active Server Pages)服务器的安装及IIS的配置。数据库系统是对数据进行存储，管理，处理和维护的软件系统，每个动态网站都必须牵涉到数据库，数据库的地位是非常重要的，本文根据数据库尽可能不重复，以最优的方式组织

5、数据的特点，对数据的增、删、改和检索由统一软件进行管理和控制。数据库和ASP(Active Server Pages)技术也是本文研究的主要对象。本文运用ASP(Active Server Pages)技术、数据库和相应的网站开发软件，阐述了网站前后台设计，并对其功能进行了论述，实现了整个网站功能的使用。通过对整个网站的设计，说明了在制作过程中遇到常见问题的解决方法。关键字：ASP技术,软件工程,数据库目录第一章 绪论- 1 -1.1 网页制作的背景和意义- 1 -1.2 相关术语的阐述- 2 -第二章 网页开发环境及数据库概述- 3 -2.1 网页运行环境的开发- 3 -2.2 ASP和AD

6、O简介- 3 -221 ASP产生的历史环境- 3 -2.2.2 ADO对象- 5 -2.3 网页图像设计工具Photoshop- 7 -2.4网页设计工具Dreamweaver- 7 -第三章 网页需求分析- 9 -3.1 可行性分析- 9 -3.1.1网页的界面设计- 9 -3.2网站需求分析- 9 -3.2.1建站目的- 9 -3.2.2网站实现功能- 10 -第四章 网站的总体规划- 11 -4.1 制作网页的一般步骤- 11 -4.2 网页包括的元素- 11 -4.3 网页层次结构- 13 -第五章 网页设计的相关步骤- 14 -5.1 制作前的工作- 14 -5.1.1定义的方法-

7、 14 -5.1.2基本设置- 15 -5.2 建立超链接- 20 -5.2.1 基本设置- 20 -5.2.2 图片链接- 21 -5.2.3 热区链接- 22 -第六章 需要解决的几个相关问题- 24 -61 数据库技术- 24 -62 数据库连接技术- 24 -63 数据库写入技术- 25 -64 数据库的读取技术- 26 -65 记录集合的建立- 27 -第七章 网页测试- 28 -71 网页测试- 28 -72 网页发布及维护- 28 -第八章 总结- 30 -致谢- 32 -参考文献- 33 -引言随着二十一世纪新兴科技的飞速发展，如今的电子信息产业正在经受着一个巨大的挑战，同时也

8、面临着一个重大的机遇。就目前的科技发展水平而言，电子信息产业的发展已经不能够满足社会化大生产的要求，因此，各个国家集中人力、财力加大对信息技术产业的投入，以适应目前需要。可喜的是在这几十年的发展中我们有了互联网。互联网加大了我们了解世界的眼界，缩紧了人与人之间的距离，这就更容易的使我们走上信息化的道路。Internet在中国的迅速发展,人们日常生活中越来越多地使用这项新的技术来为自己的工作和学习服务。由于WEB页面能把文本、图像、声音、动画、视像等多种媒体信息集于一体，不但使信息的显示更加生动，而且使信息的浏览更为方便,同时WEB页能实现网上交易平台、客户信息反馈，方便了企业与客户之间信息交流

9、，因此许多企业纷纷建设网站以增强企业知名度。Internet是目前世界上最大的计算机互联网络，它遍布全球，将世界各地各种规模的网络连接成一个整体。作为Internet上一种先进的，易于被人们所接受的信息检索手段，World Wide Web(简称WWW)发展十分迅速，成为目前世界上最大的信息资源宝库。第一章 绪论1.1 网页制作的背景和意义我们读书就是为了获得知识，现在我们学习了ASP动态网页设计，当然就是要能做一个精美的网页。在此次毕业设计中，我们要能更加的了解Dreamweaver强大的功能和更好的使用它。通过此次设计我们还要能够知道静态网页和动态网也的区别。诚然，次此设计的网页，一方面是

10、为了完成毕业作业，但更重要的是把我们所学到的东西用在具体的实践之中，所以，这次设计的目的也是要我们更好的掌握和使用好ASP的核心工具和技术，以便提高对网页知识的更深层了解。第三点也是最要的一点是，把我们在书本上学到的知识充分运用到此次设计之中。使我们的在书上学到的东西不仅仅停留在表面上，把这些东西都用在所要做的网页上面，以达到老师要求的效果和学以致用。Internet是目前世界上最大的计算机互联网络，它遍布全球，将世界各地各种规模的网络连接成一个整体。作为Internet上一种先进的，易于被人们所接受的信息检索手段，World Wide Web(简称WWW)发展十分迅速，成为目前世界上最大的信

11、息资源宝库。据估计，目前Internet上已有上百万个Web站点，其内容范围跨越了教育科研、文化事业、金融、商业、新闻出版、娱乐、体育等各个领域，其用户群十分庞大，因此，建设一个好的Web站点对于一个机构的发展十分重要。近年来，随着网络用户要求的不断提高及计算机科学的迅速发展，特别是数据库技术在Internet中的广泛应用，Web站点向用户提供的服务将越来越丰富，越来越人性化。我们发现这样一个事实，一个用户在访问一个网站时一般来讲只对该网站的部分内容感性趣，而且这种兴趣会持续一段时间。这点启发了我们，如果能根据用户的喜好为不同的用户显示其个性化的页面，即着重显示该用户感兴趣的内容，将为用户节约

12、大量的检索时间，而且这样的网页显然是更具有吸引力的。一些站点已经在这方面作出了一定的尝试，通常采用的方法是，在用户登陆时为其提供一系列的选项，使用户能够对站点进行一些自主的设置。这样做能够使站点呈现一定程度的个性化，但是对用户来讲，还是比较烦琐，而且在用户了解一个站点前让其对站点进行设置，其结果未免有些粗糙。于是我们构想了这样一种方案，对用户登陆后的动作进行跟踪，分析，发掘用户点击的规律，即用户先后点击的关联规则，这样，在用户点击一个主题（链接）之后，系统能够自动生成一页面，其中包含了该主题下用户经常关注的内容（若干链接），这样便在无须用户作出任何额外工作的情况下实现了为用户量身订做的个性化页

13、面。本文主要完成Web服务器端的设计实现管理公司概况、运单查询、客户留言、报价查询以及后台管理等ASP页面及整个实验网站的组织建立和测试工作。1.2 相关术语的阐述WWW是“World Wide Web”的缩写；HTML的意思则是“Hypertext Markup Language”，中文翻译为“超文本标记语言”。 URL是Uniform Resource Locator的缩写，统称为统一资源定位器。可以把它想象成文件名的网络扩展。我们不但可以通过各种不同的方法指出在网络的上哪一台机器的目录下的文件。这个文件可以通过各种不同的方法得到。在URL中还指定了访问这一个文件的协议。在实际应用中，UR

14、L经常称为“网址”或URL地址。TCP/IP协议（Transmission Control Protocol / Internet Protocol传输控制协议/因特网协议）所谓协议，其实应该叫他网络协议，它是计算机与计算机之间，进行信息传输的语言，只有两台计算机具有相同的协议方能进行信息传输，常见协议有IPX协议、TCP/IP协议等。TCP/IP协议可以说它是你接入因特网的必备条件，因为它是因特网上的通用协议。FTP协议(File Transfer Protocol)也就是文件传输协议。我们知道，在服务器中一般都有大量的共享软件和免费资源，要想从服务器中把文件传送到本地的计算机（术语称“客户

15、机” ）上或者把自己机器上的资源传送到服务器上，就必须在两台机器中进行文件传送，那么双方就必须要共同遵守一定的规则，FTP就是用来在客户机和服务器之间进行文件传输以实现文件共享的协议。FTP只是一种协议，必须要有相应的专用软件来执行它，一般称为FTP软件。通过FTP软件可连接到FTP服务器上，执行上载和下载文件的任务。常用的FTP软件有LeapFTP、CuteFTP、WS_FTP、FTPX等，这些软件的原理基本相同，只是用户界面和功能略有差异。第二章 网页开发环境及数据库概述2.1 网页运行环境的开发本系统必须被运行在IIS (Internet Information Server)下。使用

16、Micorsoft Internet Information Server (IIS)，运行 Windows NT Server 的计算机便成为大容量、功能强大的 Web 服务器，它可以将信息发布给办公大楼或整个世界的用户。对于在基于 Windows NT 的计算机上联网，Internet Information Server 是很理想的，因为它可以在现存硬件上设置功能强大的 Web 服务器。Internet Information Server 集成在 Windows NT Server 操作系统中，并利用了其安全特征和性能优势。2.2 ASP和ADO简介221 ASP产生的历史环境 从本节

17、开始，将进入本书的重点内容-使用ASP（active sever pages）技术设计最流行的远程教育平台。在目前飞速发展的IT行业中，网站一旦建立起来，就一如既往的保持“静态”，不加更改？如果是这样，就无形中一落后时代的步伐。所谓静态指的是网站的页面内容固定不变，当用户浏览器通过互联网的HTTP协议向Web服务器请求提供页面内容时，服务器仅仅是将原来已经设计好的静态HTML代码，最多加上流行的GIF89A格式的动态图片。若网站维护者要更新网页的内容，就必须手动的来更新起所以的HTML文档。这种网长的致命弱点就是不容易维护，为了不断更新网页的内容，就必须不断的重复HTML文档，随着网站内容和信

18、息量的日益扩增，使得工作量大得出人想象。ASP正是解决这个尴尬局面出现了。因此ASP迅速的得到了无数网络开发者的垂青。(1)什么是ASPASP的全称是Active Sever Pages,目前没有正式的中文名，可以理解为动态服务器页面技术。ASP是目前最流行的开发动态网站的程序开发之一，它的特点是将脚本，超文本和强大的数据访问功能结合在一起，并提供了众多的服务器组件来扩张功能，能够很方便的创建分布式和基于Web的商业话应用程序。如果要更简单的描述ASP ，可以说ASP就是运行在Web服务器上的动态网页。ASP程序文件也是一个标准的网页，一般HTML标记和ASP脚本代码混杂在一起组成。ASP网页

19、程序必须想竟Web服务器的ASP解释器解释执行，产生HTML代码后才传送给用户的浏览器执行显示。(2) ASP的特点为：1、任何开发工具皆可发展ASP只要使用一般的文书编辑程序，如Windows记事本，就可以编辑。当然，其他网页发展工具，例如，FrontPage Express、FrontPage等也都可以；不过还是建议你用记事本来写，既省钱又方便，若是使用那些所见即所得的网页编辑来写ASP，可能会发生一些意想不到的离奇状态。通吃各家浏览由于ASP程序是在网络服务器端中执行，执行结果所产生的HTML文件适用于不同的浏览器。2、语言相容性高ASP与所有的ActiveX Script语言都相容，除

20、了可结合HTML，VBScript、Java Script、Active X服务器组件来设计外，并可经由“plug-In（外挂组件模组）”的方式，使用其他厂商（Third Party）所提供的语言。3、隐密安全性高 如果我们在浏览器中直接查看网页的原始代码，就只能看到文件，原始的ASP程序代码是看不到的！这是应届ASP程序先于网站服务（Web Server）端执行后，将结果转换成标准HTML文件，再传送到客户端（Client）的浏览器上，因此，我们所辛苦撰写的ASP程序并不会轻易地被看见进而被盗用。4、易于操控数据库ASP可以轻易地通过ODBC(Open Database Connectivi

21、ty)驱动程序连接各种不同的数据库，例如：Access、FoxPro、dBase、Oracle等等，另外，ASP亦可将“文本文件”或是“Excel” 文件当成数据库用。5、面向对象学习容易ASP具备有面向对象（Oobject-Oriented）功能，学习容易，ASP提供了五种方便能力强大的内建对象：Request、Response、Sever、Application以及Session，同时，若使用ASP内建的“Application”对象或“Session”对象所撰写出来的ASP程序可以在多个网页之间暂时保存必要的信息。 (3) ASP模型对象ASP提供了六个功能强大的内置对象供用户使用，利用

22、这六个对象，可以设计变化多端的Web应用程序，在ASP开发Web应用程序时，通过调用对象的方法，不但能实现提高编程效率，而且编程更优化。下面列出ASP包括的六个内置对象：Response：将信息送主客户端Request：从客户端取得信息Server：提供一些Web Sever方法Session：记录连接着的信息，每一个连接者的信息有独立的Session对象来记录Apptication：记录共用消息，让不同的可户端共享信息Objectcontent：配合MTS进行分布式事务处理(4)ASP的运行ASP页面与一般的HTML页面的真正不同之处，在于ASP页面需要经过Web服务器的解释执行而HTML网

23、页不需要。因此如果要运行和发布式ASP网页，就需要有Web服务器的支持。任何一个Web服务器，只有内嵌有ASP的解释程序，就可以运行ASP 编写的动态网页。整个过程主要有如下5个步骤（HTML页面的处理没有第三步）A.用户将ASP文件的网址输入到浏览器的地址栏，请求一个ASP网页。B.浏览器向Web服务器发送ASP文件请求，成为RequestC.服务器找到并解释执行该ASP文件，生成标准的HTML文件D.服务器将HTML文件传送给用户浏览器，称为ResponseE.用户的浏览器解释HTML文件，结果在浏览器窗口显示2.2.2 ADO对象ADO原名为ActiveX Data Object。通过与

24、ASP的结合，可以在网页里执行SQL的指令，用户可以轻松且快速的存取、增加或是删除数据库的数据。ADO包含三个主要的对象：Recordset、Connection以及Command。通过这些对象的了解与应用，再利用ASP对象，就可以很容易地制作出一个方便快捷、功能多样的网站。快速、容易和节省磁盘空间，是ADO的特性，这使得ADO成为十分热门的技巧。ADO通过与ODBC的链接，可以链接许多各种类型的数据库，因为ODBC本身就支持许多类型的数据库。ADO通过VBScript和JavaScript语言的技巧，不但可以控制存取数据库，还可以达到一些特殊技巧的变化。ADO 提供 Connection 对

25、象可以使用该对象建立和管理应用程序和 ODBC 数据库之间的连接。Connection 对象具有各种属性和方法，可以使用它们打开和关闭数据库连接，并且发出查询请求来更新信息。要建立数据库连接，首先应创建 Connection 对象的实例。用 Connection 对象的 Execute 方法您可以发出结构化查询语言 (SQL) 查询数据库源并检索结果。SQL 是用于与数据库通讯的工业标准语言，它有许多命令可用来检索和更新信息。使用 Connection 对象的 Execute 方法在 SQL INSERT 命令的表格中发出查询，该命令将数据插入特定的数据库表格。使用 Recordset 对象处

26、理结果尽管 Connection 对象简化了连接数据库和查询任务，但 Connection 对象仍有许多不足。确切地说，检索和显示数据库信息的 Connection 对象不能用于创建脚本；您必须确切知道要对数据库作出的更改，然后才能使用查询实现更改。对于检索数据、检查结果、更改数据库，ADO 提供了 Recordset 对象。正如它的名称所暗示的那样，Recordset 对象有许多您可以使用的特性，根据您的查询限制，检索并且显示一组数据库行，即记录。 Recordset 对象保持查询返回的记录的位置，允许您一次一项逐步扫描结果。根据 Recordset 对象的指针类型属性设置，您可以滚动和更新

27、记录。数据库指针可以让您在一组记录中定位到特定的项。指针还用于检索和检查记录，然后在这些记录的基础上执行操作。Recordset 对象有一些属性，可用于精确地控制指针的行为，提高您检查和更新结果的能力。例如，您可以使用 CursorType 和 CursorLocation 属性设置指针的类型，将结果返回给客户端应用程序（结果通常保留在数据库服务器上）并显示其他用户对数据库的最后一次更改。一个成功的数据库应用程序都使用 Connection 对象建立链接并使用 Recordset 对象处理返回的数据。通过“协调”两个对象的特定功能，您可以开发出几乎可以执行任何数据处理任务的数据库应用程序。例如

28、，下面的服务器端脚本使用 Recordset 对象执行 SQL SELECT 命令。SELECT 命令检索一组基于查询限制的信息。查询也包含 SQL WHERE 子句，用来缩小查询的范围。通过 ADO Command 对象，可以象用 Connection 对象和 Recordset 对象那样执行查询，唯一的不同在于用 Command 对象您可以在数据库源上准备、编译您的查询并且反复使用一组不同的值来发出查询。这种方式的编译查询的优点是您可以最大程度地减少向现有查询重复发出修改的请求所需的时间。另外，您还可以在执行之前通过您的查询的可变部分的选项使 SQL 查询保持局部未定义。Command 对

29、象的 parameter 集合减少了您的麻烦，使您不必在每次重新发出查询时重新建立查询。2.3 网页图像设计工具PhotoshopAdobe公司开发，处理图形图像的专门设计软件。DTP和图像软件的结合，使设计师可在电脑上直接完成文字的录入、排版、图像处理、形象创造和分色制板的全过程，开创了“电脑平面设计”时代。 Photoshop的专长在于图像处理，而不是图形创作。有必要区分一下这两个概念。图像处理是对已有的位图图像进行编辑加工处理以及运用一些特殊效果，其重点在于对图像的处理加工；图形创作软件是按照自己的构思创意，使用矢量图形来设计图形，这类软件主要有Adobe公司的另一个著名软件Illust

30、rator和Macromedia公司的Freehand。Photoshop系列中使用最广泛的有Photoshop5.0版本、Photoshop7.0。2.4 网页设计工具DreamweaverMacromedia 公司的产品的另一款“所见即所得”的网页编辑工具。与 Frontpage 不同，Deamweaver 采用的是 Mac 机浮动面版的设计风格，对于初学者来说可能会感到不适应。但当你习惯了其操作方式后，就会发现 Dreamweaver 的直观性与高效性是 Frontpage 所无法比拟的。 Dreamweaver 对于 DHTML 的支持特别好，可以轻而易举地做出很多眩目的页面特效。插件

31、式的程序设计使得其功能可以无限的扩展。Dreamweaver 与 Flash、Firework 并称为 Macromedia 的网页制作三剑客，由于是同一公司的产品，因而在功能上有着一个非常紧密的结合。而最新推出的 Dreamweaver UltraDev 更支持 Asp，Jsp。因此，说Dreamweaver 是高级网页制作的首选并不为过。常见的版本为 Dreamweaver3、Dreamweaver4、DreamweaverMX、Dreamweaver8.0、Dreamweaver CS.所以我本次设计主要选用Dreamweaver8.0结合Photoshop7.0处理图片。第三章 网页需

32、求分析3.1 可行性分析3.1.1网页的界面设计由于越来越多个人开始建立自己的网站，网站除了具有传播信息的功能外，还往往代表个人的形象。网站建设商业化和广告化的趋势，对网页设计的艺术性提出了更高的要求。虽然HTML语言提供了对常用Windows标准控件的支持，但是，由于Windows标准控件的形状和颜色十分单一，网页的视觉效果可能会很差。例如：列表框和下拉列表框只能呈现凹陷边框，而且下拉列表的箭头的颜色不能改变，滚动条只能出现在窗口的下边和右边，当网页分成多个帧的时候，滚动条就不可避免的出现在网页的中间，破坏网页的整体性。若在网页的设计中主动配合Windows标准控件的形状和颜色，网页的创作空

33、间就会受到限制。因此，有必要实现网页中的自定义控件，以满足网页设计艺术化的要求。A. 网页界面构成要素与传统媒体不同，网页除了文字和图像以外，还包含声音、视频和动画等新兴多媒体元素，更借助由代码语言编程所实现的各种交互式效果，增加了网页界面的生动性和复杂性，也使得网页设计者需要考虑更多页面元素的排布、优化。 一般来说，网页的界面主要由下面几个因素构成：（1）文字：文字元素是信息传达的主体部分。网页中的文字主要包括标题、信息、文字链接、几种主要形式。标题和传统媒体中信息传达的基本作用相同，是内容的简概说明一般比较醒目、优先编排。文字作为占据页面重要比率的元素，同时又是信息重要载体，它的字体、大小

34、、颜色和排布对页面整体设计影响极大。（2）图形：图形在网页界面中具有重要作用。合理的运用图形。可以生动直观、形象地表现设计主题。网页中常用的图形格式包括jpg和gif，这两种格式压缩比高，得到了规范浏览器的支持，下载速度快，具有跨平台。3.2网站需求分析3.2.1建站目的 Internet是目前世界上最大的计算机互联网络，它遍布全球，将世界各地各种规模的网络连接成一个整体。作为Internet上一种先进的，易于被人们所接受的信息检索手段，World Wide Web(简称WWW)发展十分迅速，成为目前世界上最大的信息资源宝库。据估计，目前Internet上已有上千万个Web站点，其内容范围跨越

35、了教育科研、文化事业、金融、商业、新闻出版、娱乐、体育等各个领域，其用户群十分庞大，因此，建设一个好的Web站点对于一个机构的发展十分重要。近年来，随着网络用户要求的不断提高及计算机科学的迅速发展，特别是数据库技术在Internet中的广泛应用，Web站点向用户提供的服务将越来越丰富，越来越人性化。因此网站建设在Internet应用上的地位显而易见，它已成为政府、企事业单位信息化建设中的重要组成部分，从而倍受人们的重视。提高公司知名度，扩大公司规模，*公司的领导决定建立自己的公司网站。 3.2.2网站实现功能 本网站给客户提供一个了解公司的平台，客户可以与公司及时地交换意见，产生互动，公司也可

36、以及时对网站进行更新维护。 前台客户系统功能：(1) 用户可以浏览公司的一些基本的信息。(2) 用户可以浏览公司的新闻。(3) 用户可以查看公司的联系方式。(4) 用户可以浏览留言板的帖子。(5) 用户可以随时发表自己的言论。 后台管理系统功能：(1) 增加、修改、删除公司的新闻。(2) 修改、删除留言板帖子。(3) 浏览、删除最新产品信息。第四章 网站的总体规划4.1 制作网页的一般步骤首先，你应该明确制作网页是为了干什么。比如，你是公司的职员，想通过网页来对公司进行广告宣传；再假设你正在做一个项目，想和外地的工程师通过网页讨论该项目。如果你要制作个人网页，那么你可能想通过个人网页在网上进行

37、传播，从而展示自己，并和网友交朋友。这就是你的目的。我这次做这个网页就是为了让同学们在自己的班级网站里面更好的交流和联系，及时发布一些班级新闻，为同学们建造一个网上家园。其次，组织好你的网页内容。试想，你把自己的照片和内容都堆在一起，别人将无法明白你想干什么，说不准，连你自己都糊涂了。如果组织得好，用户从你的网页中获取信息就容易得多。对于那些很重要的信息，用户只需要简单的操作就能得到。一般来说，组织好网页的关键是要对网页建立层次分明、条理清楚的结构图。脑子里有了这样一张结构图，就会对网页很明白，并且有助于制作网页。而后，要确定你的网页所具有的外观和特色，目的就是让用户被你的网页所吸引。如果你只

38、是要把很多漂亮的画面堆在一起，而不管内容，那将没人看。应该让你的网页不仅漂亮，更重要的是实用。怎么把自己的照片和内容有机的结合到一起，这也正是你的网页特色所在。然后，开始制作网页。具体操作时，首先要创建个人站点，再充分利用Dreamweaver的功能建立各个网页。最后，等网页做好了，就该发布站点了。站点发布后，为了保持站点的吸引力，要经常修改网页的内容（添加新的内容，更换已过时的图像等），就要更新和维护你的站点了。4.2 网页包括的元素无论是初次领略Internet风光的新手，还是经常上网冲浪的老手，在初次设计网页之前，都必须先认识一下构成网页的基本元素。只有这样，才能在真正的设计工作中得心应

39、手，根据需要合理的组织和安排网页的内容，从而达到期望的目标。设计网页的目的主要是发布信息，因此，作为信息载体的文本和图像也就成了网页的基本组成部分，超级链接是Web的核心，使它将万维网中无数的网页链接在一起，如果没有它，Web就无从谈起，此外，表格、动画、音乐和交互表单等信息的组织、表现，以及交互元素在网页中也具有举足轻重的地位。(1) 文本文本一直是人类最重要的信息载体和交流工具，网页中的信息也以文本为主，与图像相比，文字虽不如图像那样能够很快的引起浏览者的主意，但却能准确的表达消息的内容和含义，为了克服文字固有的缺点，人们赋予了网页中文本更多的属性，如文字、字号、颜色、底纹和边框等，通过不

40、同格式的区别，突出显示重要的内容，此外，用户还可以在网页中设计各种各样的文字列表来清晰表达一系列项目，这些功能都给网页中的文本赋予了新的生命力。(2) 图像图像在网页中具有提供信息，展示作品，装饰网页，表达个人情调和风格的作用。用户可以在网页中使用GIF、JPEG、PNG 3种图像文件格式，其中使用最广泛的是GIF和JPEG两种格式。(3) 超级链接超级链接技术可以说是万维网流行起来的最主要的原因，它是从一个网页指向另一个目的端的链接，例如指向另一个网页或相同网页上的不同位置，这个目的端通常是另一个网页，但也可以是一幅图片，一个电子邮件地址，一个文件，一个程序或本网页中的其他位置，其载体通常是

41、文本，图片或图片中的区域，也可以是一些不可见的程序脚本。当浏览者单击超级链接时，其目的端将显示在Web浏览器上，并根据目的端的类型以不同方式链接。例如，当指向一个AVI文件的超级链接被单击后，该文件将在媒体播放软件中打开;如果是指向一个网页的超级链接，则该网页将显示在Web浏览器上。(4). 表格在网页中表格用来控制网页中信息的布局方式。这包括两方面：一是使用行和列的形式来布局文本和图像以及其他的列表化数据；二是还可以使用表格来精4.3 网页层次结构（附结构图）第五章 网页设计的相关步骤5.1 制作前的工作在正式开始制作网页之前，最好先定义一个新网站，这是为了更好地利用站点窗口对站点文件进行管

42、理。5.1.1定义的方法方法一：在站点窗口的下拉菜单选择最后一项编辑站点，如下图。此时会弹出一个新的对话框，点击“新建”按钮就可以定义一个新网站，如果日后需要对旧有网站重新定义，可以在左边的网站列表中选中你需要重新定义的网站，然后点击“编辑”按钮便可。方法二：选择菜单“站点”“新建站点”选项。（如图所示）5.1.2基本设置在接着看到的对话框中，要进行以下简单的设置： 网站名称：为你的网站起一个名字，这个名字只起着识别的作用，与网站发布后真实的名字无关，例如这里的名字是：“我的网站”，而实际上我的网站叫“电脑课堂”；如果不需要什么特殊的服务器技术，就选“否”这项。本地根目录：设置网站在本地硬盘的

43、位置，点击后面的文件夹图标可以选择硬盘的任意目录作为存放网站文件的目录；可以任意选择你想要将文件存储在服务器上的位置，方法同上一步本地根目录的建立相同。选择默认的状态即可。完成后，回到站点窗口，就可以看到如下类似的画面：可以看到，“我的网站”的名称已经出现在站点窗口了，因为是新建的一个站点，所在在本地目录看到的一片空白。站点定义完毕之后，就可以正式制作属于你自己的网页了。个人网页界面5.2 建立超链接超级链接（Link），简称链接，是页面与页面之间一个单向的关联关系。通过点击链接，我们可以从一个页面跳到另一个页面。我们可以在文字、图片建立链接。5.2.1 基本设置在页面中选取需要建立链接的文字

44、，如下图：文字的链接在属性面板的Link一项，填写链接地址，当浏览者点击该链接的时候，浏览器就回跳转到该页面，例如这里填写的是：。 如果你希望该页面是在一个新窗口打开，可以在Target中选择“_balnk”。 如果要链接到网站内的文件，可以点击 ：上图中，我们是将文字链接到“Berna Biotech AG Welcome!.htm”这个文件，特别注意的是最底的“相对于”的选项，意思是选择相对路径的形式，默认是“文档”，也可以选择“站点根目录”，区别在于，“文档”是指相对路径是从本页开始计算，而“站点根目录”是从根目录开始计算（即“/”），如下图：另外，如果使用“站点根目录”的模式做成的链接，在本地硬盘直接打开页面浏览通常会出错，但在Dreamweaver的预浏模式和上传上服务器后，都不会有问题。5.2.2 图片链接图片链接的建立过程与文字链接相似，就不多作介绍了。但特别要提出的是，某些图片，在加上链接后，会出现一个蓝色的边框，要将边框去掉，将Border设为0即可。5.2.3 热区链接前面介绍的图片链接，一张图只能对应一个链接，能不能一张图对应多个链接呢？答案是可以的，选取一张图片后，可以在属性面板看