摘要
学校网站是实现教育资源分配的桥梁，它有巨大的教育资源库并且可以集全社会的力量，使教育资源无限增长。在我制作学校网站时我所使用的软件是dreamweaver，该软件相对于其他相关软件具有不生成冗余代码、方便的代码编辑、强大的动态页面支持、优秀的网站管理功能、便于拓展、操作简便等优势。在网页的制作与链接中，我学到了很多，然后补充一些比较热门的技巧。网站具有快键、无距离更新的特征，同时提供进入日常活动处理平台的“入口”，具有较强的实用价值，这个网站能被广大教师，学生群体所普遍使用，随着网络的普及和高效性的不断提高，它的实用性已经使它的应用地位越来越高，越来越广。本文对网站设计作了介绍，进行了需求分析，模块划分、框架、dreamweaver和ccs的介绍。
关键词：dreamweaver、超链接、性能、ccs、实用价值
第一章 前言
1.1课题来源
1.2网页开发项目需求分析
1.3学校网站网页的设计
1.4制作软件dreamweaver的简介
1.5软件运营环境
第二章 网页的制作
2.1做网页的步骤
2.2做网页的要素
2.3系统各模块功能实现
第三章 学校网站的建立步骤
3.1确立学校网站主题
3.2给学校网站选一个好域名
3.3 确定一个美观的学校网站界面
3.3.1栏目与板块的编排
3.3.2学校网站的目录结构与链接结构
3.3.3对学校网站进行形象设计
3.4突出学校网站的风格
3.5学校网站的部分代码实现
3.6推广学校网站
第四章 学校网站的测试
4.1 测试内容
4.2测试过程
4.2.1功能测试
4.2.2可用性测试
4.2.3兼容性测试
4.3效率分析
4.3.1优点及不足
4.3.2软件测试的意义
结束语
参考文献
第一章 前言
1.1课题来源
随着社会的进步，我们对中小学的教育也越来越重视。但现在在一些相对不太发达的城镇，学生的教育资源受到一些条件的，而且不能够给大部分学生提供个性化的学习平台。所以我认为给一些中小学创建自己的学校网站是非常有必要的。首先， 学校网站是学校的"商标"，每一所学校都有自己的特色，每一所学校都有自己的个性。在这个高度信息化的社会里，建立自己学校网站是最直接的宣传手段。其次，学校网站能提供教学互动的全新方式学校网站使得教师与教师、教师与学生、学生与学生之间的交流有了全新的方式，它不再受到传统课堂的制约，而且，校网站能够提供个性化学习的平台，不同的学生理解世界的方式各不相同，认知世界有诸多方式。网络提供的丰富资源可以使学生寻觅不同的教育方式，各取所需，使学生能够自主选择自己要学习的内容。互联网的出现为实施有“针对性”的个性化教学提供了强有力的技术支持，网络教学可以充分发挥计算机超强“记忆”的优势，全程“记忆”跟踪学生的学习过程，教师可依据电脑的“记忆库”全面了解学生的学习情况，为学生提供“个性化”的教学服务， 教育网站“个性化”教学服务有别于家教、教育软件等教学模式，在挖掘人才潜力与培养人才方面的优势是传统教学方式所无法比拟的。只有将这一优势体现出来，确实去满足学生和家长在教育方面的深层次的需求，网络教育的概念才能够被广大用户接受，教育网站才能够获得蓬勃发展。
1.2网站开发项目需求分析
对于中小学的教育来说，建立网站是十分必要。学校网站建设是学校教育信息化建设的重要方面，是全面提高学校信息化水平的标志性工程。学校网站是学校对外宣传的窗口，是提高学校教学、科研、管理效率的重要工具，也是全校师生展示才能、互相学习、共同发展的阵地。更是培养信息化人才，建设高素质教师队伍的重要突破口。建立网站是学校发展的必然，既然如此，不如从现在开始，近早参与，更快的积累更多的建设和管理经验，让我们的学校在未来教育中立于不败之地。
现在无论是小学生，还是中学生，上网已经很普及，通过上网，让他们交际越来越广泛，而且他们毕业后将走向全国东西南北，所以学校网站，会对学校起到相当大的宣传作用。比如说在学校建站初期搞一次全校学生参与的校园网络文学赛，要求学生作品直接在网站指定页面发表，学校从中评出优秀作品并通过网站进行奖励，当然最好把其中一些学生的作品投递给国内的一些学生刊物选登，这对学生和网站建设都是一种很好的支持；另外，学校网站还开设学校的学习论坛，邀请学生做适合自己兴趣爱好栏目的版主；不定期举办比赛通过这一系列的活动可以让更多的学生了解学校网站并参与其中，达到不错的教育作用。
在学校网站建设过程中，校园快讯以及校园风采图库的建设非常的重要，它们在一定程度上可以反映学校的办学思想、教学观念以及师生在校园的学习生活情况，经常查看这些栏目的除了在校师生外我想主要还有以下一些群体：一是已经毕业校友，他们关心学校的发展，所以会经常“回来”看看，试想，如果一位已经工作几十年的老校友再“回到”母校能看到自己当初的照片依然还放在学校网站上，那种心情是何等的激动，毕竟母校还没有忘记他们；二是，各级教育部门和学生家长，他们需要及时了解一些学校的教育教学工作情况，并及时的向学校有关部门反馈他们的意见或建议。现在学校各类活动，都可以分类的把它们放在网站的校园风采图库内，以记录着学校的历史！
每个不同的网站将满足网络用户的不同需求.学校网站所面对的对象是广大教师和学生,所以,教师和学生和一些渴望了解学校基本情况的人群的需求,就成了学校网站设计要满足的对象。
1.3学校网站网页的设计
根据前面的设计思想进行分析，按照系统开发的基本观点对网站进行分解，从内容上可对网站作如下划分：
l 学校风采 通过学校概括、教师风采、校园之星及部分图片等内容来展现。
l 优点特色 通过新闻、生动活泼的教育教学栏目来展现。
l 信息发布 通过公告栏、信息查询等栏目来实现，内容有招生、
活动安排等。
l 部分校务 根据校务的公开程度与参与人数的多少，特选择图书管
理、评优、考试查分、家校联系四大校务在网上实现。
主页设计
网站主页采用静、动相结合的方式，即静态的主画面和动态的图片相结合，体现学校的勃勃生气，静态主页方式介绍学校风采、优点特色、信息发布，对于四大校务，就得利用ＡＳＰ与数据库结合的技术建立数据库查询管理系统，采用交互式的动态的web画面来实现。
主页结构图
1.4制作软件dreamweaver的简介
dreamwraver软件由美国著名的网站应用开发工具生产厂商Adobe Macromedia于2005年6月推出并正式投入市场以来，已经发展得相当成熟。关于dreamwraver的技术介绍的相关书籍与网络信息相当丰富。通过大学中软件开发环境课程的学习，对dreamwraver有了比较深刻的认识，并比较轻松的掌握了dreamwraver的操作。因此，软件技术可以完成任务的要求。
1.5软件运营环境
Dreamweaver是一款简体中文软件，可以在Win2003/WinXP中安全运行。
第二章 网页的制作
2.1做网页的步骤
想要制作网页首先我们了解一点简单的网页制作工具。例如：Dreamweaver，专门制作网页的工具，可以自动将网页生成代码，其界面简单、功能强大是初学网页制作者的第一选择。想要做一个网叶，我们基本上要分八个步骤：1、确定网站主题 ：网站主题就是要建立的网站所要包含的主要内容，一个网站必须要有一个鲜明的主题。在你的主题范围内内容要做到大而全、精而深。2、搜集材料 ：我们如果想让我们的网站有真材实料，能够吸引更多的用户，我们就得尽可能多的收集材料，材料收集的越多、越全，我们以后制作网站就越容易。我们手机材料不及可能从互联网上收集，还可以在报纸、书籍、多媒体上得到。然后我们把收集到的信息进行整理，留下有用的部分，作为制作网页的素材。3、规划网站 ：一个网站设计得成功与否，很大程度上决定于设计者的规划水平，规划网站就像设计师设计大楼一样，图纸设计好了，才能建成一座漂亮的楼房。网站规划包含的内容很多，如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等，你只有在制作网页之前把这些方面都考虑到了，才能在制作时驾轻就熟，胸有成竹。也只有如此制作出来的网页才能有个性、有特色，具有吸引力。4、选择合适的制作工具 ：尽管选择什么样的工具并不会影响你设计网页的好坏，但是一款功能强大、使用简单的软件往往可以起到事半功倍的效果。5、制作网页 ：材料有了，工具也选好了，下面就需要按照规划一步步地把自己的想法变成现实了，这是一个复杂而细致的过程，一定要按照先大后小、先简单后复杂来进行制作。所谓先大后小，就是说在制作网页时，先把大的结构设计好，然后再逐步完善小的结构设计。所谓先简单后复杂，就是先设计出简单的内容，然后再设计复杂的内容，以便出现问题时好修改。在制作网页时要多灵活运用模板，这样可以大大提高制作效率。6、上传测试：当我们把网页制作完成后，发到WBS上，使大家都能看见我们的网页，在上传完成后我们要自己在浏览器中打开我们自己的网站，逐个链接进行测试，发现问题，修改问题，然后再上传测试。7、推广宣传：网页做好之后，我们要对其进行宣传，只有这样才能提高网页的访问量和知名度。推广宣传的方法有很多，我们只需要选择简单方便、经济适用的一些方法即可。
2.2做网页的要素
1、网页的整体布局设计
网页设计作为一种视觉语言，要讲究编排和布局，虽然主页的设计不等同于平面设计，但它们有许多相近之处，应充分加以利用和借鉴。版式设计通过文字图形的空间组合，表达出和谐与美。一个优秀的网页设计者也应该知道哪一段文字图形该落于何处，才能使整个网页生辉。多页面站点页面的编排设计要求把页面之间的有机联系反映出来，特别要处理好页面之间和页面内的秩序与内容的关系。尤其是我们在利用网页效果体现在线营销的意图时，更要注意为了达到最佳的视觉表现效果，而讲究整体布局的合理性，比如一家生产型的企业，它所提供产品的名称、类别、型号、价格、功能介绍应怎样编排才能使浏览者有一个流畅的视觉体验，从而方便他对产品的了解，促成最后的购买。
2、网页设计中色彩的运用
色彩是艺术表现的要素之一，在网页设计中，根据和谐、均衡和重点突出的原则，将不同的色彩进行组合、搭配来构成美丽的页面。根据色彩对人们心理的影响，合理地加以运用，按照色彩的记忆性原则，一般暖色较冷色的记忆性更强一些。色彩还具有联想与象征的特质，如红色象征血、太阳；蓝色象征大海、天空和水面等。所以如果我们在对一家出售冷食的商店进行虚拟店面的页面设计时，应使用淡雅而沉静的颜色，使人心理上感觉凉爽一些，增强人们的购买心理，使得在线营销得到很好的实践效果。另要注意的是网页的颜色应用虽没有，但不能毫无节制地运用多种颜色，一般情况下，先根据总体风格的要求定出一至二种主色调，在已经有了完备的CIS（企业形象识别系统）的企业进行网页设计时，更应该按照其中的VI进行色彩运用。在色彩的运用过程中，还应注意的一个问题是：由于国家和种族、宗教和信仰的不同，以及生活的地理位置、文化修养的差异等，不同的人群对色彩的喜恶程度有着很大的差异。如：儿童喜欢对比强烈、个性鲜明的纯颜色；生活在草原上的人喜欢红色；生活在闹市中的人喜欢淡雅的颜色；生活在“沙漠”中的人喜欢绿色。在设计中要考虑众多因素。
3、网页形式与内容相统一
要将丰富的意义和多样的形式组织成统一的页面结构，形式语言必须符合页面的内容，体现内容的丰富含义。运用对比与调和、对称与平衡、节奏与韵律以及留白等手段，通过空间、文字、图形之间的相互关系建立整体的均衡状态，产生和谐的美感。如对称原则在页面设计中，它的均衡有时会使页面显得呆板，但如果加入一些富有动感的文字、图案，或采用夸张的手法来表现内容往往会达到比较好的效果。点、线、面作为视觉语言中的基本元素，要使用点、线、面的互相穿插、互相衬托、互相补充构成最佳的页面效果。网页设计中点、线、面的运用并不是孤立的，很多时候都需要将它们结合起来，表达完美的设计意境
2.3系统各模块功能实现http://www.docin.com/p-354392783.html
1.图片模块
1）该功能模块可以介绍学校各个有关方面内容，使学生更清晰的去寻找自己所用的。
2. 学生注册模块
1）该功能模块主要是让学生可以通过学籍号来注册会员
2）该功能可以通过学生的注册，通过学生自己填写，来完善学生的在校基本信息。
3.账号登陆及管理模块
1）该功能模块主要提供学生的登陆和对账号密码进行修改功能。
4.在线留言模块
1）该功能模块是学生可以通过注册后登陆，进行在线留言，或者发表看法。
第三章 学校网站的建立步骤
3.1确定学校网站的主题
该学校网站主要是面向在校大学生，向在校大学生展示学校的美好生活、精彩瞬间。作品的主要技术指标包括：制作出一个静态和动态的“学校网站”，在制作过程中，加强和深化以前所学的关于网页设计的方法，为了使得学生能在该网站了解学校的全面情况，该网站必须能够及时更新并且尽快的提供给学生新的信息。
确定学校网站的基本概念是对以前所学知识的概括整理，这部分内容偏重于实际需求；需求分析与选题强调实践与应用。为了能够吸引更多学生的眼球我设计了一套方案：
1.首先根据页面要展示内容的多少，在photoshop中新建一个适合的网页宽度和长度的文件。
2.在画布上按自己的想法结合实际内容，用各图形工具在画布上画上整个网页基本的布局。
3.基本布局的设计定下之后再对各部分进行具体设计，细化每个部分，特别是静态的部分。
4.在Photoshop里完成整个页面的设计后，进行切片，将要动态显示的地方切出来，还有就是大的图片要切一下，能提高网页读取速度。按Shift+Ctrl+Alt+S存储为.html格式后，用Dreamweaver编辑将需要作为背景的单元格中的图片设为该单元格的背景，另存为index.asp。
5.将所有页面，拷到所属文件夹，然后与后台数据库连接起来，即可通过对后台数据库内容的添加、删除、修改来对网页的相关内容进行操作，例如在数据库注册登录表中删除一个用户信息，那么这个用户再次用原先的登录信息登录时就无法登录成功了。
6.在Dreamweaver中网页的左侧类似“书卷”的区域插入一张表格，并在代码相应位置插入滚动文字特效的代码，实现文字至下而上滚动，鼠标移过文字时滚动停留的功能。
7.在Dreamweaver8.0里打开主页面，在页面中相对应除插入图片切换的代码，实现学校网站的部分内容自动切换的效果。
8.在Dreamweaver8.0里打开主页面，切换到设计视图，将雪花鼠标特效代码复制在
之间，保存并预览，完成首页鼠标特效。3.2给学校网站选一个好域名：http://www.dxdmhsh.com
域名是网站在互联网上的名字。一个好的纯信息服务的学校网站，他所有建设的价值大部分都在网站的域名之上，没有了这个域名，它所有的前期工作就全部落空了。我将学校网站的域名定为“http://www.dxdmhsh.icoc.cc”首先该空间是完全免费的，这在一定程度上就大大节约我们的成本，其次对于一个学校网站来说我们更注重其实用性，如果网站做的特别华丽可能会给大家带来一种花哨，空洞的错觉。
3.3 确定一个美观的学校网站界面
网站的界面就是网站的门面，它往往决定着浏览者的第一印象，所以，一个好的网站必须要有一个整洁、美观的界面。
3.3.1栏目与板块的编排
学校网站的主题确定之后，我们就要开始收集相关的资料，并整理出有用的内容做一个合理的编排。例如，我们要将一些重要的信息放置在最突出的位置或者在版面分布上给予一定的优势。把一些相对次要的放在四周不太重要的地方。尽可能的删除那些与学校生活无关的栏目，尽可能从浏览者的角度来编排栏目以方便用户的使用和查询。另外，板块的设置也要合理安排与划分，设置板块的相对性、关联性，并且设置板块的内容也要围绕站点的主题。
3.3.2学校网站的目录结构与链接结构
学校网站的目录就是指建立学校网站时创建的目录。网页设计时首要考虑的是网站的构建形式,网站的灵魂在于网站结构的规划。例如：在用frontpage98建立网站时都默认建立了根目录和images子目录。目录的结构是一个容易忽略的问题，大多数站长都是未经规划，随意创建子目录。目录结构的好坏，对浏览者来说并没有什么太大的感觉，但是对于站点本身的上传维护，内容未来的扩充和移植有着重要的影响。下面是建立目录结构的一些建议：
●不要将所有文件都存放在根目录下。
有网友为了方便，将所有文件都放在根目录下。这样做造成的不利影响在于：
1.文件管理混乱。你常常搞不清哪些文件需要编辑和更新，哪些无用的文件可以删除，哪些是相关联的文件，影响工作效率。
2.上传速度慢。服务器一般都会为根目录建立一个文件索引。当您将所有文件都放在根目录下，那么即使你只上传更新一个文件，服务器也需要将所有文件再检索一遍，建立新的索引文件。很明显，文件量越大，等待的时间也将越长。所以，给您的建议是：尽可能减少根目录的文件存放数。
●按栏目内容建立子目录。
子目录的建立，首先按主菜单栏目建立。例如:网页教程类站点可以根据技术类别分别建立相应的目录，象Flash,Dhtml,javascript等；企业站点可以按公司简介，产品介绍，价格，在线定单，反馈联系等建立相应目录。
其他的次要栏目，类似what's new，友情连接内容较多，需要经常更新的可以建立的子目录。而一些相关性强，不需要经常更新的栏目，例如：关于本站，关于站长，站点经历等可以合并放在一个统一目录下。
所有程序一般都存放在特定目录。例如：CGI程序放在cgi-bin目录。便于维护管理。所有需要下载的内容也最好放在一个目录下。
●在每个主目录下都建立的images目录。
默认的，一个站点根目录下都有一个images目录。刚开始学习主页制作时，阿捷习惯将所有图片都存放在这个目录里。可是后来发现很不方便，当我需要将某个主栏目打包供网友下载，或者将某个栏目删除时，图片的管理相当麻烦。经过实践发现：为每个主栏目建立一个的images目录是最方便管理的。而根目录下的images目录只是用来放首页和一些次要栏目的图片。
●目录的层次不要太深。
目录的层次建议不要超过3层。原因很简单，维护管理方便。
其它需要注意的还有：
1.不要使用中文目录；网络无国界，使用中文目录可能对网址的正确显示造成困难。3.3.3对学校网站进行形象设计
对学校网站进行形象设计，包括网站VI规划、整体形象创意、主页信息分布、页面格局规划、网页设计制作等。设计师可以针对目标用户的特征选择色彩、版式，也可以制定出网页改版计划。以网页设计色彩的运用为例，色彩是艺术表现的要素之一，在进行学校网页的设计中，根据要点突出、和谐和均衡的原则，将不同的颜色进行搭配，构成漂亮的、和谐的页面。同时我们根据色彩对用户的影响，并合理的加以运用，按照色彩的记忆性原则，联想与象征的特质，对网站的整体形象色彩进行规划设计，使使用者在心理上产生舒适、愉悦的状态。另外还应注意在制作网页时，虽然颜色应用没有，但是毫无节制的使用多种颜色会使网页风格混乱，让人抓不住网页的主题，所以一般情况下，我们先确定网页的总体风格，然后确定一种主色调，其他色彩的搭配都围绕着主色调进行。
3.4突出学校网站的风格
每个网站都是世界上独一无二的网站，它们都应该具有自己独特的风格。我们以学校网站为例，我们这次要做的学校网站主要是记录学校的美好生活。所以在风格上要图文并茂，很多文字性的内容如标题、主菜单栏目名都可以处理成图像形式，这不但克服了不同平台上的文字兼容性问题，而且页面也显得非常美观、精制，引人入胜，对访问者有较强的吸引力。
3.5学校网站的部分代码实现
3.6推广学校网站
对于学校网站的推广与营销在网站的运行中也占着重要的地位，在推广学校网站之前，我们一定要做好以下内容：学校网站信息一定要具有准确、丰富、及时等特点。并且学校网站的互交性能良好。一般，我们可以做友情链接，最好是流量多、pr值高的网站，我们还需要经常更新，发一些原创或者伪原创的内容，使百度更快的收录我们的网址。长期建立广告站点等方式对学校网站进行推广。
第四章 学校网站的测试
学校网站建成后能否正常的运行，运行后有能否被广大的教师、学生群体喜欢，能否吸引更多的访客关注等等，都是衡量网站开发是否成功的标准，系统测试成为系统应用开发过程中的一个重要环节，需要通过测试尽可能多的发现浏览器端和服务器端程序中的错误，并及时加以修正，并保证系统应用的质量
4.1 测试内容
现在校园网络维护的建设已成为现代教育机构的必然选择。从类型来看，校园网大都属于中小型系统，以园区局域网为主。但是它的网络结构和性能要求却有一定的特殊性，为此，相应的网络维护和网络测试方法应有一些特别的考虑。 校园网的建设主要是为了教学应用，而多媒体辅助教学和多媒体教室是教学应用的核心，所以视频信息的传输很重要。在校园网中常会出现几十个学生进行并发操作的现象，所以要考虑并发信息的控制；而且，校园网的应用和管理应简便易行，界面友好。其次，为了保证学校网站的正常使用，我们还要检查文字、图片连接是否正确、网页包括显示器、浏览器的兼容性测试同样不可缺少。
4.2测试过程
4.2.1功能测试
连接测试，链接是WEB应用系统的一个的主要特征，它是在页面之间切换的主要手段，连接测试分三个方面：首先，测试所有的链接是否按指定的那样连接到了该链接的页面。其次，测试所连接的页面是否存在，最后保证WEB应用系统上没有孤立的页面。
4.2.2可用性测试
可用性测试包括图形测试和整体界面测试。图形测试在WEB应用系统中既有广告宣传的作用，又有美化页面的功能。一个WEB应用系统的图形有动画、颜色、字体、边框、图片、背景等。
4.2.3兼容性测试
WEB兼容性测试主要是针对不同的操作系统平台、浏览器以及分辨率进行测试，由于用户浏览器的不同，往往都会使我们的网页发生样式混乱，图片无法显示等问题。所以对网站进行兼容性测试时非常重要的。浏览器是WEB客户端最核心的构件，不同厂商的浏览器对不同的HTML规格有不同的支持，所以我们要根据具体的要求进行各个浏览器的测试，对于那些不能打开的浏览器进行测试并进行记录。
4.3效率分析
4.3.1优点及不足
优点是页面都有导航按钮，操作比较方便快捷，并且内容简单易懂。
缺点是内容不够多，视频无法控制进入之后自己就会自动播放，有的浏览器不支持。
4.3.2软件测试的意义
网站测试是为了发现错误而执行网站的过程，成功的测试是发现了至今尚未发现的错误的测试。
测试的目的就是希望能一最少的人力和时间发现潜力在的各种错误和缺陷、应根据开发各阶段的需求、设计的内部结构精心设计测试用例，并利用这些实例来运用程序，以便发现错误。
结束语
通过这段时间对网页的设计与应用的学习，对我来说是一个将所学的知识从书本运用到实际操作的初次体验。通过这次的论文写作让我了解了学校网站的形成制作过程和基本纲领构架，并且，让我对现代计算机技术。通讯技术有了更深的认识和了解。并且，在设计与制作的过程中更加熟悉这些软件工具，提高了自己的相关操作能力。由于这次个人专业知识有限，加上实际经验不足，在网站相关设计和整体把握上肯定存在这不足，希望这样的情况以后能够得以改善，并且在以后的学习中能得到提高，以使它适应不同层次使用者的需求。
参考文献
Copyright © 2019-2025 51dongshi.net 版权所有
违法及侵权请联系：TEL:177 7030 7066 E-MAIL:11247931@qq.com 本站由北京市万商天勤律师事务所王兴未律师提供法律服务
