摘要
随着计算机、互联网与通信技术的进步，Internet在人们的学习、工作和生活中的地位也变得越来越高，校园网站已经成为学校与学生，学生与学生之间交流沟通的重要平台，对同学了解学校内发生的各种事情起到了重要的作用。学校网站建设是学校教育信息化建设的重要方面，是适应现代化教学技术，提高学校通知和管理效率的重要途径。
本课题开发了一个校园网站，主要发布校园日常生活中所发生的事件，完成对学校通知、活动举办、失物招领等的数字化管理。主要用于帮助学生们了解学校内发生的各类事件，也提供给学生们一个可以发布信息的平台，而对管理员而言，本文也开发了一个专门的后台网页，包含了增删改查的功能。使用本网站可以极大地节约通知成本，提高效率。
本文选用了功能十分强大的VisualStudioCode作为开发工具，采用HTML，CSS，JSP以及JavaScript来制作网页，用于数据存储的数据库选择了MySql，使用Tomcat作为临时服务器。经过了多项软件测试，网站基本满足了设计需求，最后对其中存在的各种问题进行了仔细研究，得到了相应的解决方法，并提出了后续更新期望。
关键词：校园网站；HTML；CSS；MySql
程序功能结构图
下图是我设计的网站的功能结构图，通过结构图可以清楚地看到网站的各个部分的功能，以及它们之间的关系。
图1程序功能结构图
2数据库设计
想要开发一个相对完善的网站，不能将所有的文字内容全部写入HTML中，这样会导致代码杂乱无章，可读性差，不易维护。所以要选用一个合适的数据库来存储网站所需要使用的数据，再通过编写代码链接数据库与网站，这样做会使代码尽可能的拥有更高的可读性和简洁性。在本次设计中，我选择的是MySql数据库。
3数据库概念设计
依照网站的需求分析，可以得出要创建的数据库表单对应的实体有：用户，新闻，收集信息。
用户表单，如图2所示：
图2用户表单
2登录/注册
用户输入账号和密码后登录，如果输入值是空的，在提交到MySql的过程中会弹出错误提示窗口，如果输入值非空，并且与MySql中的数据相对应，则提示登录成功。
用户点击登录框右下角“注册”字样切换到注册页面，用户输入账号以及密码进行注册，如果有空值，则弹出相应的警告信息；又或者账号在数据库中已经存在，则弹出账号已存在的提示；如果没有任何问题，网站会将账号以及密码存到MySql，然后提示注册成功。其中登陆流程图如图1所示：
图1登录流程图
软件测试
1测试的重要性
软件测试是一个用来验证系统正确性、可行性、安全性的过程。它通过对软件结构及功能的检查来评估软件是否满足需求，同时也要考虑到用户使用软件时产生的问题。因此，测试就是为了确保软件开发质量而进行的一项活动。换言之，软件测试就是将系统运行的实际结果与预期结果进行比较，以确定系统是否有缺陷的过程。这一步给了我们优化软件的方向，让软件获得更高的质量。因此，软件测试在整个系统的开发中起着质检员的作用。及时发现不合格的软件系统对软件开发过程至关重要。因此，我们必须重视对软件测试工作进行研究和分析，以提高系统的可靠性。
近几十年来，软件行业发展速度飞快，但软件测试的发展并没有跟上软件行业的脚步，系统测试的重要性常常被忽视。软件最重要的是需求，最重要的是可行性，最重要的是设计，最重要的是开发，而测试经常被人们忽视，系统测试看起来很枯燥，技术含量没有那么强，但它真的很重要。其实，我们在开发一个软件产品时，首先要考虑到它是否符合自己的需求和目标，然后才可以进行详细地分析和设计阶段的代码工作。系统测试的缺失会导致许多带有BUG的软件，以及许多不符合其原始要求的软件的出现。因此，系统测试是不可或缺的。
2测试的目的
测试的目的是寻找软件中存在的不合理之处，并针对这些不合理的地方对软件进行优化，使其功能满足用户的需求。因此在开发过程中要根据实际情况来设计测试用例。
因此，我们不只是为了证明软件具有某些功能而进行测试，而是为了寻找其中未被发现的BUG。在软件测试过程中发现BUG也并不是唯一的目的，我们最终想要的是通过修改BUG来改善程序中存在的缺陷，因为被发现的问题是可以被修改的，我们只需要对代码做适当地改动就能够达到预期效果，这样做既提高了效率又节省了成本。这使得整个软件既完整又严谨。
3详细测试内容
3.1链接跳转功能测试
(1)测试目标：链接能否正常跳转
(2)测试时间：2022年4月6日
(3)测试步骤：
1、点击网站中所有可以点击的链接
2、测试观察被点击的链接是否能够实现跳转
(4)测试结果：
测试结果为所有的测试链接都能够实现程序所要求的跳转。其中一项测试如图1所示：
图1点击通知公告后跳转到其内容页
结论
本文首先阐述了为什么选择校园网站作为研究方向，并对校园网站的相关背景做了介绍，然后对网站的可行性进行了分析，介绍了编写程序所需要的相关技术及工具，分析了用户需求，并根据需求设计了数据库，展示了其中部分功能的实现方法，最后对已完成的功能进行了软件测试，并在最后得出了结论和后续展望。
校园网站对学校和学生的重要性不言而喻，而国内对这一方面并没有太多重视。本文针对这一问题进行了深入研究和分析，基于编写网页的理论基础和相关理论知识，与校园实际情况综合考虑，通过多方面的分析，给出了一种可行的网站设计，并实现了它。
参考文献
[1]陆凌牛.HTML5与CSS3权威指南[M].机械工业出版社,2011.
[2]刘薇,龚海华.HTML5&CSS3在网页设计中的优势[J].金田,2012.
[3]罗正蓉,范灵.应用HTML和CSS制作网页[J].科技展望,2016,26.
[4]巩恩伟.CSS在网页开发中的运用技巧[J].中国科技信息,2011,24:2-4.
[5]毛冲.浅谈CSS3在网页开发中的特性[J].江西广播电视大学学报,2014(1):3.
[6]王艳.探析HTML5与CSS3在网页设计中的新特性和优势[J].电脑编程技巧与维护,2016(21):70-71+88.
[7]刘宏.用CSS实现图片特效滤镜[J].辽宁师范大学学报:自然科学版,2002,25(4):391-393.
[8]凌诗佳,蓝伴儒.浅析HTML与CSS的功能,区别与联系[J].信息系统工程,2011(8):123-124.
[9]PeterLubbers,BrianAlbers,FrankSalim,等.HTML5高级程序设计[M].人民邮电出版社,2011.
[10]FrainB.ResponsivewebdesignwithHTML5andCSS3[M].PacktPublishingLtd,2012.
[11]DuckettJ.HTML&CSS:designandbuildwebsites[M].Indianapolis,IN:Wiley,2011.
[12]KeithJ.HTML5forWebDesigners.2010.
[13]ParkTH,SaxenaA,JagannathS,etal.TowardsataxonomyoferrorsinHTMLandCSS[C]//ProceedingsoftheninthannualinternationalACMconferenceonInternationalcomputingeducationresearch.2013:75-82.
[14]SharpR,LawsonB.IntroducingHTML5.2011.
[15]YadavP,BarwalPN.DesigningresponsivewebsitesusingHTMLandCSS[J].internationaljournalofscientific&technologyresearch,2014,3(11):152-155.
