《internet网站开发技术》课程设计报告

《《internet网站开发技术》课程设计报告》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、《Internet网站开发技术》课程设计题目：泡儿励志网组员：叶舒平韦金玉陈晖班级：2010职师计本学院：职业技术师范学院指导教师：李宁日期：2012/6/19目录目录《Internet网站开发技术》课程设计1目录21前言32基本任务和角色分工32.1基本任务32.2角色分工33网站开发各环节33.1网站定位33.2网站风格设计43.3网站信息搜集与素材43.4网站栏目规划和目录结构设计43.5网站页面方案设计43.6网站页面设计53.7网站编码规范63.8网站导航设计63.9网站整合与测试63.10网站的环

2、境准备63.11网站经费预算63.12网站维护与推广73.13用户安装使用说明74小结7参考文献71前言[网站背景与意义说明]网站背景：在物欲横流的当今时代，不得不说，我们的精神世界相对来说是比较贫乏的。然而，榜样的力量是无穷的，刻苦奋斗，勇往直前的人就是我们的精神支柱。我们的网站定位主要是在青少年人群，通过身边的各种人和各种事，激励我们更大的学习兴趣以及更强的学习劲头。2基本任务和角色分工2.1基本任务⑴分析讨论，给小组确定一个队名，然后收集网页制作的相关素材。⑵确定网站主题，然后对整个网站进行规划设计，确

3、定网页的布局。⑶分配任务，每个成员开始做自己的任务实现各个子功能。2.2角色分工客户：陈晖提出对网站的要求设计师：韦金玉理解客户的要求，并且和客户一起确定网站的整体风格，网站的主要栏目和主要功能。程序开发员：叶舒平对客户和设计师的各种要求进行落实，通过代码将功能实现出来。3网站开发各环节3.1网站定位网站的定位主要是定位在青少年人群中，我们建设这个网站的目的就是通过互联网的形式，把身边的那些榜样的实际放到网上去，供青少年阅读，以此来提高大家的精神境界和道德水平。3.1.1网站行业定位网站的行业定位是主要是给青

4、少年提供各种各样的激励人心的事例，为他们的个人成长提供指引和帮助。3.1.2网站用户定位本网站的定位的用户人群是比较狭小的，主要是青少年人去，由于人力和物力以及财力等等各种因素的制约，网站的用户定位是比较狭小的，这样子才有可能将网站做的更精更细。3.1.3网站设计定位我们合理的队网站的色彩和架构进行搭配，使网页显得清晰和简洁，而且页面适合搜索引擎的友好性标准。3.1.4网站推广定位网站的推广定位主要是搜索引擎和我们栏目的关键词以及网站的主题来实现的。3.2网站风格设计3.2.1基本原则Logo的设计比较有特色

5、，通过一个多彩的环，将各行各业的人物有机的联系在一起，也寓意着在生活中，我们也可以多姿多彩的。其二是我们的主色调深蓝比较突出，显示出网站睿智深沉的风格。再次就是标题和主菜单的文字大小，它们的大小都符合网民的阅读习惯，提高了浏览的舒适性，可以提高网站的访问量，进而提升网站的知名度。3.2.2网站色彩的使用色彩对视觉的刺激是信息传达起到第一信息传达的作用。因此在色彩的选择上，是经过我们小组成员的深思熟虑才采用深蓝色和你涂色的搭配的。在网站使用的几种颜色中，主色调是深蓝色和泥土色，辅色调是白色。由于颜色显得比较深沉

6、，因此将辅色调设为白色，这样就使得网站更加的浑然一体。3.2.3网站网页版式设计网站的网页版式设计是典型的1-3-1布局1部分放置网站的logo和导航栏，下方尽量留出一点点的空间，以使弹出的下拉菜单更加容易看得见，而且，当收起下拉菜单时，又显得大方美观，这种构思可谓是一石二鸟！在中间的部分就放置一幅大图，该图寓意着对梦想和希望的追求。同时，该幅图画也占据了主页中的大部分空间，就是为了达到一种视觉传达信息的效果，通过图画来说话，显得美观大方而又简洁清晰。如下图所示：3.3网站信息搜集与素材网站的文字信息主要是从

7、志强社的活动中要过来的，然后我们从中筛选合适的材料，还有图片的信息，大部分都是从志强社那边要过来的，还有一部分的内容就是在网上收集的。3.4网站栏目规划和目录结构设计3.4.1网站栏目规划泡尔励志网志强之星励志阅读名言格言资源下载励志奋斗思想者文化苑榜样集激励人生人物传奇心灵励志名人名言名言警句民间谚语励志书籍学习交流志强风采3.4.2网站目录结构设计我们网站的主目录主要是放置主页，然后里面再放Image文件还有css文件，以及Js文件等等。每个文件夹里面都有相同的设置。如下图所示：3.5网站页面方案设计3.

8、5.1首页方案设计3.5.2栏目首页方案设计3.5.3内容页方案设计3.6网站页面设计3.6.1首页设计（1）内容分析在首页的位置中，主要放置以下的一些信息：ⅰ、放置导航栏还有网站的logoⅱ、最下面的那部分放置一些最新的活动的图片，还有最近更新的内容以及必不可少的友情链接（2）结构设计HTML结构设计如下所示：相应的代码如下所示：