vistar化妆品网站设计论文

湖南交通职业技术学院毕业论文题目：vistar化妆品网站设计作者：学号：学院(系)：物流管理学院专业：电子商务指导者：评阅者：2013年月日 Vistar化妆品网站设计摘要:目前Internet已成为最具市场潜力的技术领域，使用Web技术设计的数据库应用软件，是目前Internet市场的技术中坚，各种Web应用如电子商务，在线讨论等都采用这种方式实现。互联网的优势在于用户能在不同时间、不同地点、不同数据库中存取数据。本网站的名称叫做“Vistar”，它是用Dreamweaver专门设计的ASP+ACCESS类型的个人网站,是一个化妆品商城。本文介绍了用Dreamweaver制作的个人网站，该网站通过微软平台，采用ASP技术、MicrosoftAccess数据库实现。文中重点介绍了MicrosoftAccess数据库与网页的连接与访问技术。关键词：asp；access；动态网站Abstract：Atpresent,Internethasbecomethemostmarketpotentialoftechnology,theuseofWebtechnologytodesignthedatabaseapplicationsoftware,isthepresentInternetmarkettechnicalbackbone,avarietyofWebapplicationssuchase-commerce,onlinediscussions,usingthismethodtorealize.TheadvantageofInternetisthatuserscanaccessthedatainthedifferenttime,differentlocation,differentdatabase.Nameofthesiteiscalled"Vistar",itistouseDreamweaverspeciallydesignedASP+ACCESStypewebsite,isacosmeticsstore.ThispaperintroducestheDreamweavermakinguseofpersonalwebsite,thesitethroughaMicrosoftplatform,usingASPtechnology,MicrosoftAccessdatabase.ThispaperfocusesontheconnectionandaccesstechnologyforMicrosoftAccessdatabaseandWebpage.Keyword：asp；access；Dynamicwebsite目录TOC\o"1-3"\h\u10405引言 引言网络发展到今天，建立网站已经成为一个很普遍的问题了，对于一个企业来说，建设好自己的网站可以抢占新世纪发展的战略要点。建立新的企业形象，直接开拓国际市场，开展24小时网上营销及高效廉价的定向宣传；与客户建立最直接的交流机制，缩短推出新产品和打开新市场的周期，与富有吸引力的客户群发展客户关系网；与自己的销售人员保持联系，进一步面向本地市场。对于个人来说，建设好时间的个性化网站可以更加方便的收集信息，开展更加直接的网络交流，使用自己构筑的友善平台，我们可以为自己毕业后找工作做好充分的准备，通过自己建设的网站，用人单位可以更好的去了解你，从而给自己增加了一份很重的砝码。在我的这个个人网站的制作过程中，我选择做化妆品网站，因为现在化妆品在女性的生活上占有很重要的位置。在整个网站的设计过程中，我广泛的听取同学的意见和建议，不断的改进和提高我的网站的内容和质量，这些都取得了比较好的效果。在整个网站的设计过程中，我根据自己以往的设计经验和自己找来的资料，又经过老师的指点，经过了近一个月的努力，几经易稿，最终做成了我的这个个人网站。1开发工具简介1.1ASP简介1.1.1ASP的背景所谓“静态”指的就是网站的网页内容“固定不变”，当用户浏览器通过互联网的HTTP（HypertextTransportProtocol）协议向WEB服务器请求提供网页内容时，服务器仅仅是将原已设计好的静态HTML文档传送给用户浏览器。“静态”网站的致命弱点就是不易维护，为了不断更新网页内容，必须不断地重复制作HTML文档，随着网站内容和信息量的日益扩增，难免会感到工作量大得出乎想象。1.1.2运行ASP所需的环境与一般的程序不同，.asp程序无须编译，ASP程序的控制部份，是使用VBScript、JSScript等脚本语言来设计的，当执行ASP程序时，脚本程序将一整套命令发送给脚本解释器(即脚本引擎)，由脚本解释器进行翻译并将其转换成服务器所能执行的命令。使用ASP还有个好处，就是在于ASP可通过ADO(ActiveDataObject)方便的访问数据库，从而使得开发基于WWW的应用系统成为可能。1.2Access2000简介该系统是在Windows98下开发的，后台数据库使用的是Access2000。Access2000以其简单易用的特点，逐渐成为办公领域流行的数据库软件。Access2000是微软公司开发的基于Windows平台的小型数据库管理系统，是Office2000的组件之一。它承袭了旧版本Access的各项优点,又新增和完善了数据访问页、个性化菜单、internet/intranet、编程、安全保密等功能。1.2.1数据库的概念数据库(DataBase)，顾名思义就是存放数据的仓库，是一些关于某个特定主题或目的的信息集合，用户可以将自己所需的各种资料以一定的格式存放在计算机的硬盘上，所有的这些信息的集合就是一个数据库。目前数据库技术已经广泛应用于各种管理信息系统，它是决策支持系统和专家系统的基础。数据库管理系统DBMS（DataBaseManagementSystem），它是允许用户对数据修改，并可以对数据库内的数据进行加工处理，生成各种报表的软件系统。Access2000数据库是一个典型的关系型数据库。然后使用查询，从一个或多个表中查找符合条件的数据；使用宏，自动完成事先定义好的一系列操作；通过嵌入模块，采用VisualBasic语言编写一段程序代码来实现一些复杂功能。1.2.2Access的特点自从1992年，Microsoft公司发布Access1.0以来，随着Windows的普及，使用Access的人越来越多，它逐渐成为流行的数据库软件之一。Access是一个面向对象的、采用事件驱动机制的小型关系数据库管理系统。在Access中，用户可以根据实际需要对数据进行分类，然后使用表对象分别存储每一种类型的数据，并建立起不同类型数据之间的关系，供报表使用。此时，每条信息仅在一处存放，减少了冗余数据的产生，节省了宝贵的存储空间，同时也加快了更新数据的速度。为了便于使用，Access的每个对象都为用户提供了设计器和生成向导。用户可以在设计器中设计生成对象，或对生成的对象进行编辑；用户也可通过生成向导方便快速的生成一个完备的对象。2IIS的安装与设置如果使用的系统是Windows2000Server,IIS是默认的安装选项，所以并不需要重新安装，但如果用户使用的系统是Windows2000Professional、WindowsXPProfessional或WindowsServer2003，IIS就并非默认安装选项了。2.1安装IIS1)通过选择[开始]\[控制面板]命令进入[控制面板]窗口，再选择[添加或删除程序]选项，进入[添加或删除程序]窗口后，选择[添加/删除Window组件]选项。2)在[组件]列表中，选中[Internet信息服务(IIS)]复选框，然后单击[下一步]按钮(若是WindwosServer2003，此处选择[ApplicationServer]选项，再单击[详细信息]按钮，即可看到[Inter信息服务（IIS）]选项)3)接着Windwos就会开始安装这些组件。用户将系统的原安装光盘放在光驱中，否则会出现如下图所示的[插入磁盘]对话框。如图2-1图2-14)这样就完成了IIS的添加。2.2设置IIS1)选择[开始]\[控制面版]命令进入[控制面版]窗口，选择[管理工具]选项。2)选择[Internet信息服务]选项进入管理界面。3)因为Internet的服务不只一种，选择[默认网站]选项，右击，在选择[属性]命令进入管理界面。如图2-2图2-24)在管理界面中有许多选项卡，先检查[网站]选项卡。在[IP地址]中目前显示的是[全部未分配]，如果用户没有固定的IP地址，建议不要修改这个选项，如此一来，管理员会以本地的默认IP地址（）为网站服务器的显示地址。如图2-3图2-35)选择[主目录]选项卡，在这里设置网站的实际磁盘路径。一般IIS所设置的默认位置是在<C:\inetpub\wwwroot>。所以完成的网页文件放在这个文件夹里，浏览器即可浏览到所放置的网页。在[应用程序设置]选项组中，设置用户所放置的应用程序（如ASP），不过，为了日后编辑方便，点击[配置]按钮，做一些必要的设置。如图2-4图2-46)选择[调试]选项卡，然后选中[启动ASP服务器脚本调试]及[启动ASP客户端脚本调试]两个复选框，如此一来，在程序出现错误时，就可以在浏览器上看到程序错误的原因，以及出错不能运行的行数，最后点击[确定]按钮完成设置。如图2-5如图2-57)最后设置[文档]选项卡，它的主要目的是设置浏览器打开网站时最先阅读的文件名称，在中间会出现许多文件名称，浏览器会由上往下查找和打开存在的文件名。如图2-6如图2-63ASP对数据库的操作个人网站是一种具有交互功能的信息系统。它向用户提供静态和动态两类信息资源。所谓静态信息是指那些不经常变动或更新的资源，动态信息是指随时变化的信息。个人网站系统具有强大的交互功能，可使管理员与用户方便地传递信息，完成电子信息交流。这种全新的交流方式实现了人个网站的使用者的文档信息的无纸化交流与展示。3.1网站管理系统的工作模式由于基于Internet的Web都是一种高度分散的并且与平台无关的网络，为了建立一个兼容的、全功能的销售商务网站管理系统，采用B/S结构是非常合适的。这种结构一般包括3个基本的组件：Browser、Server和Internet。Browser通过Internet向Server发出请求，Server对Client的请求做出响应和控制，通过Internet将响应反馈给Browser。这是一种协作式的模型，可完成分布式任务。Server负责对数据进行存储和维护，其共享资源主要包括应用程序、网络访问以及一些数据和文件。3.2个人网管理系统的构建一个完善的个人网站必须具有发布信息、接收信息、管理信息、信息共享等基本功能。这些功能主要由ASP技术和网络数据库访问技术来实现。首先，是风格定位问题。个人网站风格各异，从人文艺术到休闲娱乐、专业学习、生活资讯等等。即便真去逛百货大楼，也去真正能提供实用信息的地方，象yahoo、sohoo等等。所以，风格不明、没有特色成了诸多个人网站的一个通病。3.3安全性问题服务器的安全特性是相当重要的，它不仅可以预防未授权用户对网络的访问，同时保护Web站点的内容不受侵犯。典型的安全特性包括访问控制和加密。通过用户身份确认，允许合法用户进入网站，防止非法用户的访问。对用户密码采用MD5不可逆加密技术，保证网站的安全。4数据库的连接与访问ASP应用程序必须通过ADO(ActiveXDataObjects,ActiveX数据对象)组件来调用OLEDB(ObjectlinkingandembeddingDataBase,对象链接与嵌入数据库)接口或者ODBC(OpenDataBaseConnectivity，开放数据库连接，一种数据库应用程序间的接口)来访问不同的数据库来源，因为开发OLEDB与ODBC的技术相当复杂而困难，所以，微软开发了ADO组件，让程序开发人员可以避开底层数据访问的具体问题，将心思放在程序开发上即可。如图6-1ASPASP网页应用程序ADO组件各式数据库OLEDB接口OLEDBODBC提供者OLEDB其他数据提供者ODBC驱动图4-1由上图可知，ASP的网页应用程序只要使用ADO组件，既能与OLEDB接口沟通，再借助于ODBC或其他厂商提供的驱动程序，与各式各样的数据库连接，并取得数据。ADO组件是微软所开发的数据库对象访问接口，使用十分方便，程序开发人员只要在使用到数据库时遵循下列步骤，即可顺利获得数据库中的数据。4.1建立连接（Connection）对象来设置数据来源ASP有两种方式可以与数据库取得连接。1)DSN(DataSourceName)：利用系统中的ODBC管理器来设置数据来源名称，就能连接到需要的数据库。虽然DSN的连接方式十分简单，但是，在实际用途上，却有它的困难之处，因为如果用户所有的网页空间不是自己的主机，或者是用户没有主机服务器管理权限，是无法到主机上去设置DSN的。为了解决这个困难，可以使用另外一种数据库连接方式：DSN_less。2)DSN_less：设置访问的字符串与设置驱动程序，直接通过ODBC连接到数据库。下面我来介绍这两种方法：①从[开始]\[控制面板]\[管理工具]\[数据源（ODBC）]进入管理界面。如图6-2图6-2②打开[系统DSN]选项卡，然后点击[添加]按钮。③进入[创建新数据源]对话框，在这里会看到本地服务器上安装的ODBC驱动程序，选择[MicrosoftAccessDriver(*.mdb)]选项，点击[完成]按钮。如图6-3图6-3④接着会进入[ODBCMicrosoftAccess安装]对话框，下面将在这里设置数据库文件的所在文件夹，在[数据源名]文本框中输入数据库的识别名称：connClass,在[说明]文本框中输入基本说明：数据库连接，单击[选项]按钮设置数据库的来源。如图6-4图6-4⑤最后单击[完成]按钮，回车到上一层界面时再两次单击[确定]按钮来完成ODBC数据源的设置。如图6-5图7-5图6-5⑥设置完DSN之后，回到DreamweaverMX2004进入站点定义，选择已定义的ASP站点（站点定义从略），添加一个ASP文件，这里就用<showdata.asp>文件，打开此文件，选择[窗口]\[数据库]命令进入[应用程序]面板组的[数据库]面板。单击[+]\[数据源名称（DSN）]命令进入设置对话框。操作如图所示6-63.选择[使用本地DSN]4.3.选择[使用本地DSN]4.点击[确定]2.选择数据源1.输入连接名称图6-6以上就是本地DSN的数据库连接步骤。下面再来介绍设置DSN_less的数据库连接。在DreamweaverMX2004进入站点定义，选择已定义的ASP站点（站点定义从略），添加一个ASP文件，这里就用<showdata.asp>文件，打开此文件，选择[窗口]\[数据库]命令进入[应用程序]面板组的[数据库]面板。单击[+]\[自定义连接字符串]命令进入设置对话框。如图6-7图6-7界面中出现[自定义连接字符串]对话框，先在[连接名称]文本框中输入连接名称，这里就输入DSNLess即可。最重要的是设置[连接字符串]，可以使用字符串的设置直接通过ADO的帮助来访问数据库，标准格式如下:※MicrosoftAccess数据库联机字符串格式(实体路径)Driver={MicrosoftAccessDriver(*.mdb)};DBQ=实际路径\数据库名称Provider=Microsoft.Jet.OLEDB.4.0;DataSource=实际路径\数据库名称※MicrosoftAccess数据库联机字符串格式(虚拟目录)"Driver={MicrosoftAccessDriver(*.mdb)};DBQ="&Server.MapPath("数据库名称")"Provider=Microsoft.Jet.OLEDB.4.0;DataSource="&Server.MapPath("数据库名称")以上的两种访问方式都可以在DreamweaverMX2004中连接到数据库。最后单击[使用此计算机上的驱动程序]单选按钮，点击测试，出现连接成功的对话框时，即可通过单击[确定]按钮回到原对话框，再单击[确定]按钮即可完成设置。4.2建立记录集(Recordset)对象并进行相关的记录操作1)切换到[应用程序\邦定]面板，然后单击[+]\[记录集（查询）]命令。2)在[记录集]对话框中，有许多设置项，可以在[名称]文本框中为了这个记录集命名，在这里用默认值Recordset1。在[连接]下拉列表框中选择连接名称，这里选择第一个连接名称connDSNLess。3)这时会看到DreamweaverMX2004已经成功地连接设置的数据表，并将数据表中的字段全部显示在[列]列表中，点击[全部]或[选定的]（这里就不在细分了）单选按钮即表示要使用该数据表中所有的字段。在对框的下面还有两个选项：[筛选]、[排序]（从略）。如图6-8图6-8单击[测试]按钮来测试连接的结果，此时会出现一个[测试SQL命令]对话框，对话框中显示了数据库中所有的数据，单击[确定]按钮回到先前的对话框，最后单击[确定]按钮结束设置。4.3关闭数据库连接并清除所有对象应用程序喜欢使用电脑中的资源，而不去考虑他们所使用的资源是否是数据库连接或者是内存中如同堆栈或数组一样的数据。当有必要的时候可以使用这些资源，但是要尽可能快的释放他们。5个人网站总体设计5.1网站的分析与设计

5.1.1

网站栏目设计

我的网站包括首页、聚美商城、护肤方案、了解Vistar、Vistar排行榜、美颜贴士六个导航。首页：用户和管理员通过这一页面对网站进行操作。第一次访问我的个人网站的用户也可以通过一页面进行注册用户。聚美商城：这里有六个系列产品。护肤方案：这页普及化妆的步骤及常识、适用系列产品。了解Vistar：这一页面就是站长对于自己的介绍。Vistar排行榜：这页是热销化妆品排行榜。美颜贴士：分为男士和女士两个系列化妆品。栏目设计如下图5-1：图5-15.1.2

网站页面的设计

我制做我的个人网站采用了动、静相结合。所有的页面采用了ASP与Acceess数据库相相合的，采用交互式的动态的web画面来实现。本网站采用了flash与图片结合的方法（flash的参数设置为参数：wmode,值：transparent），使网站的页更有清新的效果。网站的整体布局，链接，等都在Dreamweaver中制作；图片的优化用photoshop制作。

5.2

数据库的设计

我的个人网站采用的数据库是Access，有一个数据库文件名为eshop.mdb，eshop.mdb包括catwgory、pinpai、products、subcateg、users五个表。users表文件为用户登录与注册，products为产品主表，其他三个位子表。Products表设计如下图5-2：图5-2三个子表如下图5-3所示：图5-3注册登录zcuers表如图5-4：图5-4页面数据库链接代码如下：<!--#includefile="Connections/conn.asp"-->5.3网站的各项功能设计与实现5.3.1主页的登录功能登录注册有利于网站管理，主页登录、注册需链接zcusers表,网站一旦有顾客注册信息，顾客所填信息会生成到zcusers表中，需选择服务器行为添加登录用户，如下图5-5：图5-5如果用户未输入用户名与密码不符合会跳转到登录失败页面，登录成功会跳转到登录成功页面。登录页面功能如图5-6：图5-65.3.2主页用户注册注册信息包括用户名、密码、邮箱、电话四项内容，其中前三项为必填项。注册页面添加服务器行为，填写如下信息如图5-7：图5-7注册功能如图5-8图5-85.3.3首页显示访客位数功能如图5-9图5-9代码如下：<fontcolor="#00FF00"><strong><%dimnapplication.lockapplication("n")=application("n")+1application.unlock%>好！您是本页的第<%=application("n")%>位访客</strong></font>5.3.4页面商品展示功能商品展示主要使用户在购买商品时能够了解商品的相关信息，引起用户的注意与购买欲望。添加服务器行为，选择记录集，并进行筛选，如下图5-10：图5-10页面商品展示图5-11：图5-115.4页面SEO优化搜索引擎优化是一种利用搜索引擎的搜索规则来提高目的网站在有关搜索引擎内的排名的方式。站内SEO优化包括：站内的链接结构、TITLE的重新定位、keywords的重新定位、description的重新定位、关键字选取、网站结构调整、资源应用。这些都是提高访问量和知名度很重要的因素。以首页优化关键词与描述为例，代码如下：<metaname="keywords"content="Vistar化妆品网站，护肤品，化妆品，洁丽雅化妆品，洁面奶"/><metaname="description"content="vistar化妆品网上购物商城,以销售化妆品、护肤品、香水、彩妆、精油、男士护肤等时尚化妆品为主的网络购物平台。正品行货，诚信服务，为您提供愉悦的网上商城购物体验!"/>站外SEO，也可以说是脱离站点的搜索引擎技术，命名源自外部站点对网站在搜索引擎排名的影响，这些外部的因素是超出网站的控制的。最有用功能最强大的外部站点因素就是反向链接，即我们所说的外部链接。毫无疑问，外部链接对于一个站点被收录进搜索引擎结果页面起到了重要作用。5.5主要页面展示首页是整个网站最关键的页面，只有首页吸引用户，才有成交的可能性。如下图5-12：图5-12二级栏目页面图5-13：图5-13商品详情页图5-14：图5-14总结ASP从推出至今时间也不算漫长，由于它具有开发简单，功能强和灵活等优点，现在已被广泛接受，成为开发动态网络站点的主要技术之一，有人声称ASP已在Web开发领域悄悄地进行着一场革命。今天已有上万个Web站点使用了ASP技术，其中包括许多Internet中最大的站点。有人估计，在过去几年中，ASP开发人员已达百万之多，预计在今后的发展过程当中将会越来越多。ASP正慢慢成为动态Web应用程序开发环境的主流。基于Web的现代远程教育是一种新型的教育方式，随着现代信息技术的发展，它将越来越受到人们的关注并逐步取代传统教育。21世纪，它将成为构筑终身学习体系的主要手段。而基于Web的动态交互式网站信息发布系统则是现代网络教育不可缺少的一部份。本文设计的是一种基于ASP的化妆品网站商城，该网站包括首页、聚美商城、护肤方案、了解Vistar、Vistar排行榜、美颜贴士六个一级栏目，对于卖场来说我的网站还不够成熟。利用ASP技术实现信息发布是一项很有效的方法，这种组建的方式，可以应用于网站的其它栏目；又由于ASP编程所用的VBScript与JavaScript语