电子商务网站设计及其开发课件

演示文档演示文档演示文档演示文档路漫漫其悠远路漫漫其悠远少壮不努力，老大徒悲伤少壮不努力，老大徒悲伤电子商务网站设计及其开发3.1 网页设计工具介绍网页设计工具介绍3.2 电子商务网站设计与制作电子商务网站设计与制作3.3 网网 页页 发发 布布3.4 网页的更新网页的更新 3.1 网页设计工具介绍网页设计工具介绍n3.1.1 FrontPage 2002和和 Dreamweaver MX/2004n1HTML和和FrontPage 2002简介简介nMicrosoft FrontPage 2002的功能主要包括以下几个方面。的功能主要包括以下几个方面。n（1）站点管理工具）站点管理工具n（2）编辑）编辑HTMLn（3）发布网页）发布网页n（4）数据库集成）数据库集成n FrontPage 2002在在数数据据库库上上集集成成了了很很多多优优秀的功能，典型的包括如下几个。秀的功能，典型的包括如下几个。n 数据库结果向导数据库结果向导n 访问数据网页访问数据网页n 简易的数据库发布简易的数据库发布n 编辑编辑HTML、DHTML、脚本、脚本、ASP和和XMLn（5）扩充性和可程序化）扩充性和可程序化nFrontPage 2002在在程程序序设设计计和和扩扩充充上上的的功功能能包包括以下括以下2个。个。n Microsoft脚本编辑器脚本编辑器n Visual Basic for Applicationsn2Dreamweaver MX/2004n（1）最佳的制作效率）最佳的制作效率n（2）网站管理）网站管理n（3）无可比拟的控制能力）无可比拟的控制能力n（4）所见即所得）所见即所得n（5）梦幻样板和）梦幻样板和XMLn（6）全方位呈现）全方位呈现n（7）支持动态网页）支持动态网页3.1.2 CGI和和ASPn 随随着着Web技技术术的的不不断断发发展展，Web页页面面上上开开始始加加入入了了动动态态和和交交互互式式的的内内容容，并并取取得得了了成成功功。Web动动态态技技术术发发展展快快，种种类类多多，其其中中包包括括脚脚本本语语言言、CGI、ISAPI、ASP、ActiveX、Java Applet等。等。n1脚本语言脚本语言n 脚本语言（脚本语言（Script Language）是一种简单的描述）是一种简单的描述性语言，它的语法结构与计算机上的高级语言颇为相性语言，它的语法结构与计算机上的高级语言颇为相似，所以相对于其他的似，所以相对于其他的Web技术来说是简单易用的。技术来说是简单易用的。n2CGI通用网关接口编程通用网关接口编程nCGI的缺点有如下几个。的缺点有如下几个。n 开发开发CGI需要比较复杂的语言，学习不易。需要比较复杂的语言，学习不易。n 与与HTML文件毫无关系，集成困难。文件毫无关系，集成困难。n 程序开发时间长，并且排错困难。程序开发时间长，并且排错困难。n 维护困难。维护困难。n 执行效率低。执行效率低。n3ASP技术技术n ASP是是动动态态服服务务器器页页面面（Active Server Pages）的的简简称称。ASP为为用用户户提提供供了了一一种种真真正正的的简便易学、功能强大的服务器编程技术。简便易学、功能强大的服务器编程技术。n ASP其实是微软开发的一套服务器端脚本其实是微软开发的一套服务器端脚本运行环境，通过运行环境，通过ASP用户可以建立动态的、交用户可以建立动态的、交互的、高效的互的、高效的Web服务器应用程序。服务器应用程序。n（1）ASP的特点的特点n（2）ASP基础知识基础知识n ASP文件制作文件制作n ASP语法语法n ASP内建对象内建对象n 服务器组件服务器组件n 使用变量和常量使用变量和常量n 使用集合使用集合n3.1.3 ASP 应用程序举例应用程序举例n1订购水果的订购水果的ASP程序程序n2搜索引擎程序搜索引擎程序n3留言簿程序留言簿程序3.2 电子商务网站设计与制作电子商务网站设计与制作n3.2.1 电子商务网站内容设计的流程电子商务网站内容设计的流程n 要要将将企企业业网网站站作作为为在在Internet上上展展示示企企业业形形象象、企企业业文文化化，进进行行电电子子商商务务活活动动的的信信息息空空间间，除除了了要要进进行行网网站站的的总总体体策策划划，确确定定网网站站的的目目标标和和定定位位等等，还还要要进进行行电电子子商商务务网网站站的的内内容容设计与制作，这是网站开发的重点。设计与制作，这是网站开发的重点。n1网站内容设计的原则网站内容设计的原则n（1）新、精、专的信息内容）新、精、专的信息内容n 信息内容永远处于第一位信息内容永远处于第一位n 内容设计要有组织内容设计要有组织n 及时更新信息内容及时更新信息内容n（2）安全快速的访问）安全快速的访问n 提高浏览者的访问速度提高浏览者的访问速度n在在确确定定内内容容的的基基础础上上，尽尽量量提提高高速速度度十十分分必必要要，速速度度太太慢慢，浏浏览览者者也也会会失失去去耐耐心心，从从而而影影响响企企业网站的访问量。业网站的访问量。n 要有安全良好运转的硬件和软件环境要有安全良好运转的硬件和软件环境n 要使信息便于用户浏览要使信息便于用户浏览n（3）美感十足、方便用户访问的页面）美感十足、方便用户访问的页面n 提供交互性提供交互性n 完善的检索和帮助功能完善的检索和帮助功能n 方便用户访问和购买方便用户访问和购买n2网站内容设计流程网站内容设计流程n 电电子子商商务务网网站站的的内内容容设设计计流流程程一一般般要要经经过过如如下下步步骤骤：首首先先在在网网站站总总体体规规划划阶阶段段所所确确定定的的信信息息需需求求和和网网站站功功能能的的基基础础上上，收收集集与与网网站站内内容容主主题题相相关关的的关关键键信信息息；再再利利用用一一个个逻逻辑辑结结构构有有序序地地将将这这些些信信息息组组织织起起来来，确确定定其其信信息息结结构构，并并开开发发出出一一个个网网站站内内容容设设计计的的基基本本模模型型；选选择择本本企企业业一一些些有有代代表表性性的的用用户户进进行行测测试试，根根据据他他们们提提出出的的意意见见，再再逐逐步步完完善善这这个个模模型型，最最终终形形成成正式的企业网站的内容模块。正式的企业网站的内容模块。n（1）收集与该网站有关的一些关键信息）收集与该网站有关的一些关键信息n（2）网站信息结构的设计）网站信息结构的设计n（3）网站运行环境的选择）网站运行环境的选择n（4）进行网页可视化设计）进行网页可视化设计n（5）网页制作）网页制作n（6）网站测试）网站测试n（7）网站发布）网站发布3.2.2 网站信息结构的设计网站信息结构的设计n1网站信息内容及其功能模块网站信息内容及其功能模块n（1）公司概况）公司概况n（2）员工信息）员工信息n（3）产品目录）产品目录n（4）产品价格表）产品价格表n（5）产品搜索）产品搜索n（6）公司动态）公司动态n（7）网上订购）网上订购n（8）销售网络）销售网络n（9）售后服务）售后服务n（10）技术支持信息）技术支持信息n（11）联系信息）联系信息n（12）财务报告）财务报告n（13）辅助信息）辅助信息n（14）其他内容信息）其他内容信息n（15）增值服务）增值服务n2网站链接结构的设计网站链接结构的设计n 电电子子商商务务网网站站往往往往是是一一个个大大型型的的复复杂杂的的综综合合网网站站，为为了了实实现现信信息息的的有有效效传传递递，也也为为了了方方便便用用户户以以最最少少的的时时间间浏浏览览网网站站获获得得所所需需信信息息，网网站站开开发发人人员员应应在在网网站站信信息息结结构构设设计计的的同同时时，规规划划并并设设计计好好主主次次分分明明、结结构构清晰的网站链接结构，使浏览者对网站内容一目了然。清晰的网站链接结构，使浏览者对网站内容一目了然。n一般地，建立网站的链接结构有如下两种基本方式。一般地，建立网站的链接结构有如下两种基本方式。n（1）树状链接结构（一对一）树状链接结构（一对一）n（2）网状链接结构（一对多）网状链接结构（一对多）n3网站整体风格的设计网站整体风格的设计n体现网站风格的常用方法有如下几个。体现网站风格的常用方法有如下几个。n（1）使企业的标志尽可能出现在每个页面上）使企业的标志尽可能出现在每个页面上n（2）突出网站的标准色彩）突出网站的标准色彩n（3）突出网站的标准字体）突出网站的标准字体n（4）设计一条朗朗上口宣传标语）设计一条朗朗上口宣传标语n（5）使用统一的图片处理效果）使用统一的图片处理效果n（6）创造一个企业网站特有的符号或图标）创造一个企业网站特有的符号或图标3.2.3 网页的可视化设计网页的可视化设计n1网页设计应遵循的原则网页设计应遵循的原则n（1）网页命名要简洁）网页命名要简洁n（2）确保页面的导航性好）确保页面的导航性好n（3）网页要易读）网页要易读n（4）合理设计视觉效果）合理设计视觉效果n（5）为图片添加文字说明）为图片添加文字说明n（6）不宜使用太多的动画和静态图片）不宜使用太多的动画和静态图片n（7）页面长度要适中）页面长度要适中n 一一个个长长的的页页面面的的传传输输时时间间要要比比较较短短的的页页面面的的传传输输时时间间长长，太太长长的的页页面面传传输输会会使使用用户户在在等等待中失去耐心。待中失去耐心。n（8）Java程序少用为宜程序少用为宜n（9）整个页面风格要一致）整个页面风格要一致n（10）尽量使用相对超级链接）尽量使用相对超级链接n（11）不要滥用尖端技术）不要滥用尖端技术n2网页版面布局设计网页版面布局设计n（1）网页版面布局步骤）网页版面布局步骤n 创建初始方案创建初始方案n 初步设计网页的布局初步设计网页的布局n 定案定案n（2）常见的版面布局形式）常见的版面布局形式n“T”结构布局结构布局n“口口”型布局型布局n“三三”型布局型布局n 对称对比布局对称对比布局n POP布局布局n（3）页面版面布局原则与技巧）页面版面布局原则与技巧n 下下面面是是在在进进行行网网页页版版面面布布局局设设计计时时要要遵遵循循的的一一些些原则，供读者参考。原则，供读者参考。n 正常平衡正常平衡n 异常平衡异常平衡n 对比对比n 凝视凝视n 空白空白n 尽量用图片解说尽量用图片解说n3网页色彩设计网页色彩设计n（1）网页色彩搭配的原理）网页色彩搭配的原理n 色彩的鲜明性色彩的鲜明性n网页的色彩要鲜艳，容易引人注目。网页的色彩要鲜艳，容易引人注目。n 色彩的独特性色彩的独特性n 色彩的合适性色彩的合适性n 色彩的联想性色彩的联想性n（2）网页色彩搭配的技巧）网页色彩搭配的技巧n 相同色系色彩相同色系色彩n 运用对比色或互补色运用对比色或互补色n 使用过渡色使用过渡色n 用黑色和一种彩色用黑色和一种彩色n 不不要要将将所所有有颜颜色色都都用用到到，尽尽量量控控制制在在三三种种色色彩彩以以内内，并且在其中选择一种作为主色调。并且在其中选择一种作为主色调。n 背背景景和和文文字字的的对对比比尽尽量量要要大大，要要有有足足够够的的对对比比度度来来保保证证页页面面易易于于阅阅读读，绝绝对对不不要要用用花花纹纹繁繁复的图案作背景，以便突出主要的文字内容。复的图案作背景，以便突出主要的文字内容。n 由由于于国国家家和和种种族族、宗宗教教和和信信仰仰不不同同，以以及及生生活活的的地地理理位位置置、文文化化修修养养的的差差异异等等，不不同同的的人人群对色彩的好恶程度有着很大的差异。群对色彩的好恶程度有着很大的差异。n4网页中图片和文字的设计网页中图片和文字的设计n（1）善用图片）善用图片n（2）网站字体）网站字体n 不要使用超过不要使用超过3种以上的字体种以上的字体n 不要用太大或太小的文字不要用太大或太小的文字n 避免过多使用不停闪烁的文字避免过多使用不停闪烁的文字3.2.4 首页设计首页设计n 首页的设计应该遵循快速、简洁、吸引人、信息首页的设计应该遵循快速、简洁、吸引人、信息概括能力强、易于导航的原则。概括能力强、易于导航的原则。n1 1首页的功能模块首页的功能模块n（1）页头）页头n（2）主菜单）主菜单n（3）最新消息的传递）最新消息的传递n（4）电子邮件地址）电子邮件地址n（5）联络信息）联络信息n（6）版权信息）版权信息n（7）其他信息）其他信息n2 2首页的可视化设计首页的可视化设计n3首页设计要注意的问题首页设计要注意的问题n（1）首页明确，主题突出）首页明确，主题突出n（2）尽可能缩短下载时间）尽可能缩短下载时间3.2.5 其他页面的设计其他页面的设计n1新闻页面的设计新闻页面的设计n（1）主页中的新闻标题）主页中的新闻标题n 新闻标题组成的要素新闻标题组成的要素n 新闻标题的版面布置新闻标题的版面布置n（2）新闻页面）新闻页面n2产品页面的制作产品页面的制作n3雇员页面雇员页面n（1）设计雇员目录）设计雇员目录n（2）创建默认页面）创建默认页面n（3）创建个人页面）创建个人页面n 联系信息联系信息n 组织和部门信息组织和部门信息n 雇员背景信息雇员背景信息 增加一些有趣的材料增加一些有趣的材料n4其他页面设计其他页面设计n（1）客户支持页面）客户支持页面n（2）市场调研页面）市场调研页面n（3）企业信息页面）企业信息页面n（4）其他内容）其他内容3.2.6 网页制作网页制作n1电子商务网站中的电子商务网站中的Web资源资源n2静态网页的制作静态网页的制作n3动态网页的制作动态网页的制作n（1）网页表示形式的动态制作）网页表示形式的动态制作n Script（脚本）语言（脚本）语言n Java Apletsn 层叠样式表（层叠样式表（CSS）n 虚拟现实建模语言（虚拟现实建模语言（VRML）n（2）网页数据内容的动态制作）网页数据内容的动态制作n 数据库设计阶段数据库设计阶段n 程序设计阶段程序设计阶段4用用Dreamweaver MX制作数据动态网页制作数据动态网页n Dreamweaver MX软软件件功功能能很很强强，即即可可以以制制作作静静态态网网页页，也也可可以以制制作作动动态态网网页页，包包括括可可以以动动态态显显示示数数据据的的网网页页。这这一一功功能能对对那那些些不不太太熟熟悉悉编编程程的的用用户户来来说说，非常有价值。非常有价值。n（1）建立数据库）建立数据库n（2）建立数据库连接）建立数据库连接n（3）建立一个静态页面）建立一个静态页面n（4）定义记录集）定义记录集n（5）添加动态内容）添加动态内容n（6）添加服务器行为）添加服务器行为3.3 网网 页页 发发 布布n3.3.1 选择选择Web服务器服务器n1磁盘空间磁盘空间n2可靠性可靠性n3客户服务客户服务n4价格因素价格因素n3.3.2 测试站点测试站点n3.3.3 远程设置远程设置n3.3.4 发布网页发布网页n 发布站点是将构成网页和站点的所有文件拷发布站点是将构成网页和站点的所有文件拷贝到贝到Web服务器上，让浏览者看到网页制作者的劳服务器上，让浏览者看到网页制作者的劳动成果。动成果。