开发平台实验指导书学生版2.docx

开发平台实验指导书学生版2.docx

《开发平台实验指导书学生版2.docx》由会员分享，可在线阅读，更多相关《开发平台实验指导书学生版2.docx（34页珍藏版）》请在冰豆网上搜索。

开发平台实验指导书学生版2

目录

实验体系二：

电子商务网站设计实验

4.1实验一登录模块设计实验

4.1.1实验前的准备

（1）知识点学习

登陆框是用户用于会员注册和登陆的。

吸引更多会员是电子商务网站运营的主要目标之一，网站的访问量和点击率很大程度上是和会员数量相关的，故登陆框应放在较显眼的位置，并且应具备操作便捷、简单明了的特点，可根据网站界面整体风格变换其具体形式。

所以根据用户网页浏览注意力“F现象”（用户对网页的浏览视线呈“F”型，他们更倾向于在网页顶部阅读长句，随着网页越往下，他们越不会阅读长句，这就使得每个句子的开头两个词汇尤其重要，所以在网页设计应该强调重要的信息放在网页左上方）会员登陆框一般放在整个网页的右上方和中上方较显眼的位置。

（2）实现原理：

用户填写用户名及密码，提交到后台在数据库中进行比较，如果信息正确，保存用户信息，用户成功登陆；否则登陆失败，返回错误提示信息。

4.1.2实验目的

（1）理解电子商务网站中登陆模块设计的意义。

（2）掌握登陆模块的设计方法和技巧。

4.1.3实验内容及步骤

（1）进入编辑器页面

学生通过点击“定制站点”新建一个站点，在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加相应的web模块组件（如图4.1）。

图4.1web组件

（2）添加组件

在组件列表中选择“登陆样式一”或者“登陆样式二”来添加登陆功能模块，模块添加完成后就可以在编辑器的编辑模式下看到添加组件的页面效果了。

（如图4.2）

图4.2添加登陆组件

（3）程序版本控制

学生添加完成登陆页面保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.3登陆组件同步

图4.4测试程序前台

（4）生成程序后台

在对登陆前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成登陆页面的后台程序了。

通过后台程序的生成就完成了一个完整的用户管理模块的设计了。

（图4.5）

图4.5后台管理

（5）学生作业练习

某电子商务网站首页做的很难看，特别是登陆框做的很小，很难被发现，导致该网站访问率下降。

请你现在为该网站主页只设计一个登陆框，其他内容不需设计。

要求大小适合，在页面中的位置要适当，符合电子商务网站的需要。

4.1.4实验考核

通过实验，学生可以了解一般电子商务网站的登陆样式，掌握登陆模块的添加和设计技巧。

4.1.5思考题

（1）登陆模块都具有什么样的功能？

（2）在系统中是怎样实现登陆组件添加的？

4.2实验二导航条设计实验

4.2.1实验前准备

（1）知识点学习：

网站导航设置是在网站栏目结构的基础上，进一步为用户浏览网站提供的提示系统。

由于各个网站并没有统一的标准，不仅菜单设置各不相同，打开网页方式也有区别。

有些是在同一窗口打开新网页，有些是新打开一个浏览器窗口，因此仅有网站栏目菜单有时会让用户在浏览网页中迷失方向，如无法回到首页或者上一级页面等，还需要辅助性的导航来帮助用户方便地使用网站信息。

一般是通过在各个栏目的主菜单下面设置一个辅助菜单来说明用户目前所在网页在网站中的位置。

其表现形式比较简单，一般形式为：

首页→一级栏目→二级栏目→三级栏目→内容页面。

（2）实现原理：

后台管理界面添加导航，将导航信息保存到数据库中，前台展示页面通过查询后台数据库，得出导航信息的标题、链接页面、打开方式等信息，以超级链接形式实现导航。

4.2.2实验目的

（1）理解导航模条在网站中的意义。

（2）掌握设计导航条的方法。

4.2.3实验内容及步骤：

（1）进入编辑器页面

在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加相应的web模块组件（如图4.6）。

图4.6web组件

（2）添加组件

在组件列表中选择“导航条”来添加导航功能模块，模块添加完成后就可以在编辑器的编辑模式下看到添加组件的页面效果了。

（如图4.7）

图4.7添加导航条组件

（3）程序版本控制

学生添加完成导航条组件保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.8导航条组件同步

图4.9测试程序前台

（4）生成程序后台

在对导航前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成导航页面的后台程序了。

通过后台程序的生成就完成了一个完整的导航条管理模块的设计了。

图4.10后台管理

（5）学生作业练习

从电子商务的角度为沃尔玛的网站设计导航条，请先思考该网站应该包含哪些内容，然后设计导航条。

要求通过该导航条可以很直观地了解网站包含哪些内容。

4.2.4实验考核

通过实验，学生可以掌握导航条在网站中的重要性，学会设计清晰、准确的导航条的方法和技巧。

4.2.5思考题

（1）导航条的作用是什么？

4.3.实验三新闻模块设计实验

4.3.1实验前的准备

（1）知识点学习：

对于电子商务网站来说，信息发布是最基础的功能和目的，获得有效信息是用户浏览网站的主要动力，为用户提供准确、快速、大量有价值的信息才可以吸引更多的用户。

网络环境下信息的承载形式包括文本、表格、图片、视频、音频等。

信息发布模块可以实现信息发布和维护的高效率、低成本，它提供简单的信息添加工具，通过这个工具，在信息添加完成后软件系统会自动根据页面模板效果生成信息网页，这样既保证了页面美观又保证了风格统一。

软件中以新闻信息模块为例直观地展示了在电子商务网站中信息发布功能的使用，并提供了三种不同样式的新闻信息模块供学生自由选择。

（2）实现原理：

后台管理界面添加新闻，将新闻信息保存到数据库中，前台展示页面通过查询后台数据库，得到新闻的标题、作者、内容及新闻的展示图片，在表格中呈现新闻信息。

4.3.2实验目的

（1）熟悉电子商务网站中新闻模块的几种样式。

（2）掌握新闻模块的设计方法和应用技巧。

4.3.3实验内容及步骤

（1）进入编辑器页面

在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加相应的web模块组件（如图4.11）。

图4.11web组件

（2）添加组件

在组件列表中选择“新闻样式一”或“新闻样式二”或“新闻样式三”来添加新闻功能模块，模块添加完成后就可以在编辑器的编辑模式下看到添加组件的页面效果了。

（如图4.12）

图4.12添加新闻组件

（3）程序版本控制

学生添加完成新闻组件保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.13新闻组件同步

图4.14测试程序前台

（4）生成程序后台

在对新闻前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成新闻页面的后台程序了。

通过后台程序的生成就完成了一个完整的新闻管理模块的设计了。

图4.15后台管理

（5）学生作业练习

假设你开了一个网上花店，现在需要通过在网上发布相关新闻来宣传产品和网站，甚至可以炒作网站。

请设计一个新闻中心，要求以适当的大小放在适当的位置，并发布适当的内容。

4.3.4实验考核

通过实验，学生可以掌握电子商务网站中新闻模块的设计方法，掌握添加新闻的技巧和新闻在电子商务网站中的意义。

4.3.5思考题

（1）新闻模块中有哪几项功能操作？

（2）电子商务网站中新闻模块的作用？

4.4实验四公告模块设计实验

4.4.1实验前的准备

（1）知识点学习

公告也是电子商务网站中信息发布的一种常见形式，公告栏的设计主要为了是突出某些重要或时效性很强的信息，一般位于主页的上方比较明显的位置，里面的文字可以大一些，色彩鲜艳一些，可采用滚动字幕的方式显示，以便让浏览者在进入主页的瞬间就可以马上看到公告栏的信息，并通过点击信息的链接进入详细的介绍。

（2）实现原理：

后台管理界面发布公告，将公告信息保存到数据库中，前台展示页面通过查询后台数据库，得出公告信息的标题、内容等信息，以表格形式展示出来。

4.4.2实验目的

（1）理解电子商务网站中公告存在的意义。

（2）学会在电子商务网站中设计公告。

（3）学会添加高效的公告。

4.4.3实验内容及步骤

（1）进入编辑器页面

在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加相应的web模块组件（如图4.16）。

图4.16web组件

（2）添加组件

在组件列表中选择“公告样式一”或“公告样式二”来添加公告功能模块，模块添加完成后就可以在编辑器的编辑模式下看到添加组件的页面效果了。

图4.17添加公告组件

（3）程序版本控制

学生添加完成公告组件保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.18公告组件同步

图4.19测试程序前台

（4）生成程序后台

在对公告前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成公告页面的后台程序了。

通过后台程序的生成就完成了一个完整的公告管理模块的设计了。

图4.20后台管理

（5）学生作业练习

某电子商务公司内部员工出现内部经济丑闻，现公司决定通过网站公告栏发布公告，以挽回公司形象。

请为该公司网站设计一公告栏，具体文字内容自拟。

要求以适当大小放在适当位置，并发布适当内容。

4.4.4实验考核

通过实验，学生可以理解公告在电子商务网站中的意义，学会添加公告的方法和技巧。

4.4.5思考题

（1）公告模块中有哪几项功能操作？

（2）电子商务网站中公告模块的作用？

4.5实验五商品展示模块设计实验

4.5.1实验前的准备

（1）知识点学习：

通过网站展示商品是电子商务网站运营的主要目的之一。

将商品的特点准确恰当地展示出来，才能引起浏览者的注意。

按照AMID模式（注意力、兴趣、愿望、行动）商品通过网站的展示首先引起浏览者注意，通过浏览查看展示信息进而产生兴趣，在此基础上进而激发其拥有该产品的愿望，直至产生购买的行为，可见商品展示是网站取得销售的最重要的影响因素。

在电子商务网站中对商品的展示主要可通过文字、表格、图片、视频等手段完成，使网络展示具有其独有的优点，可以更专业、更详细、更全面地介绍商品的特性和功能，可以多角度来展示商品（比如展示产品的内部解剖图），还可以通过视频等方式展示产品的使用、维护等过程。

软件中用单商品与多商品两种不同的商品展示模块让学生体会电子商务网站中商品展示功能的使用。

（2）实现原理：

后台管理界面发布商品，将商品信息保存到数据库中，前台展示页面通过查询后台数据库，得到商品的名称、价格、原价和现价及商品的展示图片，在表格中呈现商品信息。

4.5.2实验目的

（1）熟悉电子商务网站中商品展示的方式。

（2）掌握在电子商务网站中展示商品的方法和技巧。

4.5.3实验内容及步骤

（1）进入编辑器页面

在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加相应的web模块组件（如图4.21）。

图4.21web组件

（2）添加组件

在组件列表中选择“单商品展示”或“多商品展示”来添加商品功能模块，模块添加完成后就可以在编辑器的编辑模式下看到添加组件的页面效果了。

（如图4.22）

图4.22添加商品组件

（3）程序版本控制

学生添加完成商品组件保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.23商品组件同步

图4.24测试程序前台

（4）生成程序后台

在对商品前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成商品页面的后台程序了。

通过后台程序的生成就完成了一个完整的商品管理模块的设计了。

图4.25后台管理

（5）学生作业练习

请为联想电脑网站的产品介绍页面设计商品展示栏。

要求从电子商务角度，以适当的大小放在适当的位置，发布适当的信息，介绍其最新的几种产品。

4.5.4实验考核

通过实验，学生可以掌握在电子商务网站中商品模块的设计方法，掌握添加商品的技巧。

4.5.5思考题

（1）电子商务网站商品展示的方式有哪些？

（2）电子商务网站商品展示的后台管理有哪些？

4.6实验六商品购物车、订单查询模块设计实验

4.6.1实验前的准备

（1）知识点学习：

电子商务网站的信息更新相当快，每天会有大量的新信息进入网站，而在其中找到需要的有用的信息无疑比较困难。

所以许多网站都提供了站内搜索功能，方便用户快速找到需要的信息，而使用便捷也是许多网站浏览者非常关注的事情。

搜索的设计应根据网站自身的情况而定。

软件中给出了订单查询模块，方便学生体验电子商务网站中搜索功能的使用。

购物车模块是用来显示用户已选择采购但暂时未付款的所有商品，简化了搜索的环节，让用户方便清晰地看到自己的购物车内现在有哪些商品，也是一个可以体现网站人性化服务的模块。

（2）实现原理：

点击购买商品，将选购的商品信息保存在购物车表中，同时购物车模块中的信息从购物车表中查询出来，以表格形式表现出来。

当点击付款时，产生随即订单编号，将这次选购的商品金额，邮购地址等信息保存起来。

一次购物操作完成。

4.6.2实验目的

（1）熟悉电子商务网站中购物的流程。

（2）掌握电子商务网站中订单产生的流程。

4.6.3实验内容及步骤：

（1）进入编辑器页面

在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加相应的web模块组件（如图4.26）。

图4.26web组件

图4.27web组件

（2）添加组件

在组件列表中选择“购物车”及“订单查询”来添加商品功能模块，模块添加完成后就可以在编辑器的编辑模式下看到添加组件的页面效果了。

（如图4.22）

图4.28添加购物车及订单管理组件

（3）程序版本控制

学生添加完成商品组件保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.29组件同步

图4.30测试程序前台

（4）生成程序后台

在对购物车和订单管理前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成订单查询页面的后台程序了。

通过后台程序的生成就完成了一个完整的订单管理模块的设计了。

图4.31后台管理

（5）学生作业练习

某电子商务网站产品很多，请为该网站设计购物车和订单管理功能。

要求以适当的大小放在适当的位置，以达到直观和方便的效果。

4.6.4实验考核

通过实验，学生了解电子商务网站中购物的过程，掌握电子商务网站中购物的过程和实际生活中超市购物的相同点和不同点。

4.6.5思考题

（1）电子商务网站购物车和订单查询的关系？

4.7实验七咨询信息模块设计实验

4.7.1实验前的准备

（1）知识点学习

网站的发展与壮大主要是靠大量浏览者的支持，网站与客户之间的关系是网站生存之本。

客户对于网站的意见与建议对于网站的建设、改进、完善起着至关重要的作用。

咨询信息模块就是加强网站与客户之间的交流，为客户提供畅通方便入口的一种媒介，让客户方便与网站管理者交流，达到建设与使用者的统一，更大地发挥网站的作用，使网站真正成为客户的家园。

（2）实现原理：

后台管理界面或前台页面添加咨询信息，将咨询信息保存到数据库中，前台展示页面通过查询后台数据库，得到咨询信息的标题、作者、内容，在表格中呈现咨询信息。

4.7.2实验目的

（1）掌握电子商务网站中公告模块的设计方法。

（2）掌握电子商务网站中咨询信息的添加方法。

（3）体会在电子商务网站中咨询信息的作用。

4.7.3实验内容及步骤

（1）进入编辑器页面

在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加web模块组件（如图4.32）。

图4.32web组件

（2）添加组件

在组件列表中选择“咨询信息”来添加咨询功能模块，模块添加完成后就可以在编辑器的编辑模式下看到添加组件的页面效果了。

（如图4.32）

图4.33添加咨询信息组件

（3）程序版本控制

学生添加完成咨询组件保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.34组件同步

图4.35测试程序前台

（4）生成程序后台

在对咨询管理前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成咨询页面的后台程序了。

通过后台程序的生成就完成了一个完整的咨询管理模块的设计了。

图4.36后台管理

（5）学生作业练习

某域名代理公司网站主页需要加入信息咨询功能，请为该公司设计。

要求以适当大小放在适当位置。

4.7.4实验考核

通过实验，学生可以了解资咨询信息模块的添加过程和信息添加过程，理解咨询信息对客户和网站管理者之间的沟通作用。

4.7.5思考题

（1）咨询信息的作用是什么？

4.8实验八友情链接模块设计实验

4.8.1实验前的准备

（1）知识点学习：

友情链接就是在您的网站上，点击一行字或一张图，会切换到（或弹出）另一个您认可的页面（例如是您喜欢的网站，您朋友的网站）。

它的作用主要表现在：

提高网站的访问量、增加用户浏览时的印象、让搜索引擎收录更多的网页、在搜索引擎排名中增加优势，而这些都是一个电子商务网站管理者必须考虑的因素。

一般友情链接都在网站的主页，链接的方式常为图片链接或文字链接，可以放在网页的左下方、右下方或底部的位置。

友情链接是网站宣传的一个有效方式，在选择友情链接的合作网站时需考虑多方面因素，才能良好的发挥它最大的作用。

友情链接的网站应具备以下特征：

与你的主题相关或互补的网站；PR值（全称为PageRank，是google搜索排名算法中的一个组成部分，级别从1到10级，10级为满分，PR值越高说明该网页在搜索排名中的地位越重要）高于自己的网站；流量大、知名度高、频繁更新的重要网站；具有很少导出链接的网站；内容质量高的网站。

需注意不要链接作弊网站，特别是被baidu，google屏蔽的网站，这些网站网页收录数目都是0。

（google更新收录数目通常要1个月的时间，XX约1周更新一次）

（2）实现原理：

后台管理界面添加友情链接，将链接信息保存到数据库中，前台展示页面通过查询后台数据库，得到链接的地址、链接的标题、网站的log图片等信息，以超级链接的形式实现友情链接。

4.8.2实验目的

（1）掌握在电子商务网站中添加友情链接模块的方法。

（2）掌握在电子商务网站中添加高效友情链接的技巧。

4.8.3实验内容及步骤

（1）进入编辑器页面

在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加相应的web模块组件（如图4.37）。

图4.37web组件

（2）添加组件

在组件列表中选择“友情链接样式一”或“友情链接二”来添加友情链接功能模块，模块添加完成后就可以在编辑器的编辑模式下看到添加组件的页面效果了。

（如图4.38）

图4.38友情链接

（3）程序版本控制

学生添加完成友情链接组件保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.39组件同步

图4.40测试程序前台

（4）生成程序后台

在友情链接管理前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成友情链接页面的后台程序了。

通过后台程序的生成就完成了一个完整的友情链接管理模块的设计了。

图4.41后台管理

（5）学生作业练习

某电脑销售公司的网站主页需加入友情链接，请为该公司加入适当的网站链接。

要求以适当的大小放在适当的位置。

4.8.4实验考核

通过实验，学生可以了解友情链接在电子商务网站中的作用，掌握添加友情链接的方法和技巧。

4.8.5思考题

（1）让学生思考友情链接作用是什么？

（2）让学生思考怎样才能创建一个高质量的友情链接？

4.9实验九网站调查模块设计实验

4.9.1实验前的准备

（1）知识点学习

问卷调查对于发现问题和解决问题起着很重要的作用，在以往的许多商业活动中都被广泛应用，但常规的问卷调查依托实地、信件或者电话的形式完成，不但效率低下，普遍性差而且费用昂贵。

网络的特性就是范围宽广，没有地域与国家的限制，它一个天然的、有利的问卷调查群，网上调查涉及人群广，低成本而且高效率，为问卷调查提供了一个新的有效的平台。

网上调查问卷设计及管理对一个电子商务网站的运作起到不可忽视的作用。

（2）实现原理：

后台管理界面添加调查的标题、主题及选项，将调查信息保存到数据库中，前台展示页面通过查询后台数据库，得到调查的标题、主题、等信息，以超级链接的形式实现显示。

当点击调查主题，展示调查的主题及选项，选择相应的选项进行投票，选择的选项的票数累加。

调查完成。

4.9.2实验目的

（1）了解网站调查的意义。

（2）掌握设计网站调查的方法。

（3）掌握从网络收集信息的手段和效率。

4.9.3实验内容及步骤

（1）进入编辑器页面

在站点设计中点击前台编辑器进入编辑器页面，在编辑器中的工具栏中找到“电子商务组件”按钮，通过按钮学生可以添加相应的web模块组件（如图4.42）。

图4.42web组件

（2）添加组件

在组件列表中选择“网站调查”来添加网上调查功能模块，模块添加完成

就可在编辑器的编辑模式下看到添加组件的页面效果了。

（3）程序版本控制

学生添加完成网上调查组件保存后，在导航中通过“程序版本控制”按钮来把新添加的页面从测试区同步到工作区去。

在完成页面的同步后就可以进行前台页面测试了。

图4.43组件同步

图4.44测试程序前台

（4）生成程序后台

在网站调查管理前台页面添加完成后，就可以利用系统提供的“生成程序后台”按钮自动生成网站调查页面的后台程序了。

通过后台程序的生成就完成了一个完整的网站调查管理模块的设计了。

图4.45后台管理

（5）学生作业练习

假设肯德基网站需要通过网站调查客户需求，请从电子商务角度为其设计，内容自拟。

要求以适当大小放在适当位置。

4.9.4实验考核

通过实验，学生可以了解网站调查在电子商务网站中的作用，掌握从网络收集信息的方法和技巧。

4.9.5思考题

（1）让学生思考网站调查作用是什么？

4.10实验十电子商务网站设计综合实验

4.10.1实验前的准备

（1）复习前面学过的HTML标记语言。

（2）熟悉电子商务开发平台中的组件及对应的管理。

4.10.2实验目的

（1）掌握开发功能齐全的电子商务网站过程。

（2）掌握电子商务网站的综合管理技能。

4.10.3实验内容及步骤

（1）进入前台编辑器，结合编辑模式和代码模式设计自己的网站页面，