网页制作实训报告模版.docx

《网页制作实训报告模版.docx》由会员分享，可在线阅读，更多相关《网页制作实训报告模版.docx（10页珍藏版）》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。

1、南昌理工辔掂Nanchang Institute of Technology课程实训报告系部：计算机信息工程专业：电子商务班级：10级电子商务（1）班实训课程：Dreamweaver网页制作实训项目名称：商业网站项目开发指导教师：关南宝分组成员：实训地点：实验楼实训日期：2011年12月17日2011年12月31日目录一、设计目的：错误!未定义书签。二、实验（设计）仪器设备和材料清单：错误!未定义书签。三、设计内容：错误!未定义书签。四、设计要求：1五、设计步骤：11、系统分析：12、总体设计：23、设计目标3六、系统功能模块的实现过程41、个人首页功能模块功能的实现过程4、收集网页基本模型，

2、设计网页的草图，制作网页的设计图，并练习图片的切片4、在DreamWeaver中建立网站目录结果，并使用DIV+CSS进行网页初步布局5、完成各页面的具体制作，并测试网页之间的链接6、发布和维护自己的网站四、设计要求：1、使用Dreamweaver完成网页制作；2、要求各页面设计符合网站开发规律；3、网站内各页面之间要有链接；4、网站内容符合主题；5、完成设计任务并书写课程设计报告。五、设计步骤：1、系统分析：1）需求分析通过调查，要求网站需要有以下功能： 现在市场饰品种类多，不容易进行选择。要求有明确的分类。 买家不太重视对饰品的保养，增加对饰品的保养方法的介绍需要设立完善的售后服务，即使解

3、决买家的疑问 写明购买方式，商品服务说明等，以免引起误会增加新品推荐、热卖宝贝和近期的促销，方便买家进行选择 对商品有详细的介绍，及图片等（并注名图片与实物可能存在的差别，以免引起误会）对买家的需求要有合理及时的处理2）可行性分析经济性：饰品市场多且杂，缺少有特点，且有针对性的商品销售，现在无论男生女生、老少，都 会要一件或几件适合自己的小饰品，市场很大，目前的饰品店很多。但东西大多毫无特色。你有我也有。没有特别优秀的东西出来。找好一个产品，专注的深入推广。银饰，钛钢等材 质饰品，价格适中，样式新颖，种类繁多，适合人群广。 技术性：明确的商品分类，企业级的管理信息系统，在底层的工业生产自动化、

4、物流自动化基础 上，通过计算机软、硬件技术实现企业信息集成与功能集成，进一步使经营生产业务实现信 息化管理。2、总体设计：1）项目规划饰品销售网站是以商品的推广及销售为主，兼有围绕销售产生的售后、饰品保养等，由 宝贝展台、近期优惠、银饰保养、购物须知购成，规划网站功能模块如下： 宝贝展台模块该模块包括新品模块、热卖宝贝、精选推荐模块、戒指模块、项链模块、手链模块、耳 环模块。 近期优惠模块该模块包括戒指块、项链模块、手链模块、耳环模块。 银饰保养模块该模块主要包括分类模块、保养方法模块购物须知该模块包括商品服务说明、邮资说明、联系方式、售后服务2）网站拓扑图构画：网站结构如图1所示。购物 须知

5、说明后、联服系方务式 .3、设计目标本网站是以进行饰品网上销售的要求进行设计的,主要实现如下目标:方便买家选择自己喜爱的饰品。明确介绍商品。使买家了解饰品的保养方法。明确分类，方便选购 明确的联系方式、商品服务说明及邮资说明。对囤货、次货的减价、低价处理。及时的售后服务个人网站实现了留言、文章、相册、日志、注册、链接、调查、后台管理等诸多功能于 一体的网站。本人经过需求分析、和可行性的管理方式进行了前台设计与后台管理。通过数 据库的创建与连接实现了人机交互功能。下面是首页和目录页的设计图：1、个人首页功能模块功能的实现过程个人首页主要放置主人的最新动态，导航条菜单包括首页、个人简历、个人相册、

6、文字 拾掇、我的聊吧、给我留言、友情链接。给我留言，必须通过先登陆或先注册才能进行留言。 底部插入个人网站的版权信息，同时也加入了联系我们、后台管理、首页收藏、设为首页、 版权声明。(1)个人首页导航功能实现介绍个人首页导航有六个链接分别是：我的首页、个人资料、我的日记、我的相册、友情链 接、留言板。它们都采用“行为”中“交换图像。如图3T所示。图6-1首页导航.个人首页公告栏功能实现过程公告栏的功能主要是对于浏览者现设计的。当浏览者进入首页时就可以看到分告栏中的 信息。主要用于提示和建议如何进行合法访问和主人的一些个人小要求。如图3-2所示。图6-2本站最新公告栏本站最新公告栏中的信息，当鼠

7、标经过时就停止，当鼠标移开时又开始流动。其功能的 实现主要是通过以下代码：(2) .留言板功能实现过程设计一个留言板作为和浏览者交流的纽带，这样可随时掌握浏览者的相 关信息和最新动态。浏览者通过留言后提交到后台数据库中，然后管理用户 可以通过后台进行对其留言的回复。留言薄的设计如图6-4所示这样就可以 产生一个动态的留言薄交互平台。图6-4留言薄发表页面.注册功能模块实现过程注册页面主要是对于没有用户名和帐号的浏览者要进行留言时所设计的页面。当浏览者 注册后的信息将自动提交到后台数据库中，以便下次要进行留言。注册页面的设计如图6-5 所示。图6-5注册页面2、个人资料功能模块的实现过程本模块是

8、个人资料部分，每个个人网站都会有作者介绍。块分别是：个人简历列信息显 示和个。在这页面主要的是静态的页面。在这个模块访客会了解到作者的一些基本信息，界 面内容如图6-6所示。图6-6个人简历 页面3、个人相册功能模块的实现过程本模块是展示个人的相册，主要是借鉴影集的制作来完成个人相册的功能的实现。个人 相册进行好归类后分成多个方面的相册所以首先进入是个人相册的目录。个人相册主中，浏 览者可以看到我“我的相册”、“我的朋友”、“明星相册”，的相关照片。在进行相册查看时 浏览者通过鼠标移动方式来浏览图片示在图片,如下图6-8所示。图6-8个人相册“面友情合影”页4、聊天室功能模块的实现过程聊天室是

9、一个交友与娱乐的场所。在聊天室里，可以随意发表，与大家进行交流。目前聊天室已成为各网站一个标准服务，是吸引网民和提高人气的一种重要方式。(1)聊天室的总体设计使用聊天室的必须过行登入才能进入聊天室，但是对何种用户没有限制。聊天室室的主 页面是一个框架文件，它主要包括在线用户统计页面，用户发表页面和显示页面。聊天室的 总体设计如图6T6所示：聊天室用户登聊天室斗I在线用户统计用户发表页- 显示发5、课程设计中遇到的难点及解决办法难点：1、从整体布局看较为合理，但是从局部来讲存在一些技术上和严密性的不足。2、页面美观度不够高，Dreamewver CS4软件应用不够熟练，软件中所涉及得制作方法以及

10、 工具没有更好的应用。解决办法：1、配色原则：避免网页杂、舌L,有时候单一色彩不为也是一种独特，用色柔和，减少视觉 混乱，对比度强的色彩不能应用于一般网站。2、字体问题：字体是整个网页最醒目的部分，若字体不协调会给人一种枯燥的感觉，避免 用黑色字体，减少压抑感。3、制作习惯：制作一个网页首要的是完美的构思，应该先构思好再动手制作，素材搜集完 整，根据主题选材，不能脱离主题，确保所用材料与主题相关。最好不要一点一点添上去, 只要布局素材准备充分，应该可以做到理想网页。4、.完整性：网站的基本格式完整，相关链接，友情链接必不可少，这也增加了网页的方便 性。5、不可忽略的细节：对网站的感觉不好，不过

11、又说不出，多半是细节处理问题，细心的处 理网页的每一个象素，力求完美。七、设计心得1、在开始制作网站前，我已经在心中构思了一遍。在写每个页面时，也是先确定设计 目标，然后再在绘制设计图。我发现这样可以令我在制作网页时保持清醒的头脑，在网页开 发过程中避免错误，而遇到错误时对照设计草图也可以很快改正。2、经过这次课程设计，我体会到了开发网站的辛苦及乐趣。一个小小的链接错误，你 可能要花半天甚至一个晚上才能调试出来；但是当发现了错误并把它排除后，那种成就感是 不可言喻的。在这次设计中，我犯了几个逻辑错误，但靠着耐心的测试，我不仅一一排除了 错误，更学到了不少东西。3、在确定网站设计目标时，我也遇到

12、了问题。一开始不知道从何处下手，到后来在网 上找到足够多的资料后，又发现什么都想做到网站中去。按照老师说的，先确定自己想做什 么，然后根据想表达的思想再去查找材料，再根据材料确定网站的设计目标。不要过多也不 要太少。4、通过本次课程设计我终于知道如何去设计一个合理的网站，原来制作网站就象小马 过河一样，即不是那么轻而易举，也不是艰难险阻，而要靠一步一步，践踏实地的去完成才 行。2、个人资料功能模块的实现过程53、个人相册功能模块的实现过程54、聊天室功能模块的实现过程5七、设计心得7一、设计目的:1、通过综合实训进一步巩固，深化和拓展学生的理论知识与专业技能。1）掌握规划网站的内容结构，目录结

13、构，链接结构的方法。2）熟练掌握网页制作软件Dreamweaver的基本操作和使用技能。3）掌握页面的整体控制和头部内容设置的方法。4）熟练掌握网页页面布局的各种方法。5）熟练掌握在网页中输入，设置标题和正文文字的方法。6）熟练掌握在网页中插入图象，flash动画和背景音乐的方法。7）熟练建立各种形式的超级链接的方法。8）掌握表单网页制作方法。9）掌握网页特效制作方法。10）掌握网站测试的方法。2、训练和培养学生获取信息和处理信息的能力，充分培养和提高学生的动手能力，学会通 过网站、书籍、素材光盘等方式收集所需的文字资料、图象资料、flash动画和网页特效等。 3、培养学生运用所学的理论知识和技能解决网站开发过程中所遇到的实际问题的能力及其 基本工作素质。4、培养学生理论联系实际的工作作风，严肃认真的科学态度以及独立工作的能力，树立自 信心。二、实验（设计）仪器设备和材料清单：I、硬件：PC机、能够上互联网的机房2、软件： 安装有 Dreamweaver, Flash, PhotoShop 软件3、准备磁盘拷贝学生资料三、设计内容：1、确定网站主题，并搜集与主题相关的素材2、对所要制作的网站进行系统设计，规划网站基本结构，设计网站的目录结构图