网页制作课程总结
1《网页制作》课程总结
一、本课程开设目的,要求与课程教学的实施
1.课程设置的目的和要求。
本课程属电子商务专业专业必修课,旨在向学生传授网页制作的基本方法和技能,培养学生应用计算机进行网页制作的能力,为其进一步学习和应用电子商务技能打下专业基础。
计算机文化基础课程教学的基本任务是:
(1)学习具备网页素材编辑和管理的能力,牢牢树立信息的管理意识。
(2)学习图片处理的基本技能,能够根据需要处理和使用各种图片素材。
(3)掌握动画制作的基本原理,并能制作出简单的动画,具备进一步提高动画设计的能力。
(4)掌握网页设计三剑客,能熟练运用三剑客创建站点和建设静态页面网站。
(5)树立正确的科学态度和严谨的治学精神,学习在信息社会中生存和交流的规则与方式,自觉维护在与信息处理有关活动中的公共秩序,尊重知识产权。
2.课程教学的实施
《网页设计》安排每周4节课时,总学时为72学时。所上的班级是06电子商务1、2、3班。根据教学内容和三个班的学生实际情况,我制定出以下的教学计划:
在这个过程中,先后安排了八章内容的实例教学。通过实例教学收到了良好的效果。同时也存在着实例占用时间太多,以至于基础知识点讲解不够深入。这些都是以后进行《网页制作》教学的宝贵经验。
三、教材说明
本课程教材主要选用余强编著的《网页设计-----三合一教程》。这本书不仅分别讲述了3种软件的使用方法,还将这3个软件融会贯通,相互配合使用。是一本培训教程,主要目的是提高学习效率,以最短的时间掌握最多的技术。但通过一学期的教学,我发现本书并不是一本很好的教材,所以我先后补充了六大实例网页的制作给学生。学生接受得比较慢,但实际操作能力却得到了极大的加强。
五、课程考核
学生的课程学习成绩应是综合的,它包括有平时成绩(如学习态度,回答问题,课堂笔记等),作业成绩,实验成绩以及最终考试考核成绩等。我们对学生的平时作业都做有记载,进行上课考勤,记载实验成绩,这样可比较公平合理地对每个同学的成绩进行综合,促使学生认真作业,实验和注意课后复习巩固,以提高学习成效。
《网页设计》的课程考核成绩所占比例如下:
总评=平时成绩40%+试卷考核60%。
本门课程我教的是06三年电子商务1、2、3班。
其中1班
最高分80,最低分0,平均分61.55分,及格率为77%
2班
最高分80,最低分0,平均分57.69分,及格率为84%
3班
最高分85,最低分0,平均分56分,及格率为81%
注:没做的学生或没有上交成功的学生得0分
教学效果还是比较好的,但是我还是很不满意,因为学生对于网页设计的能力还没有真正的挖掘出来。我认为在以后教学环节中应当把新教学改革的理念贯穿到每一个教学环节中,才能把学生的学习激情真正调动起来。我还建议把该课程由一学期改为一学年,让学生有充分的时间进行网页设计的综合运用。
从《网页设计》课程的教学情况和考核情况中,我有以下几点体会:
1.以后练习中一定要强调科学的练习方法,培养学生的时间观念。
2.教学过程中应注意细节,并且培养学生独立思考问题的习惯。
3.在平时的操作题讲解中要注重学生的应变能力。
4.考试前要进行考试环境的培训。
5.老师不能为学生承担太多,要让学生自己去完成知识的积累过程。
6.作为一个设计者就要有各方面的素质和能力,这就要求老师要具备多方面的知识和能力。
7.教学知识的传递是老师的责任,但是更关键的是培养学生如何对待知识。老师不仅要把平时的讲堂调动起来,更要把课堂变为学生知识观、人生观、对人对事对物科学的态度方法的培养基地。
2网站设计与制作课程总结
我是一名电脑爱好者。进入大学里的条第一门公选课,我选择了《网站设计与制作》这门课程,出于对网站设计的强烈的兴趣,抱着强大的求知欲,终于,我进入这门课程的学习。虽然这门课程的总学时比较短,但是经过老师的认真授课以及我的认真听讲,我学到了很多有关网站设计与制作的知识,在一定程度上为我认识了解网站设计与制作提供了良好的基础,并为我下一步深入学习相关方面的知识做了良好的铺垫。
一、网站设计与制作中所用的工具
1.dreamweaver用与编辑HTML、ASP、JSP、PHP时的辅助工具。
2.flash网页需要画面流动时的首选择
3.photoshop图象处理软件,一般网页都需要有图片相搭配,photoshop是款很强大的工具。
4.fireworks跟Photoshop一样都是图象处理软件,但fireworks偏向与对网页的处理。
二、网站的概念与域名
网站是指在因特网上,根据一定的规则,使用HTML等工具制作的用于展示特定内容的相关网页的集合。人们可以通过网站来发布自己想要公开的资讯,或者利用网站来提供相关的网络服务。人们可以通过浏览器来访问网站,获取自己需要的资讯或者享受网络服务。文字与图片是构成一个网页的两个最基本的元素。除此之外,网页的元素还包括动画、音乐、程序等等。域名是网站在互联网上的名字。一个非产品推销的纯信息服务网站,其所有建设的价值,都凝结在其网站域名之上。失去这个域名,所有前期工作就将全部落空要把域名起得形象、简单、易记。。
三、网页的制作与网站版式
根据这几节课的学习,我基本了解了要想做好一个网站,就必须把网页做好。
首先,要明确所做网站是什么类型的。其次是布局,还有网站的信息、网站打开的速度等。
(1)、网站的整体布局:网站主页就好象是宣传栏或者店面——对访问者产生第一印象,都希望尽量给人留下好的印象。网页应该力求抓住而不是淹没浏览者的注意力,过多的闪烁、色彩、下拉菜单框、图片等会让访问者无所适从,一般来说,好的网站应该给人有这样的感觉:干净整洁;条理清楚;专业水准;引人入胜。
(2)、信息:无论商业站点还是个人主页,你必须给人们提供有一定价值的内容才能留住访问者,所以你必须提供某些有价值的东西。
(3)、打开速度:我们都知道,页面下载速度是网站留住访问者的关键因素,如果20—30秒还不能打开一个网页,一般人就会没有耐心。至少应该确保主页速度尽可能快,最好不要用大的图片。
(4)、颜色搭配:颜色也是影响网页的重要因素,不同的颜色对人的感觉有不同的影响,所以在做网页的时候应该注意颜色的搭配。包括网页的整体的颜色、网页中文字的颜色等。不要将所有颜色都用到,尽量控制在三至五种色彩以内。
(5)、网站的版式设计:网页设计作为一种视觉语言,特别讲究编排和布局,虽然主页的设计不等同于平面设计,但它们有许多相近之处。版式设计通过文字图形的空间组合,表达出和谐与美。多页面站点页面的编排设计要求把页面之间的有机联系反映出来,特别要处理好页面之间和页面内的秩序与内容的关系。为了达到最佳的视觉表现效果,我们将反复推敲整体布局的合理性,使浏览者有一个流畅的视觉体验。
(6)、网页标题的可读性:必须尽量使你的网页易于阅读。为所有标题和副标题设置同一字体,并将标题字体加大一号,所有标题和副标题都采用粗体,这样便于识别标题,使浏览者一眼就可以看到要点,以便找出并继续阅读有兴趣的内容。所以,要认真写好每个标题!
四、HTML语言
虽然课程比较短暂,但老师还是在讲课中穿插了一点HIML语言,它在网页制作中也发挥了比较重要的作用,可以大大提高网页制作的效率。虽然,我不是计算机专业的,但作为一个电脑爱好者我会在课后抽时间认真去学习掌握这门语言,让自己具备更专业的知识。
总而言之,经过对《网站设计与制作》这门课程的学习,我收获了很多。我所学的专业并不是计算机方面的,更别说是网页设计了,但是由于我对网页设计及制作的强烈兴趣,我选择这门课程是我最大的乐趣,因为我学到了知识。并且我今后会继续在这方面提高自己,全面提高,综合发展。
在这里我很感谢老师的认真授课,让我对这门课有了初步的了解,学到了很多关于这方面的知识。最后我想说句谢谢老师!
3网页制作课程设计总结
1.设计目的
阐述该网站的设计意图和创意,简单介绍网站。
2.设计思想
阐述网站的整体设计思想,包括:
2.1网站整体结构规划思想
要求阐述网站整体结构的选择、设计的思想,绘制网站结构草图。
2.2主页设计思想
要求对主页的布局思路进行阐述和分析。
2.3子页的设计思想
要求对子页的设计以及网页对象的选取思路进行阐述和分析。
3网页详细设计分析
要求选取一张网页,对网页的设计实现过程进行阐述和分析,详细说明制作该网页的步骤,所使用的网页对象以及该网页对象的操作方法。
4结论
对整个设计报告做归纳性总结,并分析设计过程中的困难及如何解决的,最后提出展望。
一、设计目的
本课程的设计目的是通过实践使同学们经历Dreamweaver8开发的全过程和受到一次综合训练,以便能较全面地理解、掌握和综合运用所学的知识。结合具体的开发案例,理解并初步掌握运用Dreamweaver8可视化开发工具进行网页开发的方法;了解网页设计制作过程。通过设计达到掌握网页设计、制作的技巧。了解和熟悉网页设计的基础知识和实现技巧。根据题目的要求,给出网页设计方案,可以按要求,利用合适图文素材设计制作符合要求的网页设计作品。熟练掌握Photoshop8、Dreamweaver8等软件的的操作和应用。增强动手实践能力,进一步加强自身综合素质。我本次主要是设计的一“新加坡之旅”为主题的网页,针对新加坡的美丽风景做了介绍。
二、设计思想
利用Dreamweaver8.0制作一个关于“新加坡之旅”的网站,利用表格、行为、层和链接等网页设计技术设计页面。
本网站以新加坡旅游为素材,主要讲解了与新加坡景点相关的内容。首页设风景介绍和风景欣赏两个栏目。景点介绍设7个栏目,风景欣赏只含一个页面。
三、网页详细设计分析
(一)建立布局
在这次的网页设计中用到大量的布局,所以怎么样建立布局是关键。Dreamweaver8是大多数人设计网页的称手兵器,也是众多入门者的捷径。特别是其在布局方面的出色表现,更受青睐网页制作课程设计总结网页制作课程设计总结。大家都知道,没有表格的帮助,很难组织出一个协调合理的页面。
1.点击“ALT+F6”键,进入布局模式,插入布局表格。建立一个大概的布局。
2.使用背景图片:选中该项,按浏览可以插入一幅准备好的图片作为表格的背景,因为图片是以平铺的形式作为表格背景,所以表格大小和图片尺寸都要控制好。
(二)网页中的图像
图像传输是WWW的真正魅力所在,它与文字相比具有显著的优点:一是直观,人眼观看图像时接受信息的速度远远超过观看文字时接受信息的速度;二是能更清楚地表达细节内容。正是由于这些优点,所以在进行网页设计时图像很受欢迎。如果网页做得像一幅风景画,浏览者一定会流连忘返(如果图片很大,效果会适得其反)。图像文件的格式有几十种,如GIF、JPEG、BMP、EPS、PCX、PNG、FAS、TGA、TIFF、WMF等,现在InternetExplorer和Netscape支持的、最常用的图像格式是GIF、JPEG和BMP。
(1)在网页中插入图像
利用Dreamweaver8可以方便地在网页中插入图像,还可以设置图像边框、大小、和位置,并且可以直接对图像进行编辑。在网页中加入图像的操作非常简单:
1.新建一个空白网页,把光标定位在网页的开始位置。
2.打开“工具”菜单,选择“图片”菜单项,在子菜单中选择“来自文件”菜单项,或者单击工具栏中的图片工具图标,弹出一个“图片”对话框。
3.在此对话框中单击“浏览”按钮,出现一个“选择文件”对话框。
4.在“选择文件”对话框的文件列表中选择某个图像文件,然后单击“确定”按钮,或直接双击该图像文件,该图像即被加入到网页中。在网页中插入图像后我们就可以对图像的各种属性进行设置了。
(2)图像的各种属性设置
1.选中所插入的图片,单击鼠标右键,弹出一个快捷菜单,在菜单中选择“图片属性”菜单项,出现一个“图片属性”对话框.
2.打开“外观”选项卡。
(1)设定图像边框粗细:在“外观”选项卡的“布局”栏里可以根据需要定义图像的边框,也可以定义边框值为“0”,即无边框。
(2)设置图像环绕方式:一般情况下一幅图像只能与一行文字处在同一高度,但有时需要将图像和文字分开,且两者互不影响。比如在网页左边插入一幅图像,要求右边的文字就像没有图像时可以多行输入,这就要通过设置图像的环绕方式来实现。在网页中图像的环绕方式有两种:
①左环绕:图像在左边,文本在图像的右边进行环绕。
②右环绕:图像在右边,文本在图像的左边进行环绕。
在“外观”选项卡的“布局”栏中打开“对齐方式”下拉列表框,选择“左”选项,并单击“确定”按钮,图像就被设置为左环绕方式,同样,如果选“右”,图像就被设置为右环绕方式。
(3)编辑图像大小:在Dreamweaver8中,当在网页中加入一幅图像后,图像大小默认设置为其原来的大小,如果加入的图像太大或太小,或有其他特别需要,就得调整图像的大小。调整图像大小非常简单灵活,只要你选中加入的图像,用鼠标左键拖动图像边框,可任意调整图像的宽度和高度直到达到你满意的尺寸。
(4)设置图像缩放比例:网页设计的一个重要原则就是网页的兼容性,对于不同的浏览器或者不同的分辨率,不管是800×600的窗口,还是1024×768的窗口,网页都要能正常的显示。设置图像缩放比例就是将图像设置为大小可以按比例变化,与浏览器的大小成一固定比例,这样在不同大小的浏览器窗口里图像都能正常的显示外观。设置图像缩放比例的步骤如下:
1.选中网页中的图像,单击鼠标右键,在弹出的快捷菜单里,选择“图像属性”菜单项,弹出一个“图像属性”对话框.
2.在“大小”栏中选中“指定大小”复选框,同时选中“宽度”和“高度”下面的“百分比”单选按钮,然后在“宽度”和“高度”栏里输入想显示的比例,单击“确定”完成设置。外还可以在“外观”选项卡的“水平间距”和“垂直间距”栏里进行设置,水平间距是指图像与周围元素在水平方向的间距,以象素为单位;垂直间距指图像与周围元素在垂直方向的间距。
(3)怎样编辑网页中的图像
在Dreamweaver8中,可以使用“图片”工具栏中的各种工具对网页中的图像进行编辑,编辑功能主要有:图像旋转和翻转、剪裁、图像淡化、凹凸效果等等。
另外,为了使图片更符合要求,我们还在photoshop8中队所用的图片进行了处理,使得图片看起来更加精细美观,符合我们的主题要求。
(4)使用背景图像
使用背景图像与使用背景色不同,使用背景色只将网页的背景用某种颜色填充,而使用背景图像则是将网页的背景用图像平铺。这样做可以使制作的网页更美观好看。网页中使用背景图像的具体步骤如下:
1.新建一个空白网页网页制作课程设计总结网页程序设计。
2.单击鼠标右键,弹出的快捷菜单里选“网页属性”,弹出“网页属性”对话框.
3.开“背景”选项卡。
4.在“背景”选项卡的“格式”栏中选中“背景图片”复选框,然后单击下面的“浏览”按钮,出现一个“选择背景图片”对话框。
5.在“选择背景图像”对话框中单击“浏览文件”按钮,出现一个“选择文件”对话框。
6.在“选择文件”对话框的文件列表中选择图像文件,单击“确定”按钮。
这样,所选图片将作为整个网页的背景,如果在第4步时同时选中“水印”复选框,背景图片将显示为特殊的水印效果,当网页滚动时,背景不动,只有网页内容滚动,产生一种透明层的效果,非常吸引人
(5)插入flash动画
关于Flash视频使用Dreamweaver中的“插入Flash视频”命令,可将Flash视频内容插入Web页面,而无需使用Flash创作工具。该命令可以插入Flash组件;当您在浏览器中查看它时,它显示所选择的Flash视频内容以及一组播放控件。
(6)设置鼠标经过图片,进行图片交互
再插入图片的下拉菜单中有一项是“鼠标经过”,点击这一项,会弹出一个对话框,在对话框中可以设置鼠标经过前的图片和经过时的图片,选择“确定”即可。
(7)设置链接
选中图片或者文字,在下面的链接属性中输入所要连接到的地址,同时,下方的目标属性被激活,输入blank设置成在新窗口中打开网页。我们设置了链接本站点的网页页面,同时也连接了外网,使得大家访问页面时能够查询更多详细的信息,方便用户查询。
4关于动态网页设计与制作总结
在开始学动态网页设计与制作时,接触了一款软件就是DreamweaverCS4第一章首先接触了HTML基础,HTML是制作网页的最基本语言。HTML文档包括标签、元素、属性。
第二章学到CSS基础,CSS就是用于有效的设计和实现网页排版布局的一组描述或定义。CSS通过“样式”来表示网页的颜色、字体、背景色、边线框及网页内容的位置及大小尺寸等属性。
第三章是CSS实用技巧,CSS用于网页布局设计较为重要部分:
1.用div元素划分各个区域,如标题广告区、导向菜单区、主要内容区等。
2.定义这些区域的样式表,其中主要内容区的宽度会随着屏幕宽度的变化而改变,这样可以有效地利用屏幕上的空间。
3.定义每个区域中块状元素的间距和边框。
4.定义每个区域的背景色、字体颜色、边线框。
第四章是ja