电子商务网站规划设计

学习情境一电子商务网站规划设计讲稿与学习指南一、资讯（2学时）1．问题引入：(10′)问题1：企业真的需要电子商务网站吗？①电子商务能给企业带来什么？在目前的信息社会，电子商务对企业来讲非常重要。第一阶段，电子商务是“救命稻草”。第二阶段，电子商务是“锦上添花”。②企业真的需要电子商务网站吗？网站可以为企业提供的服务主要包括3S，即SHOW、SALE、SERVE：SHOW（展示）SALE（交易）SERVE（服务）问题2：企业的电子商务网站应该实现哪些功能？问题小结：电子商务是未来商务交易的主要运营方式，电子商务的实施与运作依赖于电子商务系统，电子商务网站则是电子商务系统工作和运行的主要承担者和表现者，是网上的“虚拟公司”或“虚拟工厂”。构建电子商务网站是通向电子商务的重要一步。电子商务网站是指一个企业、机构或公司在互联网上建立的站点，其目的是为了宣传企业形象、发布产品信息、宣传经济法规、提供商业服务等。企业简介产品展示质量认证网上销售网上采购网上安全反馈信息技术保证客户管理传统媒体搜索引擎BBS新闻组邮件群发友情链接企业网站主要功能企业网站三大支柱企业网站推广技术信息流资金流物流2．新授内容1）电子商务网站架构与构成要素(10′)①电子商务网站的架构典型的电子商务网站组成②电子商务网站的构成要素（1）网站域名这是Internet上惟一的域名。域名必须向ISP(InternetServiceProvider，因特网服务提供商)或网络信息中心申请。国内有许多网站接受域名申请，只有获得批准后，才是合法的域名。（2）网站物理地点存放各类与电子商务网站有关信息和数据的计算机、服务器等硬件设备。（3）网页网页的设计应有独特的风格。首先要让客户注册登录的手续简便快速，商品分类指示明确，如同进入一家大的商店，让客户能够迅速找到想要的商品。（4）货款结算客户通过购物车选购商品，然后结算，确定付款方式、送货地点、时间等。（5）客户资料管理管理已注册客户的姓名、通信地址、电话、电子邮件地址等信息。（6）商品数据库管理经常及时盘点商品，做好商品配货和商品配送。以上只是电子商务网站的大致结构，随着网站经营的商品及经营模式的变化，其构成要素也会有所变化。2）电子商务网站的总体设计与策划(10′)①网站规划设计流程网站设计的目的-----想要做什么（宣传、展示、直销等）网站设计过程及流程图用户需求分析—网站构建和流程设计—系统分析及总体设计—界面设计、程序开发—网站系统测试—客户培训、售后等网站规划的类型（B2B\B2C\C2C）②网站规划的具体内容网站内容设计原则支持企业的总目标主次分明，设计目的明确以消费者为中心主题鲜明突出，要点明确基本信息型、电子商务型、多媒体广告型功能实用，切合实际需要应考虑的主要因素目标市场情况市场环境产品、服务和品牌其它促进因素价格进货渠道规划的内容建设网站前的市场分析建设网站的目的及功能定位网站的技术解决方案网站内容规划网站页面设计网站维护网站测试网站发布与推广网站建设日程表费用明细③网站整体框架和网页设计框架设计方法网页关系设计网页设计布局设计④网站策划书的撰写3）电子商务网站栏目规划(15′)网站栏目策划是制作网站网页的起始点，也是网页制作的关键。网站栏目的实质就是一个网站的大纲索引，索引应该将网站的主题明确显示出来。确定栏目内容的原则如下：①尽可能删除与主题无关的栏目；②尽可能将网站最有价值的内容列在栏目上；③尽可能方便访问者的浏览和查询。问题探究：网站主题确定方法网站主题就是网站所要表述的主要内容。对于主题的选择，一般要求：①主题定位要准确；②主题要小而精；③题材最好是自己擅长或者喜爱的内容；④题材不要太滥或者目标太高。4）电子商务网站开发环境(15′)在众多的电子商务网站开发方案中，由Microsoft公司推出的IIS（InternetinformationServerWeb服务器）+ASP（ActiveServerPages编程语言）+Access或Sqlserver（网络数据库）的组合方案得到了广泛的应用。目前，IIS+ASP+Access已成为中小型电子商务网站建设的首选方案。①安装与配置IIS服务器IIS安装IIS服务器配置尽量不要使用缺省的Web站点。为IIS中的分类文件设置权限。保护IIS日志安全。删除不必要的应用程序映射。IIS作用？----静态网页技术与动态网页技术静态网页工作原理动态网页工作原理②Dreamweaver站点定义要制作一个完整的网站，首先需要创建一个站点，只有建立了站点，才能更好地完成网页制作和站点文件管理。③使用Dreamweaver创建ASP网页ASP工作原理5）电子商务网站主页内容布局(10′)常用网页内容布局方法：网站网页页内容布局方法主要有三种：表格、框架和层，其中表格是网页内容布局的主要方法，也是最基本、最直接的布局方法①使用表格方式布局网页使用表格布局的页面在不同平台，不同分辨率的浏览器里都能保持其原有的布局，且在不同的浏览器平台有较好的兼容性，所以表格是网页中最常见的排版方式之一。②使用层方式布局网页层提供了可精确定位页面元素的方法，页面元素放于图层中。③使用框架方式布局网页框架是网页设计中常用的技术，使用框架能将几个不同的Html文档显示在同一个浏览器窗口中。6）CSS在电子商务网站网页布局中的应用(10′)CSS是一系列格式设置规则，主要用来控制Web网页内容的外观，使用CSS可有效保持网站页面风格的一致性。CSS是一种格式化网页的标准方式，它对颜色、字体、间隔、定位以及边距等格式方面提供了多种属性，这些属性均可用于Html标记符。1．方便网页格式的修改2．便于减少网页体积3．能使网页元素更准确的定位4．良好的适应性3．师生互动(10′)互动讨论题：电子商务网站规划设计需要做哪些工作？要点：1）确定网站主题2）确定网站栏目3）搭建网站开发环境4）主页内容布局设计5）使用CSS美化网页布局……二、计划与决策（2学时）：1．目标描述(5′)在本学习情境中，将根据电子商务网站的整体策划要求，并以“重庆曼宁网上书城”网站整体策划为实例，从电子商务网站栏目规划、主页内容布局、CSS网页布局等几个方面来展开对电子商务网站策划。学生模仿此实例，自己选定一主题，例如可以选定“女性”、“鲜花”、“网上书店”、“某某企业”等，进行电子商务网站策划；要求规划网站相应内容、画出框架图、文字或图示网站策划的主题思想；并构建电子商务网站开发环境，用Dreamweaver编写网站主页asp文件，完成网站框架的制作，使用CSS样式完善主页的布局。2．案例讲授(40′)“重庆曼宁网上书城”网站基本栏目架构图1）确定网站主题2）讨论确定栏目3）搭建开发环境4）设计和布局网站主页5）使用CSS样式来完善主页布局3．项目选题与策划(20′)1）针对本项目目标任务描述自己选定一主题，进行项目策划。2）教师回答学生提问、对方案进行指导。4．策划方案的确定(25′)（课堂上未完成的，课后完成在作业本上）讨论修改项目策划思想，师生、同学之间多次交流互动，形成自己最终策划方案思想；撰写电子商务网站规划书；包括网站的名称、主题思想、画出框架图，并对框架图中的栏目进行必要的文字说明，以小组为单位完成（写到作业本上也可以打印）三、实施（4学时）学生根据项目任务、引导文、以及策划方案进行具体实施1．构建电子商务网站开发环境(90′)1）安装与配置IIS服务器2）用Dreamweaver给自己策划的网站定义一个站点3）使用Dreamweaver创建一个ASP测试网页,测试开发环境2．用Dreamweaver编写网站主页asp文件，完成网站框架的制作(45′)1）主页文件的分区2）表格的布局3）服务器包含指令（SSI）用法SSI是Server-SideInclude的简写，意为服务器包含，SSI指令为用户提供在Web服务器处理之前将一个文件的内容插入到另一个文件的方法。在ASP中使用SSI的语法如下：!--#includevirtual|file=filename--virtual和file关键字指示用来包含该文件的路径的类型，filename是想包含的文件的路径和名称。在使用SSI包含文件操作命令时，还需要注意一点的是，由于head.asp、copyright.asp文件代码需要嵌入到其他页面文件中使用，还需删除head.asp、copyright.asp文件中的html、body、title等标签，以及代码中的代码“%@LANGUAGE=VBSCRIPT%”，否则就会出现标签重复使用等错误。3．使用CSS样式完善主页的布局(45′)CSS滤镜应用方法滤镜效果Alpha设置透明度Blur建立模糊效果Chroma把指定的颜色设置为透明DropShadow建立一种偏移的影像轮廓，即投射阴影FlipH水平翻转FlipV垂直翻转Glow为对象的外边界增加光效Gray降低图片的彩色度Invert将色彩、饱和度以及亮度值完全翻转建立底片效果Light在一个对象上进行灯光投影Mask为一个对象建立透明膜Shadow建立一个对象的固体轮廓，即阴影效果Wave在X轴和Y轴方向利用正弦波纹打乱图片Xray只显示对象的轮廓四、检查与评估（2学时）1、成果汇报(60′)1）学生汇报自己完成的任务，展示成果（至少抽查5人汇报）2）回答教师和同学提出的问题2．点评与总结(10′)对学生汇报成果进行点评，指出成功和不足地方3．资料整理和提升(20′)1）学生提交电子与纸质资料2）项目任务完成资料的整理4．过程与结果评价（课后时间）教师对学生成果进行评价，给出每个学生的项目得分