毕业设计（论文）基于Web的远程教育系统开发与设计.doc

《毕业设计（论文）基于Web的远程教育系统开发与设计.doc》由会员分享，可在线阅读，更多相关《毕业设计（论文）基于Web的远程教育系统开发与设计.doc（62页珍藏版）》请在三一办公上搜索。

1、基于Web的远程教育系统开发与设计系别： 班级： 姓名： 导师： 日期： 年 月 日 前言随着网络的普及和网络技术的发展，可以说现在网络已经逐步渗入到社会和人们的方方面面。但人们渐渐发现，基于传统的HTML格式的静态网页已经不能满足人们需要。取而代之的是这些Web应用，不仅仅是浏览器对服务器端已有网页文件的调用，还涉及到服务器端控制程序和服务器端文件的读写与更新。Web应用具有操作数据库，响应用户提交的交互信息、动态生浏览器端页面等特性，因而具有传统静态网页望尘莫及的强大功能和广大用途。随着信息时代的到来，人类知识更新的周期越来越短。如何使教学、培训能满足不同地点和不同学习时间人们的需要，传统

2、的面对面教育方式在这方面已经力不从心。在这种情况下，现代远程教育应运而生，它的优点在于使学生在时间和空间并不统一的情况下，能与教师进行交互并完成学习任务。网络技术在教育中的应用日益广泛和深入，为教育提供了丰富的资源，使网络教学真正成为了现实，同时也为教育开辟了广阔的前景。如何有效地利用网上的资源，建构基于网络的现代教学模式是一个迫切研究的问题，而开展网络教学模式研究的重要理论基础之一就是网络教学的设计与评价。因此，开展网络教学的设计与评价的探索与实践研究有着十分重要的意义。由于网络教学可以实现信息资源共享，在网上组织最优秀的教材和教法，使学习者在网上可以学到最新的知识，是教学改革发展的方向。通

3、过本项目的研究与实践，使网络教学更能为学习者提供一个建构主义的学习环境，充分体现学生的首创精神，学生有更多的机会在不同情境下去运用他们所学的知识，而且学生可以根据自身的行动的反馈来形成对客观事物的认识和解决实际问题的方案，从而提供网络教学的质量。目 录1 开发概述11.1 课题的来源11.2 制作工具和编辑语言的选用及介绍11.2.1 制作工具11.2.2 编辑语言21.3 数据库简介41.3.1新建数据库41.3.2添加数据表52 可行性研究62.1 基本要求62.2 具备条件72.2.1 项目开发中所具备的条件、假定和所受到的限制72.2.2可行性研究采用的方法72.2.3属性体现73 需

4、求分析93.1 需求分析的调查93.2功能需求103.3 新系统的逻辑方案103.3.1 数据流程103.3.2 部分数据字典104网站的总体结构设计124.1组织结构图124.2 定位网站主题134.3 确定网站的板块和栏目134.3.1 确定网站栏目134.3.2 网站板块设置144.4 确定网站的链接结构165 详细设计185.1 设计网站的标志(zhanbiaoo)185.2 设计网站的标准色彩185.3 设计网站的标准字体195.4 静态页面的制作195.4.1学校平台195.4.2学校平台:205.4.3 幼教平台205.5 动态页面205.5.1简单的网上投系统205.5.2简易

5、的在线考试215.5.3新闻平台225.5.4访课留言246 网站调试286.1 新闻系统测试:286.2 留言板系统测试29总 结33致 谢34参考文献35附录1 软件说明书36附录2 程序源代码37附录3英文文献及译文531 开发概述1.1 课题的来源长期以来，人们认识到在教学活动中建立学生主体地位的重要，于是在教育理论中不断探索，提出在教学活动中以学生为主体的观念，然而在传统教育的实践中，受其形式和方法的束缚，却无法充分体现。现代教育技术的发展，改变了传统教育的模式和观念。在远程教育中师生处于分离或准分离状态，教师角色出现了明显的转换，由传统教育中的主导者变为可以利用的教育资源，成了音像

6、教材中的一个组合因素；学习者也从教育的对象变为教育资源的选择者，利用者。教育技术的界入，使得学习者的主体地位真正得到确立。当今世界信息量激增，信息传输更为便捷，远程教育可以使全球的学习资源共享，学习资源极大地丰富了，在人们多种多样的学习中，学习更是学习者主动的选择。值得注意的是，现代远程教育网络环境下的教与学模式探索阻力还很大。阻力主要来自习惯，来自人们对面对面集体教学的依赖。因此局部地区出现向传统式教学回归是不足为奇的。学生尚未体会网络学习的优越性，没有好好利用网络资源学习，致使远程教育的潜在优势得不到发挥。信息技术环境下的个性化和协作式学习，结合了东西方学习文化的优势，有利于解决远程教育发

7、展中的许多问题，有利于实现信息技术环境下远程学习模式的变革。因此，试点更应该在教与学模式多元化和趋同的背景下，着重个性化与协作式学习的实践探索和理论研究。远程教育的发展目标，就是逼近适度规模办学。值得庆幸的是，远程教育重视效益的同时，并未偏废质量。多项研究表明，远程学习的学习效果与传统面授方式并无显著的差异。1.2 制作工具和编辑语言的选用及介绍1.2.1 制作工具 网页的主体模块设计是选用目前用的最广泛的网页编辑软件Dreamweaver，它的工作界面为可视化和语言HTML相互结合的一个“平民化”软件，在制作网站页面的过程中，运用表格非常方便，并且，支持动态的HTML技术，能让您设计出复杂的

8、交互式网页，而它的排版功能更是网页设计人员所钟爱的。 Dreamweaver在本站中，主要负责制作静态页面，并且本站所有页面都用到了CSS样式(CASCADING STYLE SHEETS 层叠样式表)，也是在Dreamweave中进行编辑的，大大的方便了以前手工编辑带来的不方便。Fireworks：网站中的图片大多数都是运用Fireworks来进行处理和制作，它是一个简单容易操作的图形图像处理软件，也是当今图形图像处理软件中常用的一个软件，它的滤镜功能，能让一副简单的图片，同时拥有多种具有个性的效果。但此软件的在手绘和人物绘画方面却差了很多。 Fireworks可以说是本站用到最多的一个软件

9、，页面上的所有图片，都是经过它来设计和美化修改的，例如：网站的形象页面，内容页上放网站的标题，别看有些是FLASH的作品，但其中的背景图片，和一些文字，也都是用它设计之后导入进去的。FLASH：网页里的一些动态效果给自己的考验很大，在FLASH的语言上面，自己还是太薄弱了，以后要加强这方面的学习。1.2.2 编辑语言HTML语言：HTML语言是超文本标记语言（Hyperlink Text Markup Language）的缩写。它是一种描述文档结构的语言，而不能描述实际的表现形式。HTML语言使用描述性的标记符（称为标签）来指明文档的不同内容。标签是区分文本各个组成部分的分界符，用来把HTML

10、文档划分成不同的逻辑部分（或结构），如段落、标题和表格等。标签描述了文档的结构，它向浏览器提供该文档的格式化信息，以传送文档的外观特征。用HTML语言写的页面是普通的文本文档（ASCII），不含任何与平台和程序相关的信息，它们可以被任何文本编辑器读取。HTML语言特点：在一些细小的地方，可以直接采用记事本来打开，手工更改即可，方便了在没有软件的情况下来更新。ASP语言的特点如下： 1.ASP可以混用HTML，Java小程序，ActiveX, VBScript, JavaScript,并且可以互相嵌套；2. 不需编译，纯文本格式； 3. 安全性好 ；4. 面向对象 ；5. 可扩充服务器端功能 ；

11、6. 可扩充脚本语言 ；7. 与浏览器无关 ；8. ASP提供6个内置的全局对象供开发者不需声明就可直接调用 ； 9. ASP提供5个重要的服务器组件 ；访问HTML页面的过程： 1. 在客户端浏览器地址栏处输入HTML文件的URL地址，按回车键发送一个网页请求； 2. 浏览器发送网页请求到IIS/PWS服务器 ；3. IIS/PWS服务器接收到请求，通过扩展名.htm或.html判断是HTML文件的请求；4. IIS/PWS服务器将对应的HTML文件从磁盘或存储器中取出并送回浏览器；5. HTML文件由用户的浏览器解释，结果在浏览器的窗口显示 ；访问ASP网页的过程： 1. 在客户端浏览器的

12、地址栏输入要请求的ASP文件的URL地址，按回车键发送一个ASP请求； 2. 浏览器向IIS/PWS服务器发送ASP网页请求； 3. IIS/PWS服务器收到请求并根据扩展名.asp识别出ASP文件； 4. IIS/PWS服务器从磁盘或内存中获取相应的ASP文件； 5. IIS/PWS服务器将ASP文件发送到一个类似于发动机引擎的名为asp.dll的特定文件库中； 6. asp.dll引擎将ASP文件从头至尾进行解释处理，并根据ASP文件中的命令要求生成相应的动态HTML页面； 7. HTML页面被送回客户端浏览器 ；8. 用客户端浏览器解释执行HTML网页，并将结果显示在客户端浏览器上 ；与

13、HTML相比，ASP具有3个重要特征： 1. ASP可以包含服务器端脚本语言，即可以用动态内容创建网页 ；2. ASP使用内置对象可以使脚本功能更强大 ；3. ASP使用组件使用户可以处理数据库，发送email或访问文件系统等 ； ASP提供的6个内置对象： 1. Response:发送信息到浏览器 ；2. Request:用来读取来自浏览器的请求信息，可用该对象读取HTML表单的信息； 3. Server:允许用脚本来生成Active Server组件的实例； 4. Application:用来存储，读取用户共享的应用程序信息，使该对象在网站的不同连接者之间传递共用信息 ；5. Sessio

14、n:用来存储，读取特定连接者的对话信息，如可以存储连接者对网站的访问信息 ；6. ObjectContext:用于控制ASP的交易(Transaction),交易由Microsoft Transaction Server(MTS)管理 ；ASP提供的5个重要组件 1. ADO:用于在Microsoft SQL Server,Microsoft Access数据库中读取或存储数据 ；2. File System:提供可用来访问计算机文件系统的方法和属性 ；3. Content Linking:根据不同浏览器的性能显示不同的HTML内容 ；4. Browser Capabilities:用来链接不

15、同的HTML页面使其操作更简单；5. AD Rotator:用于在网页上显示横幅广告，并可控制不同广告的显示频率； 1.3 数据库简介数据库及其基本操作：Access是一个数据库管理系统，它之所以被集成到Office中而不是VisualStudio中，是因为它与其它的数据库管理系统（如VisualFoxPro）相比更加简单易学，一个普通的计算机用户即可掌握并使用它。而且最重要的一点是，Access的功能足够强大，足以应付一般的数据管理及处理需要。1.3.1新建数据库创建一个空数据库，即建立一个没有表、查询、窗体和报表等内容的数据库。Step1：在Access窗口中单击“文件(F)”菜单，在下拉

16、菜单中选择“新建”项。Step2：双击“数据库”图标，即会显示“文件新建数据库”对话框。Step3：在文件名文本框中输入要保存数据库的文件夹及新建的数据库名，如“C:test”，然后选择“确定”。即可创建好一个名为“test”的数据库。1.3.2添加数据表表是Access数据库的基础，是信息的载体。其它对象如查询、窗体和报表，也是将表中的信息以各种形式表现出来，方便用户使用这些信息。在Access中，创建表的方法有三种：一是使用设计器创建表；二是通过输入数据创建表；三是利用向导创建表。在这里采用第一种方法创建表。Step4：在“Step3”中，双击“使用设计器创建表”则出现一个对话框。Step

17、5：在“字段名称”列的第一行中输入authors表的第一个字段的名字id。然后按回车键，此时在“数据类型”列中会显示出一个按钮，单击按钮，在弹出的下拉列表中选择“文本”选项，设置id字段的类型为文本型。Step6：在“字段属性”域的“常规”选项卡中，可以设置字段的大小、格式和规则等。如可以把id字段的长度大小设置为12，并且规定其不能为空，因此，可以设置如下：在“字段大小”文本框中输入12，在“必填字段”文本框中输入“是”，在“允许空字符串”文本框中输入“否”。Step7：重复设置并保存。2 可行性研究2.1 基本要求可行性研究主要集中在以下三个方面：经济可行性、技术可行性，管理可行性。1经济

18、可行性。进行开发成本的估算及可能取得的效益的评估，确定目标系统是否值得投资开发。在我设计的网站中，首先要有一个总的目标，这个网站到底是要做什么。有的要显示自己的设计水平，这就要求页面美观；有的是为了求职而设计的求职网站，这就要求提供足够的信息让别人了解你的工作能力；有的是要为用户服务，这就要求网站有较强的互动性，而本站建设之初的主要目的就是为了使浏览者更好地通过网络学习知识，只是兴趣而已，所以本站站名“英才远程教育网”让人一看就知道是有关介绍网页知识的站点。并非是需要很多成本的网站。只需要在网上搜集大家喜欢的课件和课程，统一发布在我的远程教育网内，供不同的浏览者提供不同的知识。2技术可行性。对

19、目标系统进行功能、性能和限制条件的分析，确定在现有的资源的条件下，技术风险有多大，系统是否能实现。这里，资源包括已有的或可以搞到的硬件、软件资源、现有技术人员的技术水平与已有的工作基础。在我设计的网站里，我的网站技术可行性是根据自己现有所学知识而构建的，这就是要靠我不断提高自己的知识面和多了解制作网站和网页的方法以及各种软件的混合使用才能做出比较好的远程教育网站。3管理可行性。主要保证系统建设中所需要的人力资源，并为系统设计开发建立一套管理制度，还有就是确定哪些人参与网站设计，这取决于网站的本质。我的网站是个人创作的网站，所以当然由我个人来完成管理维护和开发等工作。在进行可行性研究时，需要与用

20、户密切联系，详细了解问题提出的背景，弄清要解决什么问题。然后从系统特性和用户目标出发，仔细收集信息之后进行数据分析和功能分析，成本/效益分析。最后提交一份可行性分析报告，从技 术、经济、社会效应等方面论证可行性，以确定软件开发的目标。本系统的开发平台是Windows xp，所以很方便就可实现ASP的安装。首先是配置IIS，它是动态网页服务器运行的基础和必须的。由于ASP的验证服务是建立在IIS的验证服务之上的，因此在设立自己的应用服务时有时需要在IIS中进行相应的设置。在这样的性能和安全情况下，网站设计完成并投入使用后，能方便学习，并且为我们提供了的学习提供了良好的环境，并使学习生活更加便利。

21、2.2 具备条件2.2.1 项目开发中所具备的条件、假定和所受到的限制1所建议网站运行寿命的最小值网站运行寿命的最小值应达三年；2进行网站方案选择比较的时间网站方案选择比较的时间为15天；3经费、投资方面的投入一次性投入：用于网站的开发建设；长期性投入：用于网站的维护；4硬件、软件、运行环境和开发环境方面的条件硬件环境：PIII或更高档微机或者笔记本电脑；运行时内存要求：64MB；安装所需硬盘：5MB；软件环境：Windows xp server 可行性研究的方法。2.2.2可行性研究采用的方法1客户调查：我通过对各个网站的调查，发现大多数人都对远程教育网感兴趣。2专家咨询：专家认为未来远程教

22、育将是我国发展的重点2.2.3属性体现1正确性要求发布的网站在设计完成后能达到用户的预期目标，运行是基本无错误。2可靠性在正确操作情况下，不应出现故障。3效率对于添加、删除、查询、更新和密码设置的一般操作，要求及时响应。4完整性要求能在发生意外(如掉电)的情况下，保证不丢失数据。5易使用性设计完成后，网站能尽量为用户的使用提供方便，网站的界面符合当前流行的界面规范。 6可维护性本网站在运行中发现错误时，能快速、准确对其进行定位、诊断和修改。3 需求分析为了开发出真正满足用户需求的软件产品，必须知道用户的需求。对软件需求的深入理解是软件开发工作获得成功的前提条件，不论我们把设计和编码做的如何出色

23、，不能真正满足用户需求的程序只会另用户失望，给开发带来烦恼。需求分析是软件生命周期的一个重要阶段，它根本的任务是确定为了满足用户的需要必须做什么需求分析是软件生命周期的一个重要阶段，它根本的任务是确定为了满足用户的需要必须做什么。具体地说，应该确定系统必须具有的功能和性能，系统要求的运行环境，并且预测系统发展的前景，必须仔细分析系统中的数据，既要分析系统中的数据流。又要分析长期使用的数据存储，通过分析应该得出新系统逻辑方案数据流图、数据字典等，为系统的设计奠定基础。3.1 需求分析的调查在浏览众多的远程教育网站，我首先对系统组织结构，业务运作流程，功能需求做详细的调研，然后在调研的基础设计新系

24、统的逻辑方案。再经过可行性论证最后就可以开始设计和实施我的这个远程教育网。随着现代信息技术的高速发展，中国教育正以前所未有的速度和力度推进自己的电子化水平，利用现代信息技术实现计算机教学和远程教学，教育骨干网、城域网、校园网、教育资源中心等项目正在全国各地如火如荼地规划、建设之中。例如： 教育部提出在本世纪的头10年，在全国中小学普及信息技术教育，在全国90以上的中小学开设信息技术必修课，加快信息技术与其他课程的整合；加强信息基础设施和教育资源建设，使全国90左右独立建制的中小学能够上网，共享优质教育资源，提高教育质量。面临这样的问题，我设计了英才远程教育网，英才远程教育网(建设则是教育系统信

25、息化建设重点)，它的作用体现如下： 教育网能促进教师和学生尽快提高应用信息技术的水平。信息技术学科的内容是发展的，它是一门应用型学科，因此，为了让学生学到实用的知识，必须给他们提供一个实践的环境，这个环境离不开远程教育网。 教育网为教师提供了一种先进的辅助教学工具、提供了丰富的资源库，是学校进行教学改革、推行教育的一种必不可少的工具。教育网为学生提供了丰富知识，是同学们不再厌倦单调的课本，提高学生对课本的兴趣。 远程教育网是学校现代化管理的基础，深入、全面的学校信息管理系统必须建立在教育网上。教育网提供了学校与外界交流的窗口，学校应将各个互联网联接，这也是学校信息化的要求，做到了这一步，通过教

26、育网去了解世界、在互联网上树立学校的形象都是很容易的。 3.2功能需求大多数远程教育网第一阶段是函授教育。函授是以学生自学和老师助学相结合的方式完成教学任务，通信和面授辅导是师生间主要的联系方式；第二阶段是广播、电视等手段被应用于教育；第三阶段是通过计算机网络等多媒体手段进行教学和学习。一般来说有四种媒体：印刷媒体、音像媒体、计算机网络媒体、教学光盘。六种交互辅助手段：面授辅导、电话答疑、电子语言信箱、电子邮件、双向电视、电子公告板网上讨论。这四种媒体、六种手段在远程教育和学习中中进行最佳的优选和组合，以在条件许可的情况下达到其综合效益。现代远程教育是以学习者为主体的，运用多种媒体和多种交互手

27、段帮助学习者更方便更有效学习的一种教育形态。所以通过对众多远程网站的设计人员和求学人员的调研，在我设计的网站重点就放在如何实现这三个阶段， 在第一阶段：（主要以留言版和管理员发布新闻实现）；在第二阶段；（主要以视频播放器实现）；在第三阶段：（运用flash,word课件等实现）；辅助手段：运用留言板和新闻平台发布最新消息。3.3 新系统的逻辑方案3.3.1 数据流程浏览者登录网站后可以浏览各个平台的信息，浏览最近更新的课程，此网站除了留言版均是免注册的，不用注册就可以浏览详细的信息。在流言版中，只有注册才能发表留言，在新闻发布中，管理员可以通过登陆后对新闻进行更新。3.3.2 部分数据字典1外

28、部实体“管理员”的条目如下：外部实体名称：管理员输入数据流：管理类别输出数据流：返回相应的信息。数目：1人2数据流。数据流“注册信息”条目如下：数据流名称：留言版注册信息 说明：用户注册时提交的信息数据流来源：注册用户数据流去向：后台数据库数据流组成：用户编号+密码邮箱姓名+性别+头像+qq+日期3数据存储：数据存储“用户信息”条目如下：数据存储名称：用户信息简述：存放的是留言版用户相关信息情况输入数据：注册的用户信息数据存储组成：用户编号+密码邮箱姓名+性别+头像+ qq+日期 4 网站的总体结构设计一个网站的立意要求与其实现手段是紧密相关的，同时如何在达到其预先设想的情况下，尽量将网站设计

29、的美观且容量小，是一个非常重要的问题。下面就结合以上的两个问题，本章着重讲述一下网站策划立意并详细介绍本网站的设计制作。一个完整的网站不仅需要功能齐全，美观大方，他的结构也是重要的一环。一个好的网站，各部分的构成要有一定的逻辑性，让人看上去赏心悦目，内容也很有条理，相连接的表格的内容层次明确，主题鲜明。制作这个以教学为主题的网站时，一定要抓住重点部分，例如在网站中的发布新闻，除了新闻发布外，还有一些小的环节，如：在线投票，这样做无疑会使主页看起来很有层次感，赏心悦目，不会显得内容杂乱无章。当然，一些动态网站不会仅仅只有新闻发布那么简单。其他的内容信息则被放在其他的分页面中分别显示。我们还要清楚

30、网站设计与网站制作是有区别的。我们说网站“设计”而不是网站“制作”，它们的区别在于设计是一个思考的过程，而制作只是将思考的结果表现出来。一个成功的网站首先需要一个优秀的设计，然后辅之优秀的制作。设计是网站的核心和灵魂，一个相同的设计可以有多种制作表现的方式。我们说的“网站”是指有确定主题和明确目的的实用性站点，不包括纯表现类或者纯文字类网站。4.1组织结构图根据前面的设计思想进行分析，按照系统开发的基本观点对网站进行分解，从内容上可对网站作如下划分：详细见图4-1远程教育学校平台成教平台幼教平台英语平台新闻平台访课留言学生 平台 图4-1 组织结构图4.2 定位网站主题所谓主题也就是网站的题材

31、。对于教育网站题材的选择，就是搜寻众多的远程教育网中优秀的题材，在设计的网站中运用它们。4.3 确定网站的板块和栏目当确定了网站的题材后，我们前期收集和组织的许多相关资料内容便可以大展拳脚了。现在最重要如何协调好板块和栏目相对位置，要突出远程教育的优势、展现远程的风采。这一阶段也是网站构建过程中最为重要的一关。4.3.1 确定网站栏目栏目的实质是一个网站的大纲索引，索引应该将网站的主体明确显示出来。在制定栏目的时候，要仔细考虑，合理安排。1具体做法是：将教育的主题按一定的方法分类并将它们作为网站的主栏目。主题栏目个数在总栏目中要占绝对优势，主题突出，容易给人留下深刻印象。2设一个新闻动态和网站

32、导航条：一般都在首页的最上方，放置导航条，方便浏览者进入不同的平台。3设定一个可以双向交流的栏目：在首页面板中设立了在线投票。4.3.2 网站板块设置板块比栏目的概念要大一些，每个板块都有自己的栏目。本网站的板块设置是相对独立的、相互关联的。因此其主要板块为学生平台、学校平台、幼教平台、成教平台、新闻平台、访课留言，在每个板块下面有各有自己的主栏目。网站系统主要模块。详细见下图同步课堂小学奥数专题辅导英语月刊语文月刊在线月考每周一测名师面授 同步学习 拓展提高 学生平台参加测试图4-2 学生平台组织结构图教案精选课件中心单元例题/习题库学校平台名校题库图4-3学校平台组织结构图 报考指南视听课

33、堂院校介绍成考政策学法指导 成教平台图4-4成教平台组织结构图儿童心理语言发展运动锻炼天才儿童幼教平台图4-5幼教平台组织结构图浏览新闻管理员登陆后台管理删除信息修改信息添加信息 新闻平台 图4-6新闻组织结构图 用户注册查看留言回复留言发表留言管理入口删除信息 访课留言图4-7访课留言组织结构图1学生平台：名师面授采用最新技术,再现老师声情并茂的讲课,如同坐在教室第一排听老师辅导。老师深入浅出的讲解,帮助同学打通学习“瓶颈”,即刻“开窍”；英语月刊中，利用了一首英文歌曲，使浏览者尽量提高对英语的兴趣；在参加测试中，在线考试可以让学生在线测试学习的成绩。2学校平台：在教案精选中，收集了名校老师

34、的教案，可供老师选择，在单元例题和习题库中有名校的考试题，可同时提供给老师和同学参考。3成教平台：在报考指南能够传达成人高考的最新消息、发布各个成人高校招生的名单和学习方法指导。4幼教平台：提供给各位家长的资料平台，协助家将长培育儿童，是家长用正确的方法来教育儿童。5新闻平台：新闻发布系统是非常有用的。通过该系统，网站的管理员方便的对新闻进行更新，而不必频繁地直接修改数据库并上传信息。6访课留言：留言板是Internet上最基本的交互式网页，使网络上提供的一项基本服务，也是一个和浏览者交流、沟通的园地。4.4 确定网站的链接结构 网站的链接结构是指页面之间相互链接的拓扑结构。它建立在目录结构基

35、础之上，但可以跨越目录。形象的说：每个页面都是一个固定点，链接则是在两个固定点之间的连线。一个点可以和一个点连接，也可以和多个点连接。更重要的是，这些点并不是分布在一个平面上，而是存在于一个立体的空间中。我们研究网站的链接结构的目的在于：用最少的链接，使得浏览最有效率。一般的，建立网站的链接结构有两种基本方式： 树状链接结构（一对一）：类似DOS的目录结构，首页链接指向一级页面，一级页面链接指向二级页面。立体结构看起来就像蒲公英。这样的链接结构浏览时，一级级进入，一级级退出。优点是条理清晰，访问者明确知道自己在什么位置，不会迷路。缺点是浏览效率低，一个栏目下的子页面到另一个栏目下的子页面，必须

36、绕经首页。 星状链接结构（一对多）。类似网络服务器的链接，每个页面相互之间都建立有链接。这种链接结构的优点是浏览方便，随时可以到达自己喜欢的页面。缺点是链接太多，容易使浏览者迷路，搞不清自己在什么位置，看了多少内容。这两种基本结构都只是理想方式，在实际的网站设计中，总是将这两种结构混合起来使用。我们希望浏览者既可以方便快速的达到自己需要的页面，又可以清晰的知道自己的位置。 考虑到站点内容多，分类明细，需要超过三级页面，所以在设计制作过程中添加了回到主页的按钮，可以轻松回到主页，再进行选择 。 关于链接结构的设计，在实际的网页制作中是非常重要一环。采用什么样的链接结构直接影响到版面的布局。例如你

37、的主菜单放在什么位置，是否每页都需要放置，是否需要用分帧框架，是否需要加入返回首页的链接。在连接结构确定后，再开始考虑链接的效果和形式，是采用下拉表单，还是用DHTML动态菜单等等。所以综合以上几点，网站既然以交流为主，我就设计制作了一个留言板,用来使浏览者相互之间的交流。互联网的发展是非常快的，特别是网站的发展，其中的信息变更频繁，所以这个网站的变动更新也是必不可少的，我因此设计了一个相应的栏目来反映网站这方面的变化，叫做“新闻平台”。5 详细设计5.1 设计网站的标志(zhanbiaoo)首先需要自己设计制作一个网站的标志(zhanbiaoo)。就如同商标一样，zhanbiaoo是站点特色

38、和内涵的集中体现，看见zhnbiaoo就让大家联想起自己的站点。我的网站的zhanbiaoo采用远程的头两个字母书写的。用的字体是华文彩云。这样既具有代表性有显示专业性。具体制作程序如下： 图5-1 站标1启动Fireworks MX 2004；2打开“新建文档”对话框，并设置画布的大小为18060，单位为“像素”，画布颜色为“白色”，单击“确定”创建一个文档，导入一个背景图片；3在“工具”面板中选取“文本”工具，在工作区中输入英文yc；4在属性面板中为文字设置字体、字号、描边和宽高、XY，完成的效果如图；5打开“文件”“导出”菜单选项，将该文件输出为zhanbiaoo.gif,并将其设置于适

39、当文件夹中；6关闭文档。5.2 设计网站的标准色彩网站给人的第一印象来自视觉冲击，确定网站的标准色彩是相当重要的一步。不同的色彩搭配产生不同的效果，并可能影响到访问者的情绪。标准色彩是指能体现网站形象和延伸内涵的色彩。一般来说，一个网站的标准色彩不过于繁杂，太多则让人眼花缭乱。标准色彩要用于网站的标志，标题，主菜单和主色块。给人以整体统一的感觉。至于其它色彩也可以使用，只是作为点缀和衬托，绝不能喧宾夺主。例如本站，所有页面都采用白色作为背景色。这样既方便了用户浏览、统一了风格，又和网站的站标有机地协调起来。5.3 设计网站的标准字体和标准色彩一样，标准字体是指用于标志，标题，主菜单的特有字体。

40、一般我们网页默认的字体是宋体。为了体现站点的“与众不同”和特有风格，我们自己可以根据需要选择一些特别字体。可以根据自己网站所表达的内涵，选择更贴切的字。目前常见的中文字体有二三十种，常见的英文字体有近百种，网络上还有许多专用英文艺术字体下载，要寻找一款满意的字体并不算困难。需要说明的是：使用非默认字体只能用图片的形式，因为很可能浏览者的PC里没有安装本网站使用的特别字体，那么自己的辛苦设计制作便付之东流啦！本站大多数采用的是普通的宋体。5.4 静态页面的制作在我的网站中，我多次运用了dreaweaver mx 2004来设计网站的静态面，在dreaweaver mx 2004中，我主要用“常用

41、”中的“表格”来设计我的各个页，在表格中，您可以选择插入不用的图片，或者是写入不同的汉字，实现不同的效果，静态页面的图片主要是以我通过Fireworks 为主，主要是利用上网时间找寻自己喜欢的图片，然后在用各种把它变成我的图片，再拿它做背景，在背景上我可以用marquee来设定滚动字模，让浏览者，感觉与众不同。5.4.1学校平台在学生平台中名师面授，英语月刊运用到了Dreamweaver mx 2004中的插件，先打开Dreamweaver mx 2004中的插入面板中的媒体里的选择插件项，运用插件插入一个已经下载完善的媒体播放器（并带有讲课内容）并调试播放器的大小，一般都应将插件放大很多倍，

42、才能使媒体播放器完全在网页上显示；最后保存网页，将其保存为HTML或 HTM格式，然后编辑学生平台，将名师面授中的内容和我刚才保存的网页进行链接，具体做法是：在选中标题，然后选中属性中链接选项，打开文件夹，选择你所需要链接的文件，单击确定。然后按快捷键Ctrl+s将其网页保存，按快捷键Ctrl+z可以回退多步，保存会出现将其保存得位置，最好将其和媒体播放器放在一个文件夹中后，最好不要轻易移动位置，因为这样会使你链接的媒体播放器的链接路径出现问题，例如在固定的路径找不到媒体播放器的内容，它将不显示或显示错误。5.4.2学校平台:在学校平台教案精选中，我收集了名校老师的教案；课件中心运用了现在课堂

43、中比较流行的microsoft powerpoint文稿，可以使同学们自己控制课件的速度（在鼠标单击时，才可以继续进行），方便于同学们记笔记，有利于同学们按照自己的方法研究问题。由于此种方法太机械化，使同学们感觉不到老师真正的意图，所以在此平台我还运用了另一种方法来引起学生的兴趣，就是在dreaweaver mx 2004的插入面板中插入用flash做成的课件（在这个课件中，添加了播放，停止按钮，使同学们方便观看），而这种方法不能让学生真正的理解课程，毕竟制作flash课件的方法有限。基于上述原因而最后一种方法就是将媒体播放器和flash方法和为一起或将媒体播放器和microsoft powe

44、rpoint文稿方法连在一起，在示范课堂中，我运用了此种方法，在左面插入媒体播放器，而在右侧插入相配套的flash,这样同学们在观看媒体播放器时，对插入的flash也可以自己选择速度，这样就能充分的调用学生的积极性。使学生对你设计的课堂充满了兴趣。5.4.3 幼教平台在幼教平台中，我对图片分别设计了热点链接，方法先打开Dreamweaver mx 2004，在你想链接的图片上单击，这样就会在出现图像的属性，在属性中能看见三种不同的链接，矩形热点链接、椭圆形热点链接，多变形热点链接。区别这三种热点链接的方法就是看图像的形状或者是您想使用什么形状链接，在本设计中，我分别运用了，椭圆形热点链接和矩形

45、热点链接。5.5 动态页面5.5.1简单的网上投票系统网上选举于投票时目前常见的网络应用之一。浏览者只要在网页中用鼠标点击您所喜欢的平台的图片，该平台的票数就会自动增加一票。本投票系统页面命名是poll.asp，其关键之处在于以下几点：1、首先是如何保存和读取投票的结果。在Asp应用程序设计中，主要是通过两种形式来保存数据：一是文本文件，二是数据库。一般来说，当要存储的数据结构比较简单、数据量小时，采用文本文件的方式（记事本，文件的扩展名是.txt）既简单又可以加快程序的运行；而对于大量数据的存储和管理则非数据库莫属。在本设计中，我就采用了student代表学生平台的票数，school代表学校平台的票数，yj代表幼教平台的票数。2、其次是如何方便、有效地访问各个文本文件中保存的得票数据。为此，专门创建了一个名为Readcount的自定义函数，用来读取给定城市已经获得的投票数；同时创建一个名为WriteCount的带参过程，用来将新累计的票数写入指定的文本文件。3、最后，为本设计分别使用三个候选平台的图片作为超链接，当浏览者用鼠标点击某个图片时，不仅将激活poll.asp页面本身，而且还将传递一个代表这个城市的变量值。以便识别出本次投票的是哪个平台，