网页设计毕业论文.doc

临汾职业技术学院临汾职业技术学院 毕毕 业业 设设 计计 设计题目：设计题目： 第一区上品女装宣传网站第一区上品女装宣传网站 所在系别所在系别 计算机应用技术计算机应用技术 专业班级专业班级 091091 班班 姓姓 名名 指导教师指导教师 日日 期期 20122012 年年 5 5 月月 1010 日日 2012 年 5 月 10 日 临汾职业技术学院大专毕业设计 1 摘摘 要要 在这次毕业设计中，我选择了做网站，由于我自己对服装的喜欢，所以我就选择了服 装网站，同时我在网络上查找了一些服装网站，我最后选择了仿照第四区上品女装网站， 做了第一区上品女装宣传网站，也是我自己个人对第四区上品女装的喜爱，所以就为第四 区上品女装网站做宣传，让更多人知道第四区上品女装网站，第四区上品女装的服饰很新 颖，款式大方得体，还可以知道服装的流行趋势。 我在制作这次毕业设计对网站设计进行了详细的规划，并对各网页的内容进行的详细 的画分，（网站中包括 16 个网页，其中包括首页、上衣、连衣裙、裤子、包包、留言板、 搭配方案：群装搭配打造性感俏佳人 、明星时尚教你穿衣六要点 、浪漫搭配欧美流行新 摩登时尚 、随意自然夏日连衣裙巧搭配 ，以及流行服装：个性牛仔魅力创意、甜美休闲 女孩印花圆 t 袖、热力小背心与阳光争俏、时尚握手奥运碰撞激情，来让大家了解服装。 在这次毕业设计中我感触很深，我需要学习的东西很多，只有经过不段的努力学习才 能让自己提高，在以后会有所发展。 关键字：dreamweaver、flash、asp、access、ps 等工具 临汾职业技术学院大专毕业设计 1 目目 录录 第一章 网站设计的前提和思想.1 1.1 查找资料1 1.2 开发平台的确定1 1.3 网站选题1 1.4 网站主题和明确任务1 1.5 设计网站的意义2 第二章 网站工具的介绍.3 2.1 asp 技术介绍 3 2.2 access 数据库简介 .3 2.3 access 缺点 .3 2.4 iis 服务器 3 2.5 iis 的添加和运行 4 2.6 dreamweaver 介绍 4 第三章 网站总体分析.5 3.1 网站功能需求分析5 3.2 网站设计目标5 3.3 前台和后台功能5 3.4 整个网站页面逻辑结构图6 第四章 网站的详细设计.7 4.1 网站首页7 4.2 网站搭配设计7 4.4 网站产品设计8 4.5 用户登录设计8 4.6 用户注册设计.10 4.5 留言板设计.13 第五章 总结和展望17 致 谢18 参考文献.19 导师评语.20 临汾职业技术学院大专毕业设计 1 第一章第一章 网站设计的前提和思想网站设计的前提和思想 1.1 查找资料 由于我本人对服装的喜爱，所以这次设计我想做一个关于服装的网站，我就在网络上 寻找关于服装的网站，在我最后的筛选下，我选择了仿照第四区上品女装，也同时为第四 区上品女装做宣传，这次设计从网络中查找了大量有关第四区上品女装网站的内容以及服 装的流行趋势和服装的搭配，大量引用了第四区上品女装网站的内容。 1.2 开发平台的确定 在学校学习的这段时间，通过对 dreamweaver 的学习和对它的了解，在这次毕业设计 当中我选择了 dreamweaver 做设计，它的好处多多，制作效率：dreamweaver 可以用最 快速的方式将 photoshop 等档案移至网页上。选单，快捷键与格式控制，都只要一个 简单步色。便可完成。 dremweaver 能与自己喜爱的工具应用， flash 等搭配，不需 离开 dremweaver 便可完成，整体运用流程自然顺畅。除此之外，只要单击便可使 dreamweavr 自动开启 photoshop 来进行编辑与设定图档的最佳化。 1.3 网站选题 这个网站是为方便人们以最快捷的方式获取每年服装的流行趋势，和服装的搭配，这 次设计第一区上品女装宣传网站，是凭着自己对第四区上品女装的喜爱所以本次设计我选 择了第四区上品女装作为参考。也同时为第四区上品女装做宣传，让更多的人都知道第四 区上品女装，第四区上品女装有特别新颖的款式，让流览者眼前一新，感受前所未有的潮 流趋势。 1.4 网站主题和明确任务 本次设计主要是对网站设计中所要使用到的书以及有关网站中所应用到的资料进行了 详细的查找和网站的规划，并对各网页的内容进行的详细的画分，（网站中包括 16 个网页， 其中包括首页、上衣、连衣裙、裤子、包包、留言板、搭配方案：群装搭配打造性感俏佳 人 、明星时尚教你穿衣六要点 、浪漫搭配欧美流行新摩登时尚 、随意自然夏日连衣裙巧 搭配 ，以及流行服装：个性牛仔魅力创意、甜美休闲女孩印花圆 t 袖、热力小背心与阳光 争俏、时尚握手奥运碰撞激情， 4 月 1 到 2 号配置网站设计的服务器，4 月 2 号至 4 月 5 号网上浏览下载相关服装信息，了解流行趋势下载相应的美观图片以备网站制作中使用， 4 月 5 号至 4 月 30 号制作网站，编写登录注册代码，连接数据源。对各个页面做出合理布 临汾职业技术学院大专毕业设计 2 局，为相应的页面做出子网页和对网站进行逐步运行检验发现问题解决相关问题。 对图片的处理以及网站的 flash 制作和设计和 access 中表的制作，使用 asp 和对 dreamweavr 网站的进行了制作和设计。运行正常后，整理网站，写毕业论文。 1.5 设计网站的意义 本次网站设计使我了解在进行动态网页建设所使用的步骤，以及所应用的工具本次设 计主要目的是对第四区上品女装做宣传，所以做了第一区上品女装宣传网站，以使更多的 人知道这个网站并且使更多的人购买第四区上品女装的服装。 网站可以让大家节省时间同时也可以了解到网络上的最新消息。 第二章第二章 网站工具的介绍网站工具的介绍 2.1 asp 技术介绍 asp 是 active server page 的缩写，意为“活动服务器网页” 。asp 是微软公司开发的 一种应用程序,它可以与数据库和其它程序进行交互，是一种简单、方便的编程工具。asp 的网页文件的格式是.asp，现在常用于各种动态网站中。 临汾职业技术学院大专毕业设计 3 2.2 access 数据库简介 microsoft access 是一种关系式数据库，关系式数据库由一系列表组成，表又由一系 列行和列组成，每一行是一个记录，每一列是一个字段，每个字段有一个字段名，字段名 在一个表中不能重复。access 数据库以文件形式保存，文件的扩展名是 mdb。 表表是数据库的基本对象 。 2.3 access 缺点 安全性不够，加了用户级密码容易破解 ,如果做为服务器的话，对服务器要求很高， 否则容易造成 mdb 损坏. 2.4 iis 服务器 internet information server 的缩写为（iis），iis 意味着你能发布网页，并且有 asp（active server pages）、java、vb script 产生页面，有着一些扩展功能。 2.5 iis 的添加和运行 一、iis 的添加 请进入“控制面板”，依次选“添加/删除程序添加/删除 windows 组件”，将 “internet 信息服务（iis）”前的小钩去掉（如有），重新勾选中后按提示操作即可完 成 iis 组件的添加。 二、iis 的运行 临汾职业技术学院大专毕业设计 4 当 iis 添加成功之后，再进入“开始程序管理工具internet 服务管理器”以打 开 iis 管理器，对于有“已停止”字样的服务，均在其上单击右键，选“启动”来开启。 2.6 dreamweaver 介绍 dreamweaver 是集网页制作和管理网站于一身的所见即所得网页编辑器，它是第一套 针对专业网页设计师特别发展的视觉化网页开发工具，利用它可以轻而易举地制作出跨越 平台限制和跨越浏览器限制的充满动感的网页。 dreamweaver 的特点：最佳的制作效率 ， 网站管理，无可比拟的控制能力 。 第三章第三章 网站总体分析网站总体分析 3.1 网站功能需求分析 这次设计的网站功能是主要为了方便大众对服装的趋势有所了解，不需要走出家门 就可以了解的到，只需在家就可以知道服装市场的动态，方便的同时也为您节省了更多 的时间，省出来的时间你可以支配在其它方面，提高自己。 现在宅男、宅女是越来越多，被大多数年轻人追捧，都不愿意出门，便可以知道天 下事，就好像古时候的秀才一样，宅男、宅女的出现为网络的走红又增加了一笔不小的 财富，网站不知道为人们提供多少的方便，所以网站是现在人不可缺少的一部分，就像 人离了地球生活不能继续，也许，我这个例子举的有些夸张，但至少我自己是这么认为 的。 3.2 网站设计目标 临汾职业技术学院大专毕业设计 5 现在人们都离不开网络，网站可以为大家节省时间的同时还可以得到最时尚的元素， 让人们成为最为前言的人，所以必须追求网站的完美化，来为流览者提供最好的服务，这 样你的网站才能在网络上立足，点击率上升，这才能证明你这个网站才是个成功的网站， 在设计上要大方得体，突出人们所想看到的东西，让浏览者看的清清楚楚，了解的明明白 白，这样浏览者才会经常光顾你的网站，让你的网站越做越大，越做越好，为浏览者提供 最便捷的服务和最时尚的元素，让浏览者成为最时尚的人，赶在时尚最前沿，打动流览者 的心。这是网站在网络上要生存的唯一办法。 让浏览者不出门就可以知道国事，天下事，事事知晓。 3.3 前台和后台功能 网站的前台是用来面向网站访问的用户，通俗的说也就是给访问网站的人看的内容 和页面，网站前台访问可以浏览公开发布的内容，如服装样式、提交留言等操作。网站 后台，有时也称为网站管理后台，或网站后台管理，是指用于管理网站前台的一系列操 作，如：服装样式的增加、更新、删除等。通过网站管理后台，可以有效的管理网站供 浏览者查阅的信息。网站的后台通常需要密码等信息的登录验证，登录信息正确则而后 进入网站后台的管理界面进行相关的一系列操作。 3.4 整个网站页面逻辑结构图 首页上衣连衣裙裤子 流行服装 个性牛仔魅力创意 甜美休闲女孩印花圆 t 恤 热力小背心与阳光争悄 时尚握手奥运碰撞出激情 裙装搭配打造性感俏佳人 明星时尚教你穿衣六要点 浪漫搭配欧美流行新摩登时尚 尚 随意自然夏日连衣群巧搭配 留言板包包 服装搭配 临汾职业技术学院大专毕业设计 6 第四章第四章 网站的详细设计网站的详细设计 4.1 网站首页 网站的首页可以一目了然知道什么样的服装在那个页面，可以随时可以进入任何以 个页面了解服装的动态，页面分别是：首页、上衣、连衣裙、裤子、包包、留言板、裙装 搭配打造性感俏佳人、明星时尚教你穿衣六要点、浪漫搭配欧美流行新摩登时尚、随意自 然夏日连衣群巧搭配、个性牛仔魅力创意、甜美休闲女孩印花圆 t 恤、热力小背心与阳光 争悄、时尚握手奥运碰撞出激情，这些页面的建立，为用户提供了足大的方便。 4.2 网站搭配设计 临汾职业技术学院大专毕业设计 7 网站的搭配方案从四个大的页面来阐述的，裙装搭配打造性感俏佳人、明星时尚教你 穿衣六要点、浪漫搭配欧美流行新摩登时尚、随意自然夏日连衣群巧搭配，教大家如何穿 出时尚和品位。 4.3 产品流行设计 网站的流行服装也是从四个大的页面来阐述的，分别是：个性牛仔魅力创意、 甜美休 闲女孩印花圆 t 恤、热力小背心与阳光争悄、时尚握手奥运碰撞出激情， 每年的流行款式 都是不一样的，要想跟的住潮流，就不能和网络形同陌路，这样你就会失去方向，把握不 住流行趋向，所以你要和网络成为最熟悉的人。 4.4 网站产品设计 网站的产品有首页、上衣、连衣裙、裤子、包包、留言板，服装搭配 ：群装搭配打造 性感俏佳人 、明星时尚教你穿衣六要点 、浪漫搭配欧美流行新摩登时尚 、随意自然夏日 连衣裙巧搭配 ，流行服装：个性牛仔魅力创意、甜美休闲女孩印花圆 t 袖、热力小背心与 阳光争俏、时尚握手奥运碰撞激情，为大家提供方面同时为第四区商品女装作服装宣传。 4.5 用户登录设计 要想进入该网站必须通过登录才能进入该页面，无论是注册用户与非注册用户都必须 通过登录进入首页，再进入各个页面来进行浏览该网站。 临汾职业技术学院大专毕业设计 8 请输入用户名: 请用户输入密码: 注册 这是您首次访问本页“ response.write “您本次访问网页的时间是“&now else response.write “您最近一次访问本页的时间为：“&tvisit response.write “您本次访问本页的时间为：“&now end if session(“visittime“)=now % 4.6 用户注册设计 如果没有在该网站注册的话，是不能进入该网站的，所以要想浏览该网站的页面必须 先进行注册才可以进入该网站进行浏览自己喜欢的页面。 请填写注册信息： 临汾职业技术学院大专毕业设计 10 用户名： 注册密码： 确认密码： 性别： 男 女 保密 爱好： 临汾职业技术学院大专毕业设计 11 来自： 太原 大同 朔州 原平 忻州 运城 临汾 长治 吕梁 4.5 留言板设计 留言板的设计是为了用户留下宝贵的意见，来改善网站的不足之处。 临汾职业技术学院大专毕业设计 12 谢谢大家光临 您的名 字: 性别： 男 临汾职业技术学院大专毕业设计 13 女 保密 星座： 天蝎座 射手座 水瓶座 狮子座 巨歇座 双子座 现居地： 联系方 式: 给我留言: 临汾职业技术学院大专毕业设计 15 第五章第五章 总结和展望总结和展望 这次毕业设计给我带来的感触很多，在设计中碰到了很多疑难的问题，在樊老师的耐 心的教导下，把问题都迎刃而解，让我的设计美观、大方得体，樊老师在教学上治学严谨， 学识渊博，思想深邃，视野雄阔，对我的影响很大，我在做页面和代码的时候遇到了很大 的问题，还有论文的排版，以及论文怎么写，我一次一次的都不弄好，是在樊老师耐心的 指导，把我那些对于我来说很糊涂的问题，都一个一个的解决了，特别是论文开头、正文、 结尾给了我很大的启发，我一定要向樊老师虚心学习，让我在各个方面得到提高，在以后 的生活中也要像樊老师那样严格的要求自己以及工作中也要像樊老师积极向上，以樊老师 为荣，我以后会在工作中和生活中积极向上和严格要求自己，这样就会在工作中和生活中 得到很大的提高。 由于我自己的知识浅薄，网站存在很多的不足之处，我设计的网站不能和那些小企业 的网站和挂在网上的小型网站相提并论，我虽然做的是服装网站，也不能下载和在线购买， 我的网站只是起了个宣传的作用，只能是浏览完了，再去第四区上品女装那边下载和购买， 由于我自己知识的不足，所以只做了个宣传的网站。 我相信在我以后的生活和工作中，我会像樊老师那样在生活中和工作中都是那么认真 的、细心的做好每一件事情，我以后也要认真的、细心的去做每一件事情。这样会很快的 提高自己的能力。 临汾职业技术学