首页 优秀范文 网页制作与设计

网页制作与设计赏析八篇

时间:2023-05-28 09:40:18

网页制作与设计

网页制作与设计第1篇

【关键词】Web标准;电子商务网站;设计与制作策略;分析

前言

互联网技术的推广与发展进程不断加快,对人们的日常生活与工作各方面都产生了重要影响。网页的设计与制作随着网络技术、科技水平的发展受到人们的高度重视,其主要是将网络作为主要载体,将各种信息以更加快捷、方便的形式传达给人们。根据相关数据统计显示,从事网页设计制作的人员达到了300万之多,但在网页设计发展过程中还存在诸多问题,因此应突破网页结构单一、空洞等问题才能将网页的设计与制作水平进一步提升[1]。

1Web标准技术概述

1.1Web标准内涵

Web标准不仅仅作为标准,其主要是对一系列标准进行组合。一般的网页中主要由结构、行为、表现三部分共同组成,并与XML、XHTML相对应,表现对应的标准可以将其成为CSS。1.1.1结构在结构中主要的技术可包含拓展超文本标记语言与可拓展标记语言,在网站王者设计中主要将其应用在网页数据分类以及整合方面。在两个标准中,XML的表现形式为源语言,其主要是让用户字自身的语言进行标记与重新定义,具备较强的数据转换功能。1.1.2行为在Web标准的行为中,主要包含ECMAScript[2]与对象模型。其在网页设计与制作中主要可以应用在交互式的操作网页文档方面。其可以将界面上操作对象实施的交互操作有效实施,利用DOM可对对象有效定义与修改,还可将对象之间存在的各种关系有效处理。1.1.3表现其中最主要的技术便是CSS,通常人们将其成为层叠样式表,在网站网页设计中可应用改在控制浏览器的显示方面,其也是决定网页设计风格的主要因素。

1.2基于Web标准前提下的网页设计流程(略)

2基于Web标准标准的电子商务网页设计与制作流程

在基于Web标准进行电子商务网站网页设计的过程中,主要包含内容分析、结构设计、方案设计三部分。在进行布局设计的过程中,可利用XHTML与CSS对页面进行合理布局,可实现网页布局的目标。在进行设局实际过程中,可利用CSS与美工设计元素互相结合,将设计方法转化为最终的网页。

2.1内容分析

网页设计作为视觉语言的主要表达方式,应进行合理的编排与布局,从而确保网页的布局更加清晰、合理、内容充实。在进行网页版面布局的过程中,应将网页设计的更加醒目,使用户在使用过程中对各项功能一目了然,其他部分的版面设计应与主页的风格保持一致。较为常见的布局模式包括国字型、厂字型等。本文将以汽车用品为主的销售网站作为案例分析,由于汽车商品类型多样[3],在设计网页过程中,应将商品的导航以及产品展示作为重点。案例中采用的网页布局为框架型布局方式,可将页面分成各种模块。在网页左边为纵向的导航栏,右边则为商品的展示栏。在网页底部呈现了网站的基本信息与商家的联系方式等信息。在网页模板的顶部与底部都会出现在每一个网页的同一位置中。

2.2结构设计策略

在对汽车销售网站进行网页开发过程中,可将其乘坐为模板,将其抽象地分为不同区块,其中包含核心流程业务模块、展示功能模块等。在将模块开发完成后便可投入使用。在用户浏览、操作网页的过程中,程序员可通过后台进行可视化的管理与操作,用户可以将不同的模块进行拖放配置,构建个性化的网页布局设计,方便用户的使用与浏览。用户在操作汽车销售网页过程中,其中的框架作为页面的骨架,决定了页面的整体布局与模块摆放区域。框架通常采用的是HTML文件,其主要为了将页面进行区分,还会在适当的位置对模块进行放置,可用<{widgets}>代码进行表示,方便用户在使用过程中利用可视化编辑将模块进行合理配置。对于板块区来说,其能将汽车销售网站最为个性的地方进行呈现,可利用模块内容将网页的更新实现,在网页页面中的各个模块都有指定的ID,模块的区域能呈现竖向摆放的形式,或呈现多个商品内容。模块为独立形态,可对不同的边框进行切换,从而将呈现样式进行改变。在网页模块的顶部与底部都会出现在各个网页中的同一个位置,对于任何电子商务网站来说,应将网站顶部合理设计,才能拥有功能完善、结构清晰的网站顶部,从而提升网站的效益。

3结语

基于Web标准对电子商务网站网页进行设计与制作,可促进电子商务网站的运作效率,为用户提供巨大的便利,从而促进网站的使用效率与综合收益,还可提升电子商务网站的运行效率与性能。

参考文献

[1]朱淑琴,魏威,张嘉萌.基于Web标准的电子商务网站网页设计与制作[J].计算机与现代化,2012,03:106~109.

[2]王亚辉.Web标准的电子商务网站网页设计研究[J].电子商务,2015,05:49+82.

网页制作与设计第2篇

关健词:网页设计;教学方法;特点分析

《网页设计与制作》是近年来计算机专业领域发展最快和应用最广泛的课程之一,社会的发展也急需计算机网页设计、面向不同应用层次的专业人才。但就是这样一门看似简单好学的技能课程,却往往得不到很好的教学效果。常常是在学生学过之后,不是不能独立地进行网站规划和页面设计,就是设计达不到应有的功能效果和视觉效果。为此,我在《网页设计与制作》课程的教学过程中,对教学内容、教学方法、教学手段等进行了长期的研究和实践,收到了非常好的效果。

一、课程的特点分析

《网页设计与制作》这门课是在学习了专业基础课之后的一门专业课,该课程的教学实践性较强,在教学中要极大的激发学生的参与性,锻炼学生的动手能力,培养学生的专业兴趣。注意引导学生学习理论与实践相结合,将理论应用于实践。这门课的典型特点是:易学易忘。所以在教材上我选用的是北京交通大学出版社出版的《网页设计与制作》。这本教材主要介绍利用Flash、Fireworks 、Dreamweaver制作网页元素并将网页元素制作成大型网站的过程。这本书深入浅出,图文并茂,采用大量直观、生动、实用的网页制作实例帮助学生理解。

二、课程的教学方法

(一)课前认真备课,选好实例。

网页制作技术不断地发展变化,新的技术、新的方法也在不断涌现,所以我们也需要将网页设计的最新、最实用的技术引用到课堂上去。课堂教学是传授知识的主要方式和场所,目的在于将书本知识转化为学生的知识和技能。为实现这一目的,我深入钻研教材,理清教材内容特点、编排次序和知识点之间的衔接关系,整理出一条条线索。如在上第一节课时,我会从网上下载一些经典的并具有代表性的网页给同学欣赏,在看的过程中一一的介绍并分解到书本的各个章节的知识点,提高学生们的兴趣与积极性。

(二)课堂的教学方法。

教学过程是教师与学生之间信息传递及反馈的过程。“我认为教学的艺术不在于传授本领,而在于激励、唤醒、鼓舞。”因此,在学习过程中,给学生明确的思路,激励学生积极主动参与思考,运用任务驱动法、模块教学法,案例教学法和项目教学法等教学手段,引导他们在解决问题的过程中体验到学习带来的成功感和愉悦感,使学习兴趣长久地保持下去。

1.任务驱动法。

“任务驱动”教学法是一种以学生自主学习,教师加以引导的一种教学方法。它打破了传统教学方法中注重学习的循序渐进和积累的老套路,不再按照教学内容的从易到难的顺序,而是以完成一个“任务”作为驱动来进行教学,完成教学任务。在教学过程中,以若干个具体任务为中心,通过完成任务的过程,介绍和学习基本知识和技能,培养学生的自学能力、创新精神和合作意识。学生在上机实践时,我会布置与课程相关联的小任务,那么这些任务都是学生感兴趣的,要有浓烈的生活气息,让学生在密切联系学习、生活经验和社会实际的情境中去完成。

2.模块教学法。

模块式教学(简称MES)是国际劳工组织在20世纪70年代开发出来的一种较为先进的培训模式。它是在深入分析每个职业(工种)和技能的基础上,严格按照工作标准(岗位规范),将教学大纲和教材开发成不同的教学模块,形成类似积木组合式的教学方式。

根据教材与教学的特点,将整个教学内容分为三个阶段,第一阶段使学生熟悉并熟练使用网页制作工具Dreamweaver8.0;第二阶段在网页制作过程中利用Flash制作动画;第三阶段在网页制作过程中利用Fireworks进行图片处理。每一阶段因材施教,分层次教学,提高模块化教学效果。每一阶段的教学内容完成后,在专业机房组织单元考核,以实现分阶段达标,最终使学生能独立设计小型WEB站点。

3.案例教学法。

案例教学法,即在教师指导下,根据教学目标的内容的需要,采用案例组织学生进行学习、研究、锻炼能力的方法。案例教学法可分为案例导入、案例例证、案例讨论、案例结尾和案例练习等多种方法。

在课堂上我采用是案例例证法,通过精心挑选案例,明确提出需要掌握的知识点及操作技能,以案例带动知识点,贯穿整个教学过程。具体做法是通过具体案例提出任务,将任务分解到每次的课堂教学中实现,教学过程中为了调动学生的学习积极性,教学过程中常常采用互动方式,即老师提出一种解决问题的思路,然后让学生采用其他方式来解决同一个问题。

4.项目教学法。

项目教学法是指通过实施一个完整的项目工作而进行的教学活动,采取小组讨论、协作学习的方式。

将课程中的各个知识点或技术点采用教师给出项目要求或参考项目需求的方式,让学生分组选择项目或者自己调研确定项目,小组合作进行项目规划和页面设计。通过“小组合作规划设计”,以“项目小组”为基本形式、小组成员之间的合作性活动为主体、完成小组项目为主要目标、小组整体水平为主要依据来评定成绩的考核形式,为学生创造一个良好的合作氛围。小组的每一个成员在这一过程中都有发挥自己优势和表现自己的机会,通过小组成员之间相互讨论、评价、反馈、倾听、激励以及互为师生、优势互补等合作形式,激发学生的学习兴趣,改进学生的学习方法与态度,增强学生的集体荣誉感和团队协作精神。

网页制作与设计第3篇

关键词网页设计与制作网站网页中图分类号:G712文献标识码:A

1 技术与艺术的争论

“网页设计与制作”从课程的名字看,我们要对网页设计与制作进行反思,它到底是艺术问题还是技术问题?

互联网已经与当今的我们息息相关,网页的设计与制作过程一直伴随着技术和艺术的争论。为此,我们有必要在开课前就让我们的学生明确:在网页设计与制作过程中,到底是技术重要还是艺术重要?还是两者都重要?

在教学过程中,我们要不断地提醒学生反思以下几个问题:(1) 网页设计与制作是为谁做的?(2) 谁会来看你的网站?(3) 网页设计仅仅是能看就行吗?(4) 如何考虑受众更多地和更有效率地接受网页上的信息?(5) 网页设计与网页制作有区别吗?(6) 技术和艺术如何更好地服务于网站?

作为课程的教学者和学习者,需要大家都可以作为一个技术和艺术的全能者,虽然我们每个人在各个方面都有所侧重,但只有很好地在设计与制作过程中,多些反思技术与艺术的问题,才能避免我们偏离网页设计与制作的初衷。

在教学过程中,教师要不断地提醒学生反思这个部分的技术在他的网站作品中是否用到?千万别因为让学生为了炫耀技术而采用多种风格的动画,添加少美感或与主题完全不相关的东西。别因为大量的技术使用加重了浏览器的负担,浏览器受带宽的限制,要学会为浏览器减负。

2 网站与网页的分合

教师在讲课中也许会混用网站和网页,但是在设计与制作过程中,教师必须让学生对这两者有所共识:网页是一种可以在互联网上传输,能被浏览器认识和翻译成页面并显示出来的文件,网页是网站的基本构成元素。网站也叫做站点,是提供各种服务和信息的基地。

学生可以深入区分开两者的异同之后,需要养成先建立站点,之后再在此基础上创建网站所需的相关文档的习惯。

3 实用性与艺术性的思辨

网站的定位,对于网站的设计与制作有很大的影响,如何权衡网站的实用性和艺术性?也许我们要考量的有很多。网站的实用性和功能性固然重要,但不要忘记提升它的艺术高度。如何避免用教条的、形式化的方式设计网页,作品给人一种像是一个模子印出来的感觉。教师在教授学生模板使用的同时,也要提醒我们的学生,别因为使用了免费模板而自鸣得意,那些真正好的网页设计绝不是在免费模板的制作上而停步不前,一定是那些懂得如何发挥自身的创意思考,来积极创作属于自己风格,又能很好地宣传自己的网站的人才是真正的设计者。

4 系统性与适应性的融合

高职教学强调项目化教学模式和基于工作过程的教学法,如何让学生在把握基于工作流程的任务化项目式教学中,可以更加全面地适应当今不断变化的技术?从知识的整体性来看,也就是如何保证在工作过程中,他们学习到的知识内容的完整性、适应性和迁移性?

针对对高职学生技术技能型目标的定位,我们更多地需要不断为项目中加入挑战与扩展训练的模块来提高学生知识的完善性,弥补我们在项目化教学过程中的那些知识的缺陷,可能带给学生在今后工作发展中的盲目和无助感,也更好地拓展学生的独立思考和发散性思维能力。

在网站的信息结构方面,国外有信息结构专家,网站由信息结构设计师与网站创意设计师共同探讨、协作完成。国内网站策划由专业的市场行销、策划人员来做。面对刚刚学习此门课程的学生,这种网站的总体设计是需要他们学完本门课程之后才能具备,但怎么能在此时就让他们具备此方面的总体设计能力,需要学生搜集和分析与自己设计的网站相同类型的网站的相关导航和网站的栏目来获得,也在此基础上来揭开网站的总体设计环节,当然,也需要培养学生不断地适应修改完善现有的网站,不断明细网站的定位。

5 过程性与结果性的统一

每一个网站的开发必然经过一定的工作过程,才能完成整个站点的,从网站需求分析、总体设计、模板设计、首页设计、子页面设计、测试到设计总结,在我们的教学中如何以一个完整的项目为依托,而又同时指导学生完成自我开发的个性化的网站任务,是网页设计与制作课程需要解决的问题。

在教学过程中,学生也需要走从欣赏、模仿到创作的过程。教师需要通过案例教学,将一个个美观大方的网页呈献给学生,带领他们分析网页中的相关内容而开始每次课程的学生,让学生不断地发现其中的奥妙。引导学生学会模仿网页的整体布局,网页的LOGO设计,通过大量的模仿练习不断提炼,最终确定适合自己设计的网站的相关内容设计。

6 职业素养与职业能力的协调

很多人对网页设计师这个职业的质疑:他们仅仅是比平面设计师多懂点代码,比程序员多懂点设计,有时候他们还会搞点动画?仅仅如此吗?在国内的网页设计师,更多兼任着设计与制作两个方面的任务,尤其是对于中小型企业来说,更是如此。为了能够更好地在教学中通过项目、案例等内容来培养学生的职业能力,适应大中型与小型企业的需求。也不得不要求我们在全能中培养专才,在专才中注入全能的思想。从开始的网站策划阶段,培养学生的资料搜集能力,整理归纳能力。在网页设计布局阶段,不断地发挥学生的创新能力,自我发展与感悟能力。在网站的测试阶段,教师引导学生再次审视自己最初的规划目标是否真的实现了?达到最终的分析总结反思能力。

7 结论

高职《网页设计与制作》教学中,只有教师从多角度对课程内容和教学方法的思考,才能更好地引导学生的学习过程,也才能更有利于对于学生问题思考能力、职业技术和职业技能的培养与提升。

参考文献

[1]孙东梅. Dreamweaver完全实用手册[M].电子工业出版社,2011:3-4.

网页制作与设计第4篇

【关键词】网页设计;制作;学生能力;培养

随着互联网的发展和普及,网页设计和制作技术成为网络时代非常实用的技术,这一课程也成为学校开设的热门课程。无论是计算机专业的学生还是非计算机专业的学生,网页制作都成了一门重要的基础性技术课程。但是很多学校在教学中采用传统的教学模式,导致学生的学习积极性不高,实际动手能力也比较差,为了让学生快速的掌握网页设计和制作的技术,需要采用一些新型的教学方法实施教学,加强学生综合能力地培养。

1加强学生创新能力的培养

创新是一个民族的灵魂和动力,同时也是当今社会竞争的核心。学生创新能力的提升和创新意识的增强对于他们以后的发展具有非常重要的作用。网页设计与制作教学作为新时期教学的主要课程,在教学中培养学生的创新能力有利于促进整体教学的发展。因此,在教学中,可以通过多方面内容加强学生创新能力的培养,首先,可以通过兴趣教学法唤醒学生的求知欲望,兴趣是能够推动学生求知的内在力量,学生只有对某一学科充满兴趣,才能够持续的钻研该学科知识,从而增强学生的学习效率。在教学中,为了增强学生对网页设计和制作的兴趣,教师可以在上课时准备一些网页作品,让学生对作品进行点评,然后提出改造的意见。让学生在头脑中对网页设计有一个模糊的认识,产生做网站的想法,这样一来,通过教师的指导就能够让学生梳理一个成型的站点框架,紧接着引导学生如何做网页,如何使用工具,学生对这些内容产生兴趣,就会带着教师提出的问题进行主动探索和学习,以此增强学生的学习效果。除此之外,还可以通过精品赏析的方式增强学生的学习灵感。网页设计和制作课程是一门艺术和艺术相结合的课程,学生不仅要掌握基本的网页制作技巧,还要具备欣赏美和创造美的能力。创造的来源是灵感,而灵感的来源则是通过观察,因此,可以在教学中设计精品赏析的环节,利用上课之前的时间展示作品,向学生展示一些布局合理,设计新颖的精美网页,让学生对这些网页进行观察和欣赏,这样不仅可以拓宽学生的视野,同时还能激发学生的创造灵感,为学生以后设计出精美的作品奠定基础。

2培养学生的网页制作综合能力

在学生掌握网页设计和制作的基本知识之后,网页制作综合能力的培养就显得非常重要了。即使学生掌握了网页制作技术,也不一定能够设计出好的网站,只有提升学生的综合能力,加强对他们所掌握知识的综合应用,才能够设计出一个精美的网站。为此,需要注重学生在实践方面的能力培养,可以从教学实验方面入手,将所有的理论教学和实验教学都安排在计算机机房完成,可以让学生在学习理论知识之后直接进入实践探索阶段。此外,为了给学生提供更好的实践机会,可在学校建立计算机基础教学网,网页设计和制作教学的老师可以建立自己的教学网站,同时给学生分配相应的网站空间,要求学生建立自己的个人网站主页,然后将自己的实践作业上传到网站空间中,设计的风格和主题不受限制,网站主页的内容也不做要求,学生可以根据自己的兴趣进行网页的制作,将所学习的网页制作技术灵活的运用到个人网页的设计中,做好个人网站。为了让学生在网站设计中学会创新,教师可以搜集一些具有创意的网站和网页设计的素材,和学生一起分享,然后与学生所做的网站进行对比,从而提升学生的创新能力。在网站设计中,针对不同的设计环节,学生可以自己发现设计中存在的问题,然后进行分析和解决,对于学生综合能力的培养具有很大的帮助。

3加强培养学生的团队协作能力

现在社会的分工越来越细,很多工作都需要人们协助完成,这样以来,团队精神就显得格外重要。协同合作是团队精神的核心内容,尊重个人的兴趣和成就是团队协作的基础。就学生而言,独立意识较强,现代的学生比较自我,沟通能力也有待提升,这些缺陷显然不适合学生未来的工作。网页设计和制作教学是一门实践性要求较高的课程,同时也对学生的团队协作能力要求很高。在教学中的综合实训中可以选择采取项目教学法实施教学,将学生分成不同的小组,在自愿的基础上进行强弱搭配,并且每一个小组推荐一位组长,在老师布置任务之后,组长可以做好小组内的分工,让学生能各司其职,然后合力完成作品的设计和制作。在作品制作中,如果组内的成员存在意见不同意的现状,组长可以和其他的成员进行沟通协调,最后达成一致,当组员能够为同一个目标一起努力时,无论最后的结果如何,学生最后都会有成就感。在这一过程中,有利于提升学生的团队协作精神,增强学生的沟通能力。

4结语

网页设计和制作教学是一门实践性很强的课程,对于学生的综合实践能力以及创新能力的要求较高,因此,在教学中,教师要给根据学生的兴趣爱好设计教学内容,并且为学生提供一些优秀的教学作品,让他们进行赏析,在优秀作品的激励和教师的引导下,学生的学习兴趣会有很大的提升,从而真正的投入到网页设计和制作的探索当中,熟练的掌握网页制作方面的技巧,增强学生开发和维护网站的能力,使他们的知识结构不断得到完善,对于教学效果的提升会起到很大的作用。

参考文献:

[1]马玲燕.《网页设计与制作》课程的教学实践研究[D].呼和浩特:内蒙古师范大学,2013.

[2]毕惠丽.浅谈网页设计与制作教学中学生能力的培养[J].新课程(上),2012,02:185.

[3]胡晓红,王丽芬,张景峰.基于职业能力培养的《网页设计与制作》教学改革的研究[J].电脑知识与技术,2012,20:4953~4956.

网页制作与设计第5篇

关键词:中等职业学校 网页设计教学 教学方法 教学实效

1、引言

网页设计与制作是中职教育中计算机应用专业的学生必须要掌握的一项技能课程,这门课是针对社会上对网站类的专业人才的大量需求而开设的。网页设计与制作是一门综合性很强的课程,它包括Web服务原理、站点的设置与管理、文本与图像等网页元素的插入与调整、超级链接的创建、使用表格与框架进行页面排版、层、时间轴及行为、动态网站开发等。在对本门课进行了多年的教学研究后,现谈一些有关网页设计与制作教学中的心得体会。

2、中职网页设计课程的教学现状

2.1教师专业技能水平有限,缺乏实践教学能力

中职学校的教师绝大多数为师范类学校毕业后直接进入学校从事教育工作,所以,具有一定实践经验的专业技能型教师所占的比例不大,而中职开设的计算机专业要动手操作的内容相当多,网页设计课程也不例外,在网页设计教学中,通常以教师和教材为中心,关注的是向学生灌输了哪些知识,但缺乏企业项目的实践经验,很难结合社会的需要,更难把最新的计算机技术市场信息带入课堂,同时忽视了对学生学习潜能的开发,导致学生理论与实践的脱节。

2.2中职学生自律性差,缺乏学习兴趣

中职学生的学习基础比较薄弱、学习习惯有待加强、自律性较差。绝大多数的中职学生年龄偏小,知识体系不够健全,对于新知识的领悟和接受能力普遍不强,综合素质也存在着很大的差异,一些学生尽管完成了九年制义务教育的学业,然而实际的情况是有部分学生尚未达到初中毕业生的要求。不仅综合素质比较薄弱,专业知识能力也较低,而计算机应用水平则存在着更大的差距,部分学生无法认识到系统的学习计算机课程对于其自身水平的影响,当面对系统的计算机网络等相关知识的学习时往往力不从心,缺乏学习兴趣。

2.3成绩考核方式过于传统

中职学生一般都没有配备个人电脑,考试只能在课堂上进行,时间受到了限制,传统考试模式通常是给出一个或多个网页的样张,让学生在规定的时间内完成网页制作,在网页中实现某个效果,学生只要对着效果图和要求完成考试内容,如同在完成一个拼图游戏。 网页设计课程是主观性很强的实践性课程,这种考核方式导致的结果是:学生不创新,会制作网页,而不会设计网页。

3、教学思路探索和教学方法改善

3.1提高教师实践能力水平,改进教学方法

作为网页设计课程教学的教师来说必须关注互联网应用的实时趋势,走出课堂、走出校园、深入到企业了解就业市场需求。不断更新知识, 提高自身素质, 可以加强校企合作,以拓展教师的视野,学校应从政策上引导和鼓励教师利用寒暑假深入到企业进行实践。深入了解一个完整的网站的创建过程,从规划到素材的搜集与处理,到网站的制作,再到网站的维护。教师把企业中的项目拿到课堂教学中,学生从完成项目的过程中,明确的知道自己学习了网页这门课程,以后能做什么,在工作中怎么去应用课堂知识,教师在教学过程中,应该巧用教学技巧,以求最佳教学效果。

3.2改进教学方法,激发学生学习兴趣

在传统的《网页设计与制作》中,主要是以教师在多媒体教室讲授,然后学生在机房练习实验内容,这种教学方法使学生对知识的掌握很容易被遗忘,因此采取灵活多样的教学方法,不仅能够激发学生的学习兴趣,还能够起到事半功倍的效果。本人在此课程中主要采用了项目式教学法,所谓项目教学,就是师生通过共同实现一个完整的项目工作而进行的一个教学活动。项目可以一个学生独立做,也可以多个学生一起做。在教学前期一定要一个人独立完成一个项目,为掌握了并不等于会使用,一定要让学生动手实际操作,以是否会用相关技术制作出网页为评价标准。在教学后期比较大的项目上可以几个人一起完成。在本门课程的教学过程中,一方面采用四人为一个小组共同设计系部网站这一个项目,每组选出一名小组长进行总体的策划,将这一完整项目分成多个子任务,每个任务分配到小组成员中,使他们各尽其责完成自己负责的任务;另一方面小组中的每个成员必须完成一个作品,这个网站的作品是由个人独立完成的项目。

网站制作结束前经过教师核准验收后,可以宣布整个项目工作结束。接下来教师要对学生制作的作品进行展示,在进行作品展示时,教师可以把班级同学集中起来一起观看,这会更加促进学生的团队意识。同时,为了更好地利用网络空间和网上资源,可以把学生的好作品上传校园网站。让全校师生都来关注学生的成果。这样,既给学生施加民压力,也激发了学生的学习动力与信心,让学生享受成功的快乐,享受成果的乐趣,真正提高对所学知识的理解和掌握。因此,通过个人项目、团队项目、作品展示等教学方法与形式,不仅锻炼了学生的自我设计、制作、审美及创新能力,还锻炼了学生的团队合作能力,分析问题、解决问题的能力,在很大程度上提高了学生的学习积极性和学习兴趣。实践证明项目式教学方法可行,得到了学生的喜爱与好评,也取得了良好的教学效果。

3.3通过多层次、灵活科学的考核评价手段增强教学实效

采用平时加作业讲评三七开的考核方式,教师根据学生平时的出勤和作业表现给出平时成绩,平时成绩占到考核结果的30%。在期末前的三个周教师布置下期末考核作业,让学生分成小组去做,小组成员控制在三个人左右。在期末时让学生做作业讲评,根据学生作业的完成情况给出最终的期末讲评分数,这个分数占到考核结果的70%。这种考核模式,既可以综合的评价一个学生的学习水平,又可以调动学生网页制作的积极性,还可以培养出真正适合企业需求的优秀人才,是一种一举数得的好办法。

4、结束语

《网页设计与制作》课程是一门实践性较强的课程,只要在教学中不断探索,勇于创新,定会寻找出一条既符合实际又有效的途径,通过教学实践的探索,这种教学方法极大地提高了学生学习的积极性,取得了良好的教学效果。

参考文献:

网页制作与设计第6篇

【关键词】网页制作;教学;设计

早在20世纪初,我国就已经把“网页制作”作为高校基础课程的内容。“网页制作”不仅能提高学生对信息技术的应用能力,还能提升学生的动手能力和设计、规划能力,有利于促进学生的全面发展。在近年来的实践中,“网页制作”课程的开展已在高校取得了较好的效果,在培养学生团队合作、自主创新能力方面都取得了卓越的成效。

1.教学现状

网页制作课程包括设计软件的学习和设计技术的学习两部分。一般高校的计算机技术管理等专业都会设置一定的网页制作课程来提升学生的网络技能。

在课程设置上,一般院校都会在学生进入大二后开设网页设计课程。主要原因是,网页制作包含了较多的网络技术语言,且考查到了学生对信息、设计的知识的综合应用,需要在大一阶段打好理论、技术的基础。

网页制作课程的教学内容主要包括程序设计语言、数据库原理等。其中程序语言包括了C语言,C++语言,Java语言等,数据库原理则分为Access数据库基础,VFP数据库基础等内容。学生可以根据自己的专业情况和学习进度从中做出选择和组合。

2.教学目标

网页制作课程的总体教学目标是,使学生通过对相关网络技术基础内容的学习和实际的上机操作,掌握一定的网络技术应用能力,并在此过程中培养学生的自主创新能力和团队协作精神。其中具体的教学目标有以下几条:

2.1 知识目标

在进行网页制作前首先要掌握一定的网络基础知识和软件操作流程。例如Dreamweaver是网页制作中十分常用的一种软件。在进行网页基础知识的学习时要对软件菜单栏、工具栏等项目的操作方法进行熟练掌握。对于一些基本的编辑、排版技术也要做到有一定的了解。具体应掌握的技术有表格绘制、排版的技术,动画、音频的处理技术,网页编辑、链接的技术,图形绘制晕染的技术等。

2.2 技能目标

技能目标主要指根据现有的网页内容,通过模仿、修改等方式初步完成网页的制作。在网页中应包含一定的解释、说明文字,与文字相对应的图片、符号及一定的动画、切换效果等。在进行网页内容的排版时,可借助一定的表格划分内容结构和层次,还可给网页配上一定的背景图片和音乐以丰富网页内容,增加网页的观赏性和完整度。

2.3 情感目标

情感目标主要包括学生在进行网页制作时培养的团体合作、自主创新及操作动手等能力。与此同时,学生在学习网页制作的过程中也相应地提高了鉴赏能力和学习能力,给未来的职业发展打下了一定的基础。

3.网页制作课程的内容

网页制作课程的教学内容主要包括网站制作基础知识、网页制作、网页特效、网页图像处理和动画制作等四个部分。其中,网站制作部分会涉及到网站和网页概念的区分,网站设计语言等内容;网页制作则会应用到Dream Weaver,FrontPage等网页制作软件;在网页特效部分,会着重介绍JavaScript、Gif图片的制作;在网页图像处理和动画制作上则会应用到Photo Impact和Flas制作软件。

4.网页设计课程的设计思路

尽管我国许多高校都开设了网页设计这一课程,但由于课程设计、操作设备等条件因素的限制,其实施效果并不理想,制作出的网页也难以达到实际使用标准。造成这一情况的主要原因有两个。首先是网页色彩的搭配不符合审美的要求,其次是网页内容的安排缺乏一定的合理性和规范性。网页设计课程的作用就是帮助学生在审美、设计等方面获得全面的提高和成长,因此在设计教学内容时,必须综合考虑到各个方面,设计出相对科学、高效的网页设计培训课程。

在教学进度的设置上,可以采用分部教学的方式,将一些具有难度的项目分解为几个部分进行教学。例如几个网页制作软件的应用,对于初学的学生而言具有一定的难度,教师在教学时可以先从基础知识入手,使学生对软件的用途有一个整体的把握。其次,在分部讲解软件中所包含的功能,使学生在实际操作中逐渐掌握软件使用的方法。

课程设计必须充分遵循学生学习、进步的一般规律,切实提高学生网络技能。为达到更好的教学目的,教师在教学时应注重根据学生的学习兴趣进行教学安排,充分激发学生的学习动力,提高学习效率。同时,在教育形式上也可进行一定的创新,充分利用网络资源,为学生提供更多的学科信息。在学习不同内容时,也应采用不同的教学模式。例如在学习网页制作的相关理论知识时,要注重教学语言的简洁、生动,使学生能在短时间内理解网络应用语言和网页图像符号;在网页制作过程中,应着重培养学生的自主创新能力和编排规划能力。在设计网页内容时充分保证学生的自主性,让学生根据自己的审美情趣和专业技巧对网页内容进行安排。教师在这一过程中主要起到引导作用,在学生遇到技术性困难时给予一定的指导和帮助,使学生能在具体的操作过程中,培养起一定的自学能力和创新能力。为提高学生的相互协作能力,教师还可建立合作小组,对一些重点难点的内容进行小组分工。在具体实施工作上,则由小组组员自主安排,在保证了小组合作的同时,也强调了学生学习的自主性。

5.教材分析

我国大部分高校在进行网页制作教学时都采用了《Dreamweaver中文网页制作基础》这一教材。这本教材的最突出优点就是采用了设置任务的模式完成网页制作的教学。在每一章内容的介绍中,教材中都会设置相应的教学任务和实用案例。学生在完成任务的同时,对教材中涉及到的基础知识点和操作技巧都进行了应用,并在不断操作中强化了记忆,相较于传统的教学模式,更有利于学生对知识的掌握和应用。另一方面,这本教材的内容设置充分遵循了学生的学习规律,并把握好了重点。在教材的前半部分是对网页设计基础知识的简介,其中包含了对数据库软件、Office应用软件、Flash软件等软件的操作规范和说明,使学生在进行实际的上机操作前,对这些基础知识点有了较为全面的把握。教材的重点放在了网页的设计过程上。教材对网页设计的步骤进行了详细、具体的说明,并通过文字和图形结合的方式向学生展示了一些具体操作流程,学生能在较短时间内掌握设计方法,完成网页的自主设计。

6.结语

网页制作是一门综合性很强的学科,对学生的理解能力、设计能力、审美情趣及动手操作能力进行了综合的考查。同时,对于教师而言,网页设计课程的开展也考查了教师的授课能力和创新意识。在网络技术日新月异的今天,掌握好网页制作技术有利于开发学生的创新精神和合作精神,提高学生的综合素质。

参考文献

[1]王晓晴.浅谈“网页制作”之网页版面的教学设计[J].计算机光盘软件与应用,2014(2):31-34

[2]薛巧梅.任务驱动教学法在网页制作教学设计中的应用[J].武汉船舶职业技术学院学报,2013(5):69-71

网页制作与设计第7篇

关键词:JavaScript 网页游戏 设计制作

中图分类号:TP393.092 文献标识码:A 文章编号:1007-9416(2015)12-0000-00

伴随时展、科技进步,以计算机为基础、互联网络为支撑的信息化技术已经成为了当今时代中的主要因素,不但给人类的生活形态与精神面貌带来了较大的转变,最重要的是在很大程度上改变了人们的生存方式,使人类拥有了另一种生存的可能,同时由于它的发展,也催生了游戏方面的变革,尤其是“网游”的出现,俘获了千万颗童心未泯的心,其利弊得失是当今颇受争议的问题。然而,还是应该对于这一项技术加以关注,对基于JavaScript的网页游戏的设计与制作进行分析研究。

1 概述

网页游戏通过浏览器实现无端网游,只需拥有一根网线、一台电脑即可实现无客户端下载的Web游戏。其最大优势在于程序设计者完全能够一面进行设计、一面进行调整、修改、补充工作。因其系统可以为操作人员提供一个人机交互的界面,从而采用问答的方式,在接收信息后,进行处理,这种在系统――操作者间的交互式处理方式,主要是进行交互作用的信息处理。相对而言,其直观性、可控性与灵活度有了很大的提升,是非交互式处理无法完成的优势所在,依目前发展情况来看,其普遍性在增加,应用范围在逐步扩大,而且备受广大用户喜爱,免除了来自于单道任务所带来的诸多效率问题,因而当操作者较慢的时候,它却可以进行其他任务的处理,节省了时间,使资源得到了充分利用,并且提高了计算机的工作效率。在结合工作方面,将分时处理、交互式处理两种处理方式有效结合起来,不但可以使多个用户进行同时对话;还可以与批处理方式结合起来;在每种结合方式中,都可体现出其独特的优势与特征,而且应用起来也比较方便。

2 开发工具和设计构思分析

2.1 JavaScript

HTML技术用来制作网页,而JavaScript即是通过其自身作为脚本语言的功能对其网页进行功能添加,主要集中于动态功能方面,从而达到命名用户的操作得到响应的效果。其最大特点即是,当其源代码发送至客户端,尤其是在运行之前,没有必要进行任何过程的编译处理,通常来讲,主要是把文本格式中的字符代码发往浏览器,然而让浏览器独自进行解释性运行。由于它是动态、弱类型、基于原型的语言,内置支持类,所以在安全性方面,相对较差,其联系程度较高,独立性不强,因而如果出现一条无法运行的情况时,便会出现其下的语言也不能继续运作,从该方面来看,解译次数有时会偏多,所以,速度慢是其最大缺点。另一方面,作为编译语言,Java的源代码却需要编译,才能传递到客户端运行,因此,就需要搭建起一个平台,使解释器、仿真器,将特定的编译代码加以适度化的约束,以此来达到安全可靠的保障作用。

2.2 CSS

层叠样式表或级联样式表,全称为Cascading Style Sheet,简称CSS.其作用在于对浏览网页进行控制,主要是通过一组格式设置规则加以实现,也就是通过CSS来达到这一目标。功能在于分离页面中的形式与内容,使二者可以独立存放于HTML文档之中。这样,有助于将维护站点的外观变得更加简便,也可以简化HTML文档代码,减少浏览器在加载过程中的时间。从CSS的特征分析,在修改页面方面易于实施,压缩网页体积,同时还能保持页面风格的完全统一。从其功能与作用的价值看,可降低成本,增加工作效率,因为它可以同时管理多个页面,并且根据保存方式,又可以通过改变CSS文档,达到从外部样式到站点中页面的格局的充化。也就是说,对于样式的更新,即可以将网站中的全部元素加以更新。

3 网页游戏设计及制作流程

3.1 游戏背景、素材及举设计举例

根据要上的说明可知游戏需要其可玩性、效果性,所以,先应该以层叠式样表对将要完成的游戏所给定的各要素片理好,做了版面的整理工作,比如,游戏元素的图像选择以及整理工作等。另一方面,游戏素材应该能够透过它来实现一定的吸引人注意的效果。一般而言,除了网站中的撷取,还应该进行PS处理、自绘画等。

举例,为了明白起见,以下以“打地老鼠”为具体的说明,呈现出交互式网页游戏的设计方法。首先,需通过鼠标,完成每一个操作,规则之一,即是不能击打那些白色的地老鼠,打击一次,会让玩家丢一次命。其次,设置一些带有炸弹的地老鼠,分别将其放置在游戏屏幕的左右两边,需对其进行不断打击,否则,即会发生爆炸,当爆炸发生后,也会损失一次命。第三,为玩家设置三次性命,全部丢掉即算GAME OVER。最后,在界面显示出玩家的最终成绩,即打死地老鼠的最终个数。而且在该界面继续显示开始或结束的选项,供玩家选择。该游戏的基础在于地老鼠的出现,需要有相应的控制方法,以使其可以随机在屏幕中出现,其实质即是地老鼠对应元素出现的高度伴随情况之出现。在击打地老鼠时,需要先将选中,再进行鼠标点击即可。

以“打地老鼠”为例,其中需要四种办法达到对地老鼠出现的控制。第一种方法是randomBunny()函数,第二种方法 是bunnyJumpl()函数,第三种方法是bunnyJump2()函数,第四种方法是bunnyJump3()函数。第一个主要是用来控制地老鼠的随机出现,而对于其它的三种方法,则可依次表述为对于各类伴随情况出现的控制。对于击打,需要通JavaScript中的两个函数来完成,分别是其中的onmousedown/onclick,其交互作用发生在击打地老鼠之时,两个函数在不同的时间发生,前者发生于点击时的事件发生,而后者是点击后放开时事件发生。具体来讲,若要击打到地老鼠,先应该有一个函数,也就是说,clientX,,clientY,getPosition,通过后面的数,即可得到对应的元素的横向与纵向坐标,当地老鼠处于所要打击的坐标范围内,即会被鼠标的点击所打中,也就是说,利用规范与判定来达到所需要的结果。上面未提到的白色地老鼠无需打击以及其他条件及要求,都需要对应的功能来实现。

当出现白色地老鼠与带有炸弹时,便会失去生命,因此,需要根据这一条件设定一个lostlife的函数,其主题简单,在判别条件的设置时,只需要调动该函数,使其值与发生丢失生命值相合即合,也就是说,令lives.lostlife=1,当其不为空值时,执行的是live.lostlife++,当判断live.lostlife>=3时,即可调用函数endgame()去终止游戏,此时计时停止,等级信息、分数等一一输出到游戏界面。在开始与结束的菜单上,还需要设置两个不同的按钮,分别通过相应的函数进行设置。其中的基本原理是相通的,而且对于各种功能设置及处理方式区别也不是很大,主要是以对应元素与所需功能间的规范化与控制来达到最终所要达到的效果。

除了这些功能设置外,还需要对整个游戏进行相应的控制。其主要内容即是通常玩家可以看到的时间与升级问题,在此中,需要通过计时条、计时条时间被控制来达到。比如,在计时条中,resumlevel()控制,可以将计时条透明性、计时性进行相应规定,还可以利用计时条的滚动进行提与计时时间控制,这里就需要另一个函数leaveup()来完成,当这走完时,即可将其设计到升级条件之下,升级的根据也就是地老鼠所停留的时间的长短、数量等。

3.2 演示及测试

首先,安装网页浏览器,以上面所说的“打地老鼠”网页游戏可知,不同的ID可以对不同的地老鼠进行控制,而每个对象的出现都是随机的,当击中白色掉一条命,当击不中带有炸弹者,发生爆炸,也会掉一条命。在演示与测试过程中,可以通过调试功能,对图片的变换进行闪烁界定即可。

3.3 标准及要求

在基于JavaScript的网页游戏的设计与制作中,需要对JavaScript客户端脚本语言有一个明确的认识、对其基于对象的编程思想加以把握,在具体的游戏开发项目中,先应该有一个合理的计划书与备忘录的制作,然后根据项目设计要求及标准,利用一些模块进行网页游戏制作。以下以最为基础,用途最广泛的连连看为例,来介绍作为一个可行项目的基于JavaScript的网页游戏的设计与制作实施过程。

首先,应该在项目设计的基础之上,以设计方案,依次将网页制作、程序开发、测试、文档编写等完成。其要求在于将JavaScript 客户端作为脚本编程技术出发点,进行开发。在设计连连看网页游戏时,先对其网页界面进行整体上的布局,比如,从审美角度的要求,从广大客户需的角度来设定一些原则,将操作系统与界面之间的可操作性进行细致区分,比如在界面的上端可进行时间、初始化等信息的显示;比如设置难度系数易、难、困难等供玩家自主选择等;在界面下端可以设置游戏主体界面,将其位置布置到中位,调整好整体的比例与效果,其实也可以将其反过来,上下换位处理,只是在设计时,给定了一种习惯性,因而导致了最终的适应性,如果反过来,以手机自带的方式提供给广大用户,大多是可以形成其新的玩家习惯的。其次,在连连看游戏网页中,应该对其功能模块设计加以认真分析,功能模块设计,主要是需要了解清楚其中的基本功能需求为何,也就是说,如同上面的“打地老鼠”游戏一般,先确定清楚项目中的对象,并创建根对象;在游戏区的控制或能模块设计方面、游戏区功能模块设计方面等等,都应该先在程序中分级管理,也就是说按照文件的上录入进行分类管理,以项目工程的主到子进行分别建立,最后在完成一系列具体的制作之后,进行测试与演示,然后对其中的效果加以评估。无论是根据模板进行直接的设计,还是利用代码的方式进行编程设计,其结果都可达到最终的网页游戏效果。但是最主要的还是以上面所说的JavaScrip技术、CSS技术为运用基础,把交互式技术引入到网页中,从而实现网页游戏功能。

4 结语

总之,笔者认为从技术的角度而言,基于JavaScript的网页游戏的设计与制作把网络在线小游戏变成了可能,提升了游戏的动态性,增加了机与人之间的交互作用,使可玩性得到了在线升级,随着文化主题的带入,该方面的游戏越来越受到追捧,但同时也应该防止因游戏上瘾所带来的麻烦,尽可能的在游戏的设计与制作方面,根据不同年龄阶级设置一些适应各层级的游戏项目,从而保护未成年人的健康成长。

参考文献

[1] 方蓓.基于JavaScript的简易游戏的实现[J].软件导刊,2013(3).

[2] 冯科融,王和兴,连加美等.基于HTML5的3D多人网页游戏实现方案[J].微型机与应用,2013(1).

网页制作与设计第8篇

一、以职业岗位需求改革教学内容

随着人们对网络的要求越来越高,以及IT技术日新月异的影响,网页的设计与制作方法也在进行着翻天覆地的变化,只有及时掌握网页设计与制作的技术动态以及市场需求,并顺应技术发展方向调整课程内容,才能够让学生学到工作过程中所需要的知识。

二、教学方法改进

1.任务驱动教学法

“任务驱动”式教学方法,是在研究教学大纲、教材和教学对象的基础上,选择实际工作中的一个或多个有突出特点的“任务”,通过对该“任务”的解决过程,把相关的知识组合进行教学。其突出特点是目标明确,过程生动,直观性强,实践性强,易于学生能力的培养。

针对课程的具体操作,根据课程的教学大纲、教学内容,先设计一个总任务,再根据循序渐进的原则,组织子任务的教学顺序。把总任务分解成若干分任务,再分解成不同的子任务,子任务再分解成步骤。划分的界定完全根据实际工作来定。

2.采用案例教学

根据教学目的和教学内容选用典型案例,通过对案例的分析,讲授案例中所用的理论知识,融枯燥的理论学习于生动的例子中。在学生理解基本理论知识的基础上,再演示典型例子,以此来让学生进一步熟悉相关理论知识的应用及实际操作。授课时先展示网页效果,再讲解相关内容,这样可以激发学生的学习兴趣,提高学生的学习积极性。

三、建立完善的考核体系

在对学生进行考核时,采用重视学习过程的评判方式,采用平时成绩与期末成绩结合,平时成绩占总成绩的40%,期末成绩占60%。平时成绩由出勤、课堂发言和平时做作业组成。期末成绩考核采用机考方式完成对技能部分的考核。在规定时间内(通常为2个小时)利用给定素材,包括考题所需的图片、背景和其他辅助图片,相关考题内容的文字资料、考题要求等,学生利用授课所学软件完成规定技术要求的网站创意设计与制作。

参考文献:

[1]杨单,耿迪.面向能力培养的《网页设计与制作》课程教学改革探索[J].武汉科技学院学报,2008(4):57-61.