11110032赵彩丽悠悠乐购网网站设计说明书.doc

网站设计说明书 前 言 首先，服装行业是一个年产值超万亿级别的产业，同时，人民生活水平的提高也会提升对高质量服装的需求，其增长速度远高于国民经济的增长速度，有着巨大的发展潜力和前景。其次，互联网络正在不断改变着人们的生活方式和生产方式，同样也在改变着服装业传统的生产方式和服务方式，服装企业只有适时而变，才能免遭淘汰。基于互联网的网络营销是一种划时代的营销方式，是传统企业融入知识经济的管理工具和思维方法，对此服装企业应该有充分的认识。为了适应网络的趋势，传统企业必须重新考虑并发挥自己的商业潜力，必须对商业系统作出融入商务网络的新的安排，必须以网络营销为武器，使产出（产品和服务）能让顾客满意，从而获得竞争优势。最后，既然服饰行业属于紧跟时代步伐，流行影响力很大的行业，迫切需要接受最新反馈信息，并将企业信息发布出去。而且时装消费者主要是面向中高收入年轻人为主的群体，他们大部分都已经成为互联网的忠实用户。所以服装企业上网已经成为企业发展的必经之路了。同时也是普通网友进行创业的好选择。工程概况一、网站定义： 本网站是一个衣饰宣传销售网站。是以销售衣服、裤子、鞋子、其他（有各种饰品，帽子、手套、袜子等等）的小型电子商务网站二、网站总体模块结构1、 主页：主页、衣服、裤子、鞋子、其他（有各种饰品，帽子、手套、袜子等等）动静态页面链接、留言板，会员注册，管理员登录，图品链接几个主要部分组成。内容：悠悠乐购网网站要提供相关会员注册、衣服裤子、鞋子、其他（有各种饰品，帽子、手套、袜子等等）的商品服务信息、建立整套购物车体系，相关留言管理，相关帮助，和绝对的信息保密措施，非管理者不得知。2、 衣服：网站里各种不同风格和颜色的衣服介绍和管理，图文并茂。3、 裤子：网站里各种风格和颜色的裤子介绍和管理，图文并茂。4、 鞋子：网站里各种风格和颜色的鞋子介绍和管理，图文并茂。5、 其他：网站里各种风格款式和颜色的首饰，衣饰介绍和管理，绚丽多彩。6、 留言板:给予消费者发表建议的空间，了解网站的平台。7、 管理员登陆：时时刻刻管理网站，给予大家最好的消费平台，不断更新产品。8、 会员注册：让消费者轻松注册，更给大家优惠连连。9、 精品图片链接，最新服饰闪亮出现。三、网站简要说明 悠悠乐购网是一个以在线销售服装为主的网站，在线销售范围包括各个风格的服装，以及各种的首饰、鞋、等等，而且还提供一定的个性化服务，是一个较全面的衣饰消费网站。四、网站运行环境基本要求1、系统运行环境(全部为中文环境) 项 目 详细操作系统 Windows XP / Windows 2003网页制作使用： flash 8、Dreamweaver 8、Firworks 8 文字编辑使用： Microsoft office 2003图象编辑使用：Firworks 8论坛编辑使用： ASP 数据库创建： Microsoft Access 20032、HTML：HTML（HyperTextMark-upLanguage）即超文本标记语言，是www的描述言html是在 sgml 定义下的一个描述性语言，或可说 html 是 sgml 的一个应用程式，html 不是程式语言，它只是标示语言。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字、图形、动画、声音、表格、链接等。HTML的结构包括头部（Head）、主体（Body）两大部分，其中头部描述浏览器所需的信息，而主体则包含所要说明的具体内容。3、JavaScript:JavaScript是客户端脚本语言，也就是说JavaScript是在用户的浏览器上运行，不需要服务器的支持而可以独立运行。所以在早期程序员比较青睐于JavaScript以减少对服务器的负担，而与此同时也带来另一个问题：安全性。而随着服务器的强壮，虽然现在的程序员更喜欢运行于服务端的脚本以保证安全，但JavaScript仍然以其跨平台、容易上手等优势大行其道。JavaScript是一种脚本语言，其源代码在发往客户端运行之前不需经过编译，而是将文本格式的字符代码发送给浏览器由浏览器解释运行。解释语言的弱点是安全性较差，而且在JavaScript中，如果一条运行不了，那么下面的语言也无法运行。而且由于每次重新加载都会重新解译，加载后，有些代码会延迟至运行时才解译，甚至会多次解译，所以速度较慢。 与其相对应的是编译语言，例如Java。Java的源代码在传递到客户端运行之前，必须经过编译，因而客户端上必须具有相应平台上的仿真器或解释器，它可以通过编译器或解释器实现独立于某个特定的平台编译代码的束缚。但是它必须在服务器端进行编译，这样就拖延了时间。但因为已经封装，所以能保证安全性。4、 ASP：ASP是Active Server Page的缩写，意为“动态服务器页面”。ASP是微软公司开发的代替CGI脚本程序的一种应用,它可以与数据库和其它程序进行交互，是一种简单、方便的编程工具。ASP是一种服务器端脚本编写环境，可以用来创建和运行动态网页或Web应用程序。ASP网页可以包含HTML标记、普通文本、脚本命令以及COM组件等。利用ASP可以向网页中添加交互式内容（如在线表单），也可以创建使用HTML网页作为用户界面的web应用程序。五、网站设计（详细）1、首页设计：网站logo上有网站名称，五个标题栏分别是：首页、衣服、裤子、鞋子、其他（有各种饰品，帽子、手套、袜子等等），与之链接相关动态页面。设有管理员登录，会员注册，留言，购物车添加。网站设有有衣服、裤子、鞋子、其他的静态链接，绚丽的图案也有相关链接，网站底部也有网站的相关联系方式和有关文案。利用flash增加视觉效果。2、引导页：除了与首页相同的设置外，添加网站相关产品的动态广告，搭建幽默的鼠标效果，更有最新动态更新，让你对网站一目了然，动静态结合，吸引你的眼球。3、衣服、裤子、鞋子、其他（有各种饰品，帽子、手套、袜子等等）的产品详细列表，各自的商品管理页面，添加购物车。4、代码设计：流动信息代码: 内容 广告代码：  var speed3=25;/速度数值越大速度越慢demo2.innerHTML=demo1.innerHTMLfunction Marquee()if(demo2.offsetWidth-demo.scrollLeft=0)demo.scrollLeft-=demo1.offsetWidth;elsedemo.scrollLeft+;var MyMar=setInterval(Marquee,speed3);demo.onmouseover=function() clearInterval(MyMar)demo.onmouseout=function() MyMar=setInterval(Marquee,speed3) 六、软件知识五、 Dreamweaver 8概述1、Dreamweaver 8是Macromedia公司继DERAMWEAVER4之后开发出的新一代所见即所得网页编辑器的功能更为强大,界面更为友好,同时集网页制作和动态网站管理于一身.DREAMVMX的安装步骤如下：(1) 在光盘中插入DREAMWEAVER的安装光盘,运行安装文件,出现准备启动安装向导的界面.安装向导准备完毕或,就会出现准备安装界面.进度条完成后,会弹出一个欢迎安装的界面.(2) 在欢迎安装的界面中,单击NEXT按钮,弹出询问是否接受协议的对话框,单击按钮接受协议;单击BACK按钮回到上一步;单击NO按钮则退出安装程序.(3) 单击YES按钮后,为验证软件使用者的合法性,DREAMWEAVERMX将要求输入软件使用者的姓名(FIRST AND LAST NEME),单位(ORGANIZATION)和序列号(SERIALNUMBER),使用者姓名和序列号必须输入,否则安装程序无法继续.输入完成后,单击下一步按钮.(4) 单击下一步按钮后,选择按准感路径的对话框.默认的安装路径为D:PROGRAMFILESMACROMEDIADREAMWEAVERMX. DREAMWEAVER会在选择目录下信件DREAMWEAVERMX目录.选择完后单击确定按钮,返回上一对话框.对话框中单击NEXT按钮.(5) 单击NEXT按钮,出现复制文件的对话框,其中说明了要安装的路径等用户所提供的信息.安装结束后会弹出一个对话框,提示安装已经完成,单击FINISH按钮,即可结束安装.(6) 单击FINISH按钮之后,将显示DERAMWEAVERMX所在的文件夹窗口,并启动浏览器显示DERAWEAVER-RESOURCES页面.至此,就顺利完成了DERAMWEAVERMX安装.DREAMWEAVERMX的功能非常强大，利用它可以轻松地创建出理想的网页。利用它还可以检查作品在所有的平台和浏览器中可能发生的错DRAMWEAVER使用：网页中的图像和链接，表格操作，版面设计，框架，表单操作，模板等等。2、Dreamweaver使用方面1）如何添加图片及链接文字的提示信息？ 在我们浏览网页时，当鼠标停留在图片对象或链接上时，在鼠标的右下有时会出现一个提示信息框。对目标进行一定的注释说明。在一些场合，它的作用是很重要的。 下面先看看图片提示信息的添加，选中图片对象，在属性面板里你会发现有个“Alt”输入框。默认情况下，该输入框是空白的。在这里录入需要的提示内容就可以了。 那么链接提示的制作就没这么简单了。因为DW中没有直接提供该功能，因此我们需要通过添加HTML代码来实现。 在中添加“Title”属性。Title=提示内容即可。2）怎样才能够保证网页中文字不跟随浏览器字体大小设置而变动? 大家都知道,在IE浏览器的功能设置中，有一个可以自由设置窗口内容字体大小的功能，这样由于不同访问者的习惯问题，呈现在他们面前的网页有时也会不同。 比如你可能本来设计时用的是2号字体，结果由于用户对浏览器的额外设定，变的更大了，这时显示效果上就出问题了。那么解决的办法就是将网页内容定性的强制在某个合适的大小上。即不容许他变化。通过CSS样式表对字体进行强制性控制就可以实现这个要求了。3）在DW中，如何输入一个空格呢？ 输入空格的问题，在DW似乎已成了一个老生常谈的问题，我们可能在许多介绍DW使用方面的书籍或文章中看到过N次。 DW中对空格输入的限制是针对“半角”文字状态而言的，因此通过将输入法调整到全角模式就可以避免了，方法是：打开中文输入法（以人工智能ABC为例），按Shift+Space切换到全角状态，现在应该没问题了。此外，你还可以通过许多“变通”的方法达到录入空格的目的，比如常用的是： 直接在源代码中加入代表空格的HTML代码“ ”；输入一定长度的文字对象后，然后调整文字的颜色与当前的背景颜色相同等等，不过注意的是后者在一些浏览器中可能显示上有点问题。4）空链接处理 空链接也就是，没有链接对象的链接，在空链接中，目标URL是用“#”来表示的。也就是说制作链接时，只要在属性板的LINK输入框中录入#标记，它就是个空链接了。空链接的出现涉及到多方面的因素，比如一些没有定期完成的页面，又为了保持页面显示上的一致（链接样式与普通文字样式的不同），就可以使用它了。在浏览器里，当我们点击空链接时，它会自动将当前页面重置到首端，从而影响用户正常的阅读内容，我们当然希望它能保持不动了。这时，你能够用代码“javascript:void(null)”代替原来的“#”标记，回头看看，这个问题已经解决了。5）背景图片和背景音乐的处理背景图片是很多网页设计者经常添加的东西，当网页内容超出一屏时，拉动滚动条背景图片会与内容相对静止的一起滚动，那么能否锁定背景不跟随滚动呢？当然可以进入“Edit style sheet”窗口，单击“New”确立新样式，在TYpe中选择“Redefine HTML Tag”，同时Tag选单选中“Body”，在左边列表中选择“Background”。背景音乐：在微软的网页工具-Frontpage中，有关于背景音乐的设置功能，那么DW显然没有作到这点，因此要使用的话，只能在源代码中手动添加了。 在使用前，提醒大家一点，使用背景音乐一定要注意网页文件的大小，不能顾此失彼。代码如下：其中src指定音乐文件的位置，autostart为音乐文件上传后的动作，true表示自动开始播放，false不播放（默认值）。总结学习是永无止境的，通过本次悠悠乐购网的建设，我已经熟悉了建设网站的各个软件，链接网站建设的重点主要是网站素材的选择与框架的搭建，一个好的网站要有许多的主页相互之间链接起来，以及其中添加一些动态、图片、声效等链接。这时，就要熟悉的运用PHOTOSHOP等图片处理软件，综合地完成网站的建设才能体现主题，才能把浏览者的目光吸引到每一个页面上，内容的及时更新也是网站建设的一个主要实际问题，只有不断得到更新的页面内容才能使浏览者再次访问该网站，没有新鲜的内容素材，没有时代性的哲学理念，远不能称得为好网站。 新颖的框架结构也能使浏览者的目光更长久地被吸引，在拥有好的素材基础上，框架的设计与搭建也是网站建设过程中所必须考虑到的问题， 只有把这两者相结合进行周密地布置，相信建设出来的网站必然是点击率最高的网站。 该个人网站的建设中也牵涉到了动态网页的制作，因此，这必然成了建站过程中的难点，就我个人而言，对动态网页的制作方面还缺少很多的理论与实际操作知识，曾经只是做一些简单的个人主页，仅此而已，而现今，却得必须运用ASP（Active Server Page）程序,中文全称为“动态服务器页面”，它可以实现突破静态网页的一些功