学校网站的规划与设计

摘要：做好一个网站，可以全面宣传，展示学校风采、优点与特色，发布学校的活动安排等信息内容，使学生及家长增加对学校的了解，增强学生、家长与学校之间的联系，在Internet网上，让学生及家长及时得到学校发布的重要信息，同时也帮助了学校完成部分教学事务，提高办事效率,给学生、家长与学校最方便的联系桥梁。在这里学生及家长也可以提出意见及想法，互通教学之间的意见想法，更加有效的提高教学质量，学生需要哪样的教学方式能够更好的吸收与接纳？这些都能成为学校的参考，以便更加的提高学校的办学及教学水平。关键字：Internet校园网ASP技术Dreamweaver一、校园网发展现状Internet的迅速发展，极大地推动了我国的网络建设。我国先后建立了中科院互联网(NCFC)、中国教育科研网(CERNET)、中国公用计算机互联网(CHINANET)、中国金桥信息网(CH工NAGBN)等四大网络。特别是中国教育科研网(CERNET)的发展，极大地促进了学校校园网的建设。社会网络大环境的影响、有关教育部门的支持、校领导的重视以及教师和学生的积极要求，使得校园网的建设如鱼得水，非常顺利。据统计己经建成的校园网，其布点范围从几百个到几千个不等，在技术上是跟得上国际发展潮流的。校园网的开通，不仅改变了传统的教学模式、教学方法和教学手段，促进了教育观念和教学思想的转变，而且拓宽了教师和学生的视野，有利于培养学生的创造性思维，提高学生获取信息、分析信息、处理信息的能力和适应现代社会的能力。校园网的开通，从根本上促进了教学、科研人员之间的信息交流、资源共享、科学计算和科研合作，成为学校教育和科研工作最重要的基础设施。中国教育和科研计算机网的建设直接引导和推动了校园网。截至目前，这一网络已经通达内地的160个城市，联网的教育机构和科研单位达900多个，联网主机120万台，网络用户800多万，成为国内仅次于中国电信的第二大互联网络。中国教育和科研计算机网己经成为世界上最庞大的‘校园网’。在这样的一个背景下，我校本着从实际出发、节省的原则，在条件具备的前提下，决定组建校园网络，与Internet互连，并自行建立自己的校园网站（）为满足我校日益增长的办学、科研、培训的需要。二、规划原则经过一学期的准备，本着以学校教育教学需求为前提，讲究方便、实用和易管的原则，现初步将学校网站栏目做如下规划和设置：（一）首页规划网站首页，就是用户进入网站看到的第一个网页。首页是网站的门面，首页制作质量直接影响到用户对网站的整个印象。一般首页制作占整个制作时间的30%左右，所以在首页制作时要多花些功夫。按照网页设计的版块、字体和色彩搭配方案对首页进行“精雕细刻”。使首页达到简洁明快的风格，简单的表格，令人愉快的色彩搭配，协调的文字，浏览速度快，易于导航，经常保持新鲜感，使访问者赏心悦目。网站主页采用静、动互相结合的方式，即静态的主画面和动态的图片相结合，体现学校的勃勃生气，静态主页方式介绍学校风采、优点特色、信息发布，对于新闻留言等，就得利用ＡＳＰ与数据库结合的技术建立数据库查询管理系统，采用交互式的动态的web画面来实现。（1）、首页内容模块。首页分模块进行制作，一般的站点有这样一些内容模块：站点名称、动态广告条、主菜单、新闻、校长寄语、网站导航、校园公告、友情链接等。首页选择哪些模块，实现哪些功能，是否需要添加其它模块，这都根据学校网站主题和内容来确定。内容模块确定后，按照首页设计的版面，发挥网页制作人员的创意和想象力，制作出比较满意的网页。（2）根据上面的设计思想进行分析，按照系统开发的基本观点对网站进行分解，从内容上可对网站作如下划分：学校概况：包括学校概况、学校荣誉、领导风采、校园快讯以及部分图片等内容。教学动态：包括学期计划、考试信息、教研动态、实验安排、教学总结等子项栏目。教学资源：包括教学研究、教学论文、教学课件、经验交流等子项栏目。教师之窗：包括教工生活、教师主页、教师风采、教育信息、教研组信息等子项。学校天地：包括校园生活、校园之星、学生风采、学生作品、学习交流等子项。网络德育：包括规章制度、德育科研、心理辅导、社会活动、教育法规、学生评语、住校生管理、国旗下讲话等子项。卫生保健：包括送你健康、生活保健、生活急救、健康课程、心理茶室等栏目。电脑学堂：包括新手学堂、软件应用、硬件知识、网页制作、软件下载等栏目。校园留言：通过留言板与学生家长联系，有利于家校沟通，意见互换。三、开发工具的选用及介绍ActiveServerPages：“动态服务器网页”，一般简称为“ASP”，ASP之所以能受到大家的重视与使用的原因，主要在于所产生的执行结果都是标准的HTML格式，而且这些程序是在网络服务端中执行，使用一般的浏览器（如IE或Netscape）都可以正确地获得ASP的“执行”结果，并且将这ASP执行的结果直接在浏览器中“浏览”，不像VBScript或JavaScript是在客户端（Client）的浏览器上执行，若使用VBScript来设计程序，客户端（Ｃlient）在ＩＥ浏览器中可以显示程序执行的结果，可是，客户端（Ｃlient）若使用Netscape浏览器就无法显示VBScript的执行结果。常用的一般代码编辑程序，如Windows记事本，就可以编辑。当然，其他网页发展工具，例如，FrontPageExpress、ＦrontPage、Dreamweaver等也都可以；不过还是建议你用记事本来编写，既省时又方便，调试可选用Dreamweaver等可视编辑软件。当然你若全是静态页面。可不用asp动态服务器技术。而我校编写的网页功能较多，所以我选择了ASP结合Dreamweaver组建了本网站。四、制作技巧（一）版面设计版面设计是整个网站构思过程中最重要的一部分，因为好的版面布局给浏览者不但会留下好的第一印象，而且还会带来一个好的心情。学校站点的版面设计可以是明快、亮丽型；可以是古朴、大方型；可以是凝重、整齐型等。就像传统的报刊杂志编辑一样，可以将网页看作一张报纸、一本杂志来进行排版布局。虽然动态网页技术飞速发展，但是静态的网页版面设计基础依然是必须学习和掌握的。它们的基本原理是共通的，领会要点，便可举一反三，触类旁通。（1）创意草案草案的形成决定着将来网页的基本面貌，类似一个设计创意。它往往来自于一些现有设计作品、图形图像素材的组合、改造、加工。其思维方式有两种：借鉴模仿和逆向重组。构思伊始，设计者可能会受现存的一些网页设计的影响，借鉴现有的设计样式是很自然的事，但不能照抄照搬。吸取成功作品中的一些视觉元素及其组合方式，加入自己的新元素，形成新的组合，这种借鉴模仿可以比较顺利地产生网页方案的雏形。逆向重组是利用反向思维来完成设计和创作，把现有作品的视觉元素的性质加以改变、重组，与自己的素材结合而产生新的设计作品。比如，原有作品的背景色是黑色的，你把它改成白色，就会变成另外一个样子。也就是说将某一视觉元素中的某一描述参数加以改变，从而实现新的设计作品。由此可见，设计者的工作很像作曲家创作音乐作品，需要从民间音乐中寻找素材，把一首歌谣创作成一首乐曲，把单独的乐曲发展成一个乐章。应该说明的是，借鉴模仿和逆向重组都是对视觉元素的量的改变，至于变化到什么程度，需要有专业的眼光、素养才能把握住。你可以用一张白纸和一支铅笔，把你最初的创意画出来。这属于创造阶段，不讲究细腻工整，不必考虑细节，只以粗陋的线条勾画出创意的轮廓即可。尽你的可能多画几张，最后选定一个满意的作为继续创作的脚本。（2）粗略布局在草案的基础上，将你确定需要放置的功能模块安排到页面上。功能模块我们在前面已提过，主要包含学校标志、主菜单、新闻、校长寄语、网站导航、校园公告、友情链接等。注意，这里我们必须遵循突出重点、平衡协调的原则，将学校标志、主菜单等最重要的模块放在最显眼、最突出的位置，然后再考虑次要模块的排放。（3）最后定案将粗略布局精细化、具体化。在布局过程中，我们可以遵循的原则有：①平衡：指画面的图像文字的视觉效果在左右、上下几个方位基本相等，分布匀称。②呼应：在不平衡的布局中的补救措施，使一种元素同时出现在不同的地方，形成相互的联系。③对比：利用不同的色彩、线条等视觉元素相互映衬，造成画面的多种变化，达到丰富视觉的效果。④疏密：疏，是指画面中元素稀少(甚至空白)的部分；密，是指画面中元素繁多的部分，在网页设计中就是空白的处理运用，太满、太密、太平均是任何版式设计的大忌，适当的疏密搭配可以使画面产生节奏感，体现出网站的格调与品位。以上的设计原则，虽然枯燥，但是如果能运用到页面布局里，效果就大不一样了。比如，网页的白色背景太虚，则可以加些色块；版面零散，可以用线条和符号串联；左面文字过多，右面则可以插一张图片保持平衡；经过不断的尝试和推敲，一个崭新的设计方案便完成了。若你的美学差一点，也可请个美学好点的老师帮助你。（二）图文及页面的制作网页制作要图文并茂，很多文字性的内容如标题、主菜单栏目名都可以处理成图像形式，这不但克服了不同平台上的文字兼容性问题，而且页面也显得非常美观、精制，引人入胜，对访问者有较强的吸引力。文字处理方法和Word相同,在这里就不再多述。图片可以通过扫描仪或数码相机获得，再复制到网页上直接使用，也可以将图片经过Photoshop或Fireworks艺术加工后再使用。动画可以自己动手用Flash制作，也可以在互联网的动画宝库中下载。当然使用的前提是要和自己做的色调一样。制作时应该注意：为了使页面浏览下载速度快，就要尽可能地减少页面的数据量，减少图像和动画的数量，特别是大的图像和动画；尽量减少表格嵌套，不要把所有的内容都放在一个大表格里；页面保存必须在根目录下各建和页面名称相同的文件夹，以存放每一页的图片等网页素材，这也方便了我们以后的管理和维护。子页的制作，其方法和首页制作相同，都要遵循首页制作一些规则。在制作一级子页时，首先要考虑子页的个数和每个子页的名称，然后将制作好的首页分别另存为每个一级子页的名称，把它们作为新建的一级子页面，这样，一级子页面的标题和导航以及版面信息就设置完毕。只需要在相应的子页面里修改相应的内容即可，从而大大地提高了子页面的制作速度。一级子页页面的显示尽量采用新建窗口的形式，这使用户在等待页面下载的同时还可以继续浏览其它内容。在网页制作方面还有许多技术细节，诸如如何适应不同的浏览器，在不同的分辨率下保持网页不变形，如何减少垃圾代码等等。首页相比其它页面来说，技术上要求更加严格，决不能出错。现在有不少网站教学类的网站，如：网页教学网（）可多多参考，不断提升自己的制作水平。五、网页（站）的调试一切前期工作做好后，我们要做的事就是要调试网页，看看有没有做的不理想，不成功的地方，网页的调试，我们经常使用的方法有多种，如直接本机预览、在网络上应用网页代码调试器在线预览（）、安装iis服务器组件调试。现为大家介绍其中两种我们经常用的方法。（一）本机直接预览本机直接预览就是在制作时直接按预览按扭。如在Dreamweaver中，选择“文件”→“在浏览器中预览”→“iexplore”即可。或直接按快捷键“F12”亦可。还可在根目录中找到想要预览的htm文件，双击就可预览。（二）安装iis服务器组件调试IIS（InternetInformationServer，互联网信息服务）是一种Web（网页）服务组件，其中包括Web服务器、FTP服务器、NNTP服务器和SMTP服务器，分别用于网页浏览、文件传输、新闻服务和邮件发送等方面，它使得在网络（包括互联网和局域网）上发布信息成了一件很容易的事。IIS组件的添加我们在此不再赘述，安装好iis后，点击“开始”→“程序”→“管理工具”→“Internet信息服务”，选择“默认网站”右击，选择“属性”修改主目录。转到“主目录”窗口，再在“本地路径”输入（或用“浏览”按钮选择）好自己网页所在的“D:\Wyw