网站设计方案(修改).doc

XX网站设计方案 （模板） 专业班级： 姓 名： 学 号： 指导教师： 日 期： 目 录 1.网站的目标规划 2.网站的内容规划 3.网页的风格和布局设计 4.网站的资料收集和准备 5.网站制作进度安排 6.网站建设的心得体会和扩展性分析 1．网站的目标规划 1.1 网站主题策划 通过网络就某个主题搜索资料，题材不限，要求有个人特色、新颖和有吸引力，并对网站作简单的介绍如主题是什么？分那几个栏目，每个栏目的特色和主要内容是什么？ 参考专题：对计算机基础教育的看法，互动式教学的方式，网上论坛，QQ聊天论述等。也可以是其它的有兴趣的专题如：文学、历史、科技、体育、旅游、生活、时尚等。 参考主题：（1）教学资源网站；（2）个人网站；（3）班级网站；（4）学习网站；（5）学校网站；（6）旅游网站；（7）公司网站；（8）体育网站。 1.2 目标用户定位 确定了站点实现的目标之后，需要确定站点的浏览客户。创建世界上每个人都能使用的 Web 站点是不可能的。人们的兴趣、爱好不同，使用不同的浏览器，以不同的速度连接，这些因素都会影响站点的使用。因此需要确定目标用户，根据用户的特点来设计站点风格。 2．网站的内容规划 2.1网站栏目结构设计 （一般企业型网站应包括：公司简介、企业动态、产品介绍、客户服务、联系方式、在线留言等基本内容。更多内容如：常见问题、营销网络、招贤纳士、在线论坛、英文版等等。） 可先在纸上绘制网站的栏目结构草图，经过反复推敲，最后确定完整的栏目和内容的层次结构，本网站的系统结构图如下（示例）： 表2.1　“XX企业网站”的栏目结构 一级栏目 二级栏目 三级栏目及内容页面 首页 index.html 关于我们：AboutUs.html qyjj.html …… fzlc.html 新闻中心：News.html News_hy.html News_qy.html …… 产品中心：Product.html proinfo_xx.html proinfo_xx.html proinfo_xx.html proinfo_xx.html …… 联系我们：Contact.html 留言板.html …… 产品论坛（http://www.XXX） 2.2网站目录结构和链接结构设计 1.目录结构 根据网站策划确定的栏目结构，创建站点目录，一个网站的目录结构要求层次清晰、井然有序，首页、栏目页、内容页区分明确，有利于日后的修改。“XX企业网站”的目录结构，各文件夹的所存放文件类型如表2.2所示。 注意：文件夹和文件的名称建议不要使用中文名，因为中文名在HTML文档中容易生成乱码，导致链接产生错误。 表2.2　　网站的目录结构及其存放的文件类型 文件夹名称 存放的文件类型 css CSS样式文件。 flash 动画文件、视频文件。 image 图像文件、照片。 js 外部脚本文件。 Library 库文件。 music 音乐、音频文件。 Templates 模板文件。 text 文字素材。 webpage_1 一级页面文件，该文件夹又有多个子文件夹，例如webpage_1_01。 webpage_2 二级页面文件，该文件夹又有多个子文件夹，例如webpage_2_01。 other 其他类型的文件。 webstandby 备用页面、备用素材 index.html 主页 2.网站链接结构 网站的链接结构与目录结构不同，网站的目录结构指站点的文件存放结构，一般只有设计人员可以直接看到，而网站的链接结构指网站通过页面之间的联系表现的结构，浏览者浏览网站能够观察到这种结构。本网站的链接结构采用“网状”链接结构，结构图如图17-2所示。 3．网页风格和布局设计 3.1网站形象设计 包括设计网站标志、设计网站的标准色彩和网站采用的标准字体等等。例如：网站全名及 logo 标志创意。 3.2网站的界面风格 如主、从色调的搭配（即采用什么色彩为基调，配以相关的其他色彩，与企业整体形象一致），页面导航设计和页面视觉构成等等。 例如：色彩搭配及其含义（如绿色 + 金黄 + 淡白，体现优雅 , 舒适的感觉） 3.3网站的版面布局设计 采用何种方式的页面布局，在网页文字和图像等元素上如何平衡，根据网络速度、阅读习惯等采用了什么技术方案来解决。根据所需的站点布局外观，先画一个站点草图，以便以后建立站点时可以按照它来操作。 1.首页设计草图如下： Logo Banner 简单功能 导航栏 功