《电子商务网页设计（第二版）》 课件项目一

赏析电子商务商城类网站任务一项目一电子商务网站页面赏析制作第一个网页——“第一个主页”上传“第一个主页”到网上在Ｗｉｎ１０中建立Ｗｅｂ服务器任务二任务四任务三

1电子商务网站页面赏析学习目标了解国内著名的网上交易平台网站了解如何制作第一个网页掌握常见的网络术语，了解将网页上传到互联网的方法掌握在Win10中建立Web服务器的方法项目介绍随着互联网的普及，网络销售的便捷和低成本让越来越多的个人和企业开始涉足电子商务网站，大家都希望搭乘互联网的东风，为自己带来更多的收入。使用开源网店程序，你可以非常容易地建立一个电子商务网|站。国外知名的开源网店程序有Magento、OS-Commerce等，国内的开源网店程序有Ecshop和ShopEX等。在遵守相关授权协议的情况下，你可以免费使用这些程序搭建一个网店。一个设计精良的电子商务网站将会给你带来更多的客户和收入。所以，如果你想取得更好的效果，建议多花些精力在你的网站设计上面

2任务分析知识链接本任务提供了三个国内知名电子商务网站的主页，希望读者通过欣赏这些精美的电子商务网站，提高学习电子商务网页制作的兴趣。静态网页是文件扩展名为.html或.htm的网页，在静态网页中包含HTML标记、脚本（|JavaScript、VBScript），以及一些图像、Flash等网页元素。动态网页与静态网页相对应，文件扩展名有asp、aspx、php和jsp等。赏析电子商务商城类网站1

3赏析电子商务商城类网站1１．网页与网站网页是网站的基本元素，是承载各种网站应用的平台。通俗来说，网站是由网页组成的，如果你只有域名和虚拟主机，而没有制作任何网页的话，你的客户仍旧无法访问你的网站。网页是一个文件，它存放在世界某个角落的某一部计算机中，而这部计算机必须是与互联网相连的。网页经由网址来识别与存取，是万维网中的一“页”，采用超文本标|记语言格式（标准通用标记语言的一个应用，其文件扩展名为.html或.htm）。网页要通过网页浏览器来阅读。网站则是由内容相关的、通过某种方式联系在一起的若干网页组成的。网页是网站中的一页，是构成网站的基本元素。2．服务器与浏览器服务器是一个管理资源并为用户提供服务的计算机软件，通常分为文件服务器、数据库服务器和应用程序服务器。运行以上软件的计算机或计算机系统也被称为服务器。我们将制作好的网页上传到服务器，就可以通过网络来访问这个网站了。浏览器是用来浏览网页的工具软件，常用的浏览器有MicrosoftEdge、IE、Go|ogleChrome、火狐、３６０浏览器等。３．网站的工作原理当我们在客户端发出请求的时候，假如我们请求的是一个静态的网页，那么这个网页请求到了Ｗｅｂ服务器以后，Ｗｅｂ服务器就会在本身安装的机器的硬盘上寻找相关的网页，然后返回。假如我们请求的是一个包含动态语言代码的网页，那么服务器接收到请求以后，就会接着传送给同时安装在这个机器上的应用程序服务器，由它负责解释和执行网页，最后将执行的结果传递给客户端浏览器。010203相关

4赏析电子商务商城类网站1任务１．知名电子商务平台———当当网主页（见图１-１）2．ＴＣＬ在淘宝|网站上的电子商务主页（见图１-２）图１-１当当网主页图１-２TCL在淘宝网站上的电子商务主页

5赏析电子商务商城类网站1任务３．知名电子商务平台———京东商城主页（见图１-３）图１-３京东商城主页

6制作第一个网页——“第一个主页”2任务使用记事本制作一个简单的网页，网页标题栏显示“第一个主页”，网页区域字体设置为蓝色、宋体、６号的文本“这是我第一个主页”，制作后效果如图１-４所示。图１-４“第一个主页”制作后效果

7HTML（HyperTextMarkupLanguage）即超文本标记语言。超文本是指页面内可以包含图|片、链接，甚至音乐、程序等非文字元素。超文本标记语言的结构包括头部（Head）和主体部分（Body），其中头部提供关于网页的信息，主体部分提供网页的具体内容。制作第一个网页——“第一个主页”21.网页制作的语言随着互联网科技的发展，越来越多的网页设计工具软件面世，它们功能强大、操作简单，深受广大网页设计者的喜爱，其中最著名的便是由Adobe公司开发出来的以下３种工具软件。（１）网页编辑工具———Dreamweaver。Dreamweaver是一个可视化的网页设计和网站管理工具，支持最新的Web技术，包含HTML检查、H|TML格式控制、HTML格式化选项、HomeSite/BBEdit捆绑、可视化网页设计、图像编辑、全局查找替换、FTP功能、处理Flash和Shockwave等富媒体格式和动态HTML、基于团队的Web创作。（２）网页动画制作工具———Animate。Animate是一款电脑动画设计软件，这种动画有互动功能，利用该软件可以将音乐、动画、图像巧妙地融合在一起，制作出高品质的动画，把这些动画放在网页上，能达到吸引用户眼球的目的。（３）图形图像处理工具———Photoshop。利用这款图形图像处理工具软件可以设计出合适的图像|文件来美化网页，从而更好地体现网页所要表达的内容。2.网页设计工具相关

8制作第一个网页——“第一个主页”2任务图１-５在记事本中输入的网页代码（１）打开记事本程序，方法：单击“开始”→“Windows附件”→“记事本”。（２）在打开的记事本中，输入如图１-５所示的网页代码。提示：charset是“编码”的意思。charset有很多类型，gb2312和UTF-8就是其中两种常见的编码。gb2312是中文的字符集，对中文支持比较好，但是如果网页使用英文或者其他的外文，比如日文、韩文，gb2312就不能支持了。UTF-8是|全球通用的一种编码，它支持包含中文、日文、韩文等在内的所有的文字。如果使用了UTF-8，在网页显示中文的时候出现乱码，那就试试gb2312

9制作第一个网页——“第一个主页”2任务（３）将文件保存成文件名为index.html的文件，保存方法：单击“文件”→“另存为”，弹出另存为对话