（一）前端设计
图1网站前端功能图
图1展示了网站前端的功能，用户可通过欢迎页面，进入世纪学院田径队网站的首页，通过导航栏查看自己所需要的信息。点击“场馆介绍”，在这里展示了学校的健身房、训练场以及各个器材的使用方法。介绍健身房中的器械时，会插入图片翻转的特效，点击器材的图片，图片将会翻转显示出文字简介。
点击“田径之星”这里介绍了世纪学院田径队的教练、历任队长和现任队员。这里的现任队员版块运用了图片轮播的特效，将他们训练、生活的照片循环播放，方便用户浏览。
点击 “往年风采”，这里展示了从2005年建校至今，世纪学院田径队的全部获奖内容，并分类于“春季比赛”、“秋季比赛”和“其他赛事”中。这里的获奖图片是按照时间排序的，任意点击一张图片，皆可以放大浏览。
点击“新闻通信”的“训练通知”，这是一个连接后台且针对于田径队员的模块，每天下午3点以前会更新当日的训练时间和地点。点击“新闻通信”的“赛事播报”，这里展示最近一次比赛的风采佳绩，这个模块分为两部分，下面的文字是固定不动的，上面采用的是图片轮播的特效，并且点击任意一个图片，轮播暂停，图片可以放大。
点击“报名留言”，用户可以在这里匿名留言，对于田径队有兴趣的健儿们也可以填写报名表，这些数据都会存储在后台中，管理员会对于留言信息进行回复。
最后一个模块是“运动达人”，点击进入第一个版块“饮食推荐”，这里每周会更新一次“减脂餐”，“增肌餐”， 点击进入第二个版块“徒手健身”，这里运用了3D相册浏览的特效，将8个简单易学的健身动作的图片及讲解串连在一起，方便用户浏览学习。
（二）后台设计
图2网站后台功能图
图2展示了后台数据库的功能，一共有4个后台。在“训练通知”的后台中，需要进行文字的添加、删除、修改的功能，并且此后台需要管理员每日下午3点更新。在“赛事播报”和“饮食推荐”的后台中，需要进行文字和图片的添加、删除、查找的功能。“赛事播报”需要在比赛结束后的两天内完成更新，“饮食推荐”需要每周更新一次。在“报名留言”的后台中，需要进行增加回复信息，储存用户留言的功能，如果用户发布了不恰当的言语，管理员需在后台中将其删除、禁止发布。