网页设计课程报告.doc

武汉理工大学华夏学院课 程 报 告课程名称:网页设计与制作题  目:仙剑四简介专  业 信息工程系  班  级 物联网1122班 学  号 **********  姓  名   李维嘉   成  绩_________________指导教师  苏永红   2014年10月20日至2014年12月30日1设计目的本课程的设计目的是通过实践使同学们经历Dreamweaver cs3开发的全过程和受到一次综合训练,以便能较全面地理解、掌握和综合运用所学的知识。结合具体的开发案例,理解并初步掌握运用Dreamweaver cs3可视化开发工具进行网页开发的方法;了解网页设计制作过程。通过设计达到掌握网页设计、制作的技巧。 了解和熟悉网页设计的基础知识和实现技巧。根据题目的要求,给出网页设计方案,可以按要求,利用合适图文素材设计制作符合要求的网页设计作品。熟练掌握Photoshop cs3、Dreamweaver cs3等软件的的操作和应用。 增强动手实践能力,进一步加强自身综合素质。 学会和团队配合,逐渐培养做一个完整项目的能力。2开发环境PC机一台Dreamweaver软件WindowsServer ,MicrosoftVisual 。3需求分析设计个人网站的ASP网页设计,要求实现网站信息浏览、超链接、数据库连接、信息查询、信息添加和删除等基本功能。具体要求为:(1)网站要有一个明确的主题,网站标志语、界面主色调与网站主题相匹配,界面布局设计美观、大方、合理,要求用到HTML、表格、表单、框架、导航条、CSS、APDIV布局对象、插入多媒体对象,JavaScript脚本语言或VBScript脚本语言、ASP技术、IIS服务器,网页与数据库连接技术。(2)主页要求有用户登录显示,实现网站信息浏览、超链接、信息查询、信息修改等基本功能。4概要设计(1)设定图像边框粗细:在“外观”选项卡的“布局”栏里可以根据需要定义图像的边框,也可以定义边框值为“0”,即无边框。(2)设置图像环绕方式:一般情况下一幅图像只能与一行文字处在同一高度,但有时需要将图像和文字分开,且两者互不影响。比如在网页左边插入一幅图像,要求右边的文字就像没有图像时可以多行输入,这就要通过设置图像的环绕方式来实现。在网页中图像的环绕方式有两种:①左环绕:图像在左边,文本在图像的右边进行环绕。 ②右环绕:图像在右边,文本在图像的左边进行环绕。在“外观”选项卡的“布局”栏中打开“对齐方式”下拉列表框,选择“左”选项,并单击“确定”按钮,图像就被设置为左环绕方式,同样,如果选“右”,图像就被设置为右环绕方式。(3)编辑图像大小:在Dreamweaver cs3中,当在网页中加入一幅图像后,图像大小默认设置为其原来的大小,如果加入的图像太大或太小,或有其他特别需要,就得调整图像的大小。调整图像大小非常简单灵活,只要你选中加入的图像,用鼠标左键拖动图像边框,可任意调整图像的宽度和高度直到达到你满意的尺寸。(4)设置图像缩放比例:网页设计的一个重要原则就是网页的兼容性,对于不同的浏览器或者不同的分辨率,不管是800×600的窗口,还是1024×768的窗口,网页都要能正常的显示。设置图像缩放比例就是将图像设置为大小可以按比例变化,与浏览器的大小成一固定比例,这样在不同大小的浏览器窗口里图像都能正常的显示外观。5详细设计1、设计登陆界面图1登陆界面2、设计首页界面图2首页界面3、设计仙剑四界面图3仙剑四界面4、设计主要人物界面图4主要人物界面5、设计精选壁纸界面图5精选壁纸界面6、动画选播界面图6动画选播界面6总结通过这次设计,和SQLServer技术在应用有了更深一层的认识和应用。网站的建设中可能会遇到一些意想不到的难题,我会在以后的学习和工作中会做进一步的学习和探索,以取得更大的进步。我非常感谢学校给了我这次制作网页的机会,通过这次实训,我学到了很多有价值的东西。我独立的完成了网站设计的全过程,把设计中散乱的网页链接成框架体系,使平时学到的知识点有了很高的提高,并且合理的在试验中进行了实践。在这次实验的过程中,我搜集了大量的素材和网页设计的技术技巧方面的书,扩大了知识面,给我在以后的设计过程中能博采众长,制作出好的网页打下了基础。其次,我现在已经掌握文档排版标记的使用熟练使用及其属性设置、特殊符号;我现在已经熟练使用超级链接,合理使用列表。最后,我感受最深的是:要想做好一个网站,素材和技能都十分重要。好的素材需要多方查找资料,可以从图书、网站和新闻上查找。好的技能需要不断的实践,经常做练习、做网页。如果拥有好的素材和精湛的技能就可以