(电子商务综合实训)项目5网站建设.pptx

项目五任务1：首页设计任务2：页面布局网站建设任务3：网页美化任务4：网站计数器任务5：用户注册任务6：用户登录任务1：首页设计任务背景任务分析任务实施任务小结课后实践返回总目录首页设计任务背景任务:请同学们帮助小明完成一份网站首页设计方案。任务背景 随着网络技术的发展，人们对网络的追求也越来越高，许多大公司为了针对新产品的研发也作了大量的工作。小明进入一家网页公司后从事建立站点及管理站点工作开始。公司要求小明对最新一款手机进行新产品的发布，通过网页的方式，让广大顾客可以在网上进行浏览其功能和特点。公司要求小明在正式开发的网站之前先提交一份首页外观的初步设计方案。返回总目录首页设计任务分析角色说明：任务分析小明（网站设计人员）对于一个商务网站来说，最重要的一个问题是网站设计在互联网上呈现出来的形象，因为在一定程度上，这很可能是客户对你公司的第一印象的产生来源。所以，一个夺人眼球的外观设计以及合理的模块设置十分重要。而色彩是人的视觉最敏感的东西。所以，小明可以首先从网站的整体配色入手，色彩搭配的好，可以锦上添花，达到事半功倍的效果。还可以利用所学过的Photoshop的相关知识来帮助设计，并完成页面模块的搭建。最后以网站首页效果图的形式来呈现设计方案。实训环境：Dreamweaver MX 2004返回总目录首页设计任务实施TIP:可参考实训指导手册，教师指导，学生实践，任务体验完成后小结交流。返回总目录首页设计任务小结任务小结1.了解前期设计工作对于网站的重要意义。2.学习了基本的配色方法3.了解网站搭建的基本步骤4.Photoshop在网站设计中的实际应用5.网站效果图的制作、与心得交流建立站点站点设计的基本流程如下：返回总目录首页设计课后实践课后实践1.对已经设计完成的网站首页效果图进一步完善2.尝试利用Photoshop中的切片工具，来提取一些图片素材为后续的网站正式搭建做准备。返回总目录任务2：页面布局任务背景任务分析任务实施任务小结课后实践返回总目录页面布局任务背景任务:请同学们帮助小明为网页添加布局表格与滚动条。任务背景 在以往的网页设计中，一半都是采用表格来布局整个页面，而放置滚动条能使页面变得更加生动。在公司里小明也想尝试用布局表格来设计网页，这样小明利用鼠标可以随心所欲地绘制不同风格的网页布局，做出各具特色的网页版面。为了方便企业及时发布动态、广告推广、小明还需要为销售网站的首页上添加滚动条。返回总目录页面布局任务分析角色说明：任务分析小明（网页制作人员） 在实际操作中，由于表格的编辑，如表格大小的调整、拆分等操作，小明在制作过程中要了解布局表格的绘制方法，图像的插入与保存等。而对于滚动信息条的制作，小明需要掌握marquee标签的使用方法。实训环境：Dreamweaver MX 2004返回总目录页面布局任务实施TIP:可参考实训指导手册，教师指导，学生实践，任务体验完成后小结交流。返回总目录页面布局任务小结任务小结1.表格布局的绘制方法2.图像、文字的插入3.表格的绘制及属性设置4.HTML标签的添加以及相关参数设置 流程如下：返回总目录页面布局课后实践课后实践1.利用布局表格和单元格绘制汽车发布的网页制作。2.并为该网页添加广告的信息滚动条。返回总目录任务3：网页美化任务背景任务分析任务实施任务小结课后实践返回总目录网页美化任务背景任务:请同学们帮助小张使用框架网页及CSS样式表来统一网站页面的风格任务背景 一个网站在主页设计完成之后，就需要开始设计网站内的分页。为了保证站点整体的完整性、协调性。站点中会用不少网页具有相同的导航栏、标题栏等，在制作每一张网页时都要制作相同的导航栏、标题栏，此外，网站的文本格式风格等还需要统一。小张感觉增加了工作量，如何解决这一问题？返回总目录网页美化任务分析角色说明：任务分析小张（网页美工） 在实际操作中，可以利用框架和CSS样式表来解决这些问题。首先，小明可以从框架网页的创建、调整、删除等基本操作及利用“属性”面板来设置框架属性和相关链接属性。待框架基本完成之后，针对网页的文本内容，可以利用CSS面板中新建CSS样式。这样，不仅能使站点中的网页都具有相同的格式，也保证了站点风格的一致性，大大提高了工作效率。实训环境：Dreamweaver MX 2004返回总目录网页美化任务实施TIP:可参考实训指导手册，教师指导，学生实践，任务体验完成后小结交流。返回总目录网页美化任务小结任务小结网页美化的基本流程：返回总目录网页美化课后实践课后实践1.尝试利用框架网页的制作方法制作完成手机销售网站其他分页的制作，分上框架、下框架和右框架来制作，各个框架保存方法准确。2.利用CSS样式的同时，利用CSS选择器设计超链接文字的样式。返回总目录任务4：网站计数器任务背景任务分析任务实施