网页的设计与制作范例6篇

前言:中文期刊网精心挑选了网页的设计与制作范文供你参考和学习,希望我们的参考范文能激发你的文章创作灵感,欢迎阅读。

网页的设计与制作

网页的设计与制作范文1

网页设计制作》课程是《Web应用程序设计》课程的先修课程,为Web应用程序的页面布局和界面设计打基础。为了适应市场对“网页设计制作人员”的岗位需求和为了实现网页设计到Web应用程序设计的过渡,有必要对现有的《网页设计与制作》课程进行改革,使学生能适应“网页设计制作人员”的岗位需求并能将《网页设计与制作》课程里学习的实践成果能直接应用于基于.net或JSP的Web应用程序设计。 

2、《网页设计与制作》课程现状及存在问题 

笔者所在学校的计算机科学与技术、软件工程、网络工程三个专业都开设了《网页设计与制作》课程。传统的网页设计与制作课程主要基于网页三剑客Dreamweaver、Fireworks、Flash制作出精美的网页。这些网页内容丰富多彩,结构复杂,能满足静态网页的页面需要,但这些网页不能直接应用于基于.net或JSP的Web应用程序开发中,不能满足动态网页的页面需求。Web应用程序开发,是通过后台数据库与Web服务器的信息交换,由后台数据库提供实时数据更新和数据查询服务。《Web应用程序设计》课程有两种主流的开发技术:.net与JSP。在《Web应用程序设计》课程中,主要讲解.net技术与JSP技术,而不讲解页面设计,需要学生将《网页设计与制作》课程学习到的网页设计知识融合到Web应用程序设计中来,使动态页面既有数据库的内容,又界面美观。而学生在传统的《网页设计与制作》课程里学习的页面知识不能直接应用于Web应用程序设计。有必要对《网页设计与制作》课程进行教学改革,增加CSS,Div,Javascript,AJAX等内容,以完成学生向Web应用程序设计的过渡。 

3、教学改革措施 

3.1课程定位与目标 

《网页设计与制作》课程的实践性较强,是网络工程专业的核心课程,是计算机科学与技术、软件工程专业的选修课。本课程以计算机导论、计算机程序设计语言为先修课程,以培养学生实际动手能力为目标,使学生具备网页素材搜集、网页元素制作、网站布局和规划、脚本代码编写、网站、网络建设管理与维护等知识与技能,并培养学生团队协作能力、沟通能力、分析问题能力、解决问题能力,同时也为后续课程《Web应用程序设计》的学习奠定基础和实现向Web应用程序开发的顺利过渡。 

课程目标包括:①理解网站的工作原理,学会构建网站;②熟练掌握Photoshop、Fireworks、Flash等软件处理网页素材;③熟练使用CSS、Div进行网页设计;④掌握网页脚本语言的使用方法;⑤培养学生做出具有一定水准的网页(包括Javascript,CSS+Div)。 

3.2优化教学内容 

以往《网页设计与制作》的教学内容大多是按网页三剑客展开,而以向Web应用程序设计的过渡为导向的课程改革需要将《网页设计与制作》课程内容与Web应用程序开发的动态页面要求相结合,满足日后的Web应用程序设计要求。 

教学内容主要包括:①网页图片处理;②网页动画制作;③基于HTML+CSS+Div+Javascript网页设计。 

借助Dreamweaver进行可视化页面设计转向纯代码的编写,全部靠手工编写代码来设计网页页面。 

3.3教学方法改革 

教学方法由传统的演示法向多样式教学方法发展,主要有以下4种: 

启发式-模仿法:初学时需要大量浏览一些优秀网站案例。通过欣赏国内外优秀网站,让学生在外观视觉的享受中感受网页设计领域的奇妙,培养学习兴趣。并选中几个案例,进行一步一步地模仿设计。 

任务驱动法:每个学习案例都布置了学习任务,课程体系结构以任务为主线,贯穿整个学习过程。教师在课堂讲解理论知识后,布置学习任务,学生自己动手独立完成学习任务,将理论与实践相结合,使理论知识得以实践。 

项目教学法:将实际的网站设计项目直接在课堂再现,以项目为驱动,带动各知识点,让学生边学边练。让学生了解网站开发的流程,也促进各知识点的应用,快速吸收所学 

内容。 

3.5学生设计成果能向《Web应用程序设计》课程过渡 

《网页设计与制作》课程是《Web应用程序设计》的先修课程,学生通过《网页设计与制作》课程的学习,设计出的网页成果要能直接移植或方便的移植到Web应用程序设计中来,而不能出现设计出的网页成果与《Web应用程序设计》无关,与后续课程脱节。 

方法:(1)利用Dreamweaver等网页编辑软件,纯手工编写代码,保存为后缀名为html或htm的文件,通过不同的浏览器测试页面的预览效果。日后通过修改文件后缀名来适应.net开发或JSP开发,实现向Web应用程序设计的移植。 

对于基于.net的Web应用程序,在 Visual Studio环境下进行网页设计,实现网页设计向基于.net的Web应用程序的直接移植;对于基于JSP开发的Web应用程序,在Eclipse环境下进行网页设计,实现网页设计向基于JSP的Web应用程序的直接移植。 

4、结语 

通过《网页设计与制作》课程教学改革与实践,课程结课后学生都能够独立完成基于HTML+CSS+Div+Javascript的小型网站网页的设计,且这些网页要能直接移植或方便的移植到Web应用程序设计中,实现向Web应用程序设计的完美过渡。通过课程改革,提高了学生的学习兴趣,锻炼了他们的实际动手实践能力,并为后续《Web应用程序设计》的页面设计打下良好的基础。 

参考文献: 

[1] 彭莉,张道军,高好良.《网页设计与网站建设》课程教学改革与实践.软件导刊,2013,12(2):170-172. 

[2] 董玉兰.教师引导 学生探究——《网页修饰》教学设计.课程教育研究,2013. 

网页的设计与制作范文2

该课程采用项目化教程,根据高职高专学生的动手能力强、思维较活跃这一特点,针对教学内容、教学手段、实验实训等诸多方面进行教学改革,促进了课程建设,增强了课程意识,全面提高了教学质量,为社会发展的需求多培养一些实用型、技能型人才。1.1划分模块,由浅入深根据授课计划,将授课内容划分为五个模块:网页创建与设置、文本与图片的使用、多媒体、框架设置、CSS使用等。各模块之间既独立存在,又相互关联。在理论教学过程中,树立以教师为辅,学生为主的教学思想。灵活运用多种教学方法,提高学生学习兴趣,帮助学生深化理解、正确应用,保证教学过程良好有序地进行,并针对该课程的专业培养方向,强调理论学习的重要性和实际动手操作的必要性,鼓励学生自主学习,调动其学习的积极性。在实践教学过程中,借助于电脑实验室,使用Dreamweaver软件进行网页的设计与制作,推广边学边练的教学模式,在教师的带动下,学生边学边练是最直接、最理解的学习过程。使其真正做到“教、学、练、做”融为一体。这种以理论教学为基础,以实践训练为重点的教学模式,在授课过程中取得了较好的效果,使理论教学与实践训练结合的更加紧密、贴近技术应用实际。增加了学生的学习热情,使学生真正学到了知识、掌握了技能。1.2开设实训课程,提倡“任务驱动”项目化教学理念实训课程,即给予学生一个在无其他课程安排的情况下充足、完整的制作与设计网站的学习时间。通过该课程可以让学生系统的学习如何创建网站,如何规划网站,如何管理网站。针对高职高专贯彻培养高技能应用人才的教学理念,在该课程有教学过程中积极探索新思路、新方法。由于新知识的不断增加、教学时间的相对减少,传统的教学方法已难以适应新形势的需求,所以需要对课程体系和教学方法进行改进,实行新的教学模式,让理论和实践有机结合。为了提高教学质量和效果,使学生能够学到知识、掌握技能,在保证课程教学合理性的同时开设实训课程,改变理论学习容易出现抽象枯燥、难以理解和接受的问题,解决传统教学过程中存在的理论学习与实际操作难以融会贯通的缺陷,使得教学的针对性和学习的趣味性大大提高。在实训课程中教师应明确教学目的,采用任务驱动法、演示法、讲授法等,组织并启发学生制作一个属于自己的网站。网站的选题与色调根据学生个人爱好自由发挥、自行设定,从而大大激发了学生的学习热情。在制作过程中教师与学生进行交流,辅导学生进行“一对一”互动学习,并针对学生存在的问题逐一进行讲解,引导学生依靠个人能力解决技术难题,达到轻松学习、自主学习的目的,力求每一位学生通过实训课程的演练,都能够对网站开发与制作的过程有一个清晰的了解和认识。这种教学形式既能突出操作技能的训练,又能使学生学到与职业技能有关的知识,不仅培养了学生的分析问题和解决问题的综合能力和创新能力,还培养了学生的一专多能。该教学形式是以培养学生能力为中心,让实训任务始终贯穿在整个教学过程中,达到了学以致用的教学目的,既能够检验学生在该课程中所学到的技能,又能够真正发掘学生的潜在能力,还能够大大激发学生主动学习的热情,使学生从“要我学”变为“我要学”,形成了一个“比学赶帮”的学习氛围。1.3开设“作品展示”课堂,促进师生之间的交流《网页设计与制作》课程的学习目的是通过学生对Dreamweaver软件的使用,制作出一个符合企业以及个人需求的网站,远比机械记忆,应付理论考试重要的多。开设“作品展示”课堂,要求学生自己演示自己制作的网站,鼓励学生对所制作网站的设计理念和各网页之间的衔接加以详细说明,教师再针对每位学生网站的主题风格、色彩搭配、网页布局、多媒体运用等诸多方面加以分析、点评,肯定成绩,找出不足,鼓励学生精益求精,不断提高技术水平做出更加优秀的网站。通过“作品展示”课堂,学生之间不仅可以相互学习、相互借鉴、相互欣赏,真正认识到自己的所学知识和掌握知识的真实情况。同时,还可以提高学生团队合作的精神,增加学生之间的情感。实践证明,此种教学方法对学生的学习方法和努力方向能够起到一定的引导作用,对学生的实际动手能力能够起到一定的强化训练作用,对学生的求知欲和上进心能够起到一定的激励作用。1.4组建兴趣小组,模拟企业网站开发

“以服务为宗旨、以就业为导向、以能力为本位”是职业教育的办学宗旨,为了让学生真正参与到实践项目开发中,真正体验网站的开发与推广对企业发展的重要性。教师利用课余时间承接企业网站开发项目组建“网页设计”小组,鼓励学生积极参与,通过项目让学生学习如何与企业直接进行有效地沟通与交流,如何充分了解企业需求,如何完成预订目标。通过学习与锻炼不仅提高了学生的网页制作技术,而且做到了所学的内容与社会需求零距离的结合,同时还锻炼了在校生的人际交往能力、组织协调能力、团队合作能力和提高社会经验适应社会的能力。

2课程考核标准改革

根据高职高专教育的特点,结合《网页设计与制作》课程特点,取消试卷百分制的传统,将考核标准划分为两部分:(1)理论课考试部分。理论考试以教学大纲为指导,长期坚持教考分离和期末考卷分析总结的传统,统一考核标准,注重规范教育,营造公平的竞争环境;(2)网站作业成绩。通过“作业展示”给予学生作业相应的分数,改变实验实训课在学生心目的附属地位,加深学生的感性认识,提高学生上课积极性、主动性以及实践技能。两部分的分值各占总分数的50%,综合评定学生考核分数。

网页的设计与制作范文3

关键词: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).

网页的设计与制作范文4

关键词: 《网页设计与制作》 教学研究 教学探索

一、教学现状

1.课程特点。

学生在先修课程的基础上,具备一定的网页效果图制作的能力,然后通过《网页设计与制作》这门课的学习,按照效果图可制作出网页。《网页设计与制作》的综合性很强,不仅要求学生有一定的插画、动画制作,以及配色、审美的功底,还要求学生具有较强的实践动手能力和代码编写能力。

2.学生特点。

《网页设计与制作》是针对高职高专软件技术专业、网站建设与维护专业的学生所开设的,这两个专业学生共同的特点:一是普遍没有美术功底;二是学生英文基础薄弱、自律性较差、综合素质有很大的差异性、计算机的熟练水平参差不齐。当面对设计的网页效果图要求美观时,学生因为美术功底的缺失,往往达不到要求;当面对对英文基础有一定要求的网页中代码编写内容的学习时,部分学生会有力不从心的感觉,从而导致学习兴趣的丧失。

3.教师特点。

“名师出高徒”,要教出实践能力强的学生,教师自身的实践能力就要强。但现状不容乐观,任教《网页设计与制作》的专职教师在相关企业实践过,且具有一定实践经验的所占的比例并不大,而这门课程本身对实践操作能力的要求就很高,于是产生了矛盾。虽然有行业兼职教师来校教授该门课程,但因为这门课不是一蹴而就,而是要通过循序渐进的学习才能学好的,行业兼职教师所任课的时间稍显不足。

4.教学方法。

高职教育注重学生实践动手能力的培养,且《网页设计与制作》这门课程对学生的动手能力要求很高。传统教学采取“理论+实践”的形式,理论指的是在多媒体教室中,教师以讲授和演示的方式,把实践所涉及的理论知识传授给学生,学生以听和记笔记为主;实践指的是学生在过后安排的上机课中予以实践,但理论和实践往往没有实现无缝对接。

二、教学探索

1.在实践中提高高职高专专职教师的动手能力。

针对提高专职教师的实践动手能力,提出“实践”这个解决方法。第一,与各大公司企业加强校企合作,在专职教师休假时间,特别是在寒暑假这种假期比较长的时间里派教师下企业锻炼,体验企业具体所需技能及学习新的技术;第二,定期组织行业专家来校对专职教师进行交流和指导,实现教师下企业锻炼和在校接受培训双保险。

2.改进教学模式,引入CDIO教学模式。

高职教育注重对学生实践能力的培养,改善教学模式对学生实践能力的培养显得尤为重要。CDIO是由MIT等世界著名高校研发的一整套先进的工程教育模式,C(conceive)指的是“构思”,D(design)指的是“设计”,I(implement)指的是“实施”,O(operate)指的是“项目分析和展示阶段”,该模式可应用到《网页设计与制作》这门课的教学中。

(1)“教”在CDIO教学模式中的体现。教师可借鉴该教学模式,不再按课本上的具体章节讲解,而是将一整个网页制作项目具体,从如何“构思”到如何“设计”,再到如何“实施”,完成后“展示”给学生欣赏。也可理解为教师引入项目引导式的教学方法,对该项目进行分阶段拆分,通过完成具体的项目、逐步带领学生掌握网页设计与制作的各种方法。

(2)“学”在CDIO教学模式中的体现。该模式要求《网页设计与制作》这门课程有三方面的目标,即知识目标、能力目标和素质目标。为了实现这门课程的课程目标,要求学生在学习网页设计基本知识的基础上自愿分组,每小组确定一个网页的主题,完成至少一个完整的项目。该项目要求包括表格布局、框架布局、div+CSS布局三种布局方式,以及CSS美化和JavaScript特效一整套,按照CDIO的流程,从构思(具体需求)、设计、实施改进及展示本团队设计开发的项目对学生进行训练。学生在学习任务的驱动下,能自发地利用课后时间搜集资料学习和实践,弥补课程教学时间的有限性和教学范围的局限性的不足。同时按照这个流程走下来,学生的团队合作精神也得到锻炼。在项目的实施过程中,学生难免会碰到各种难题,这就锻炼了学生解决问题的能力。

3.加大实训项目在期末考核中的比重。

传统考核模式采取平时成绩30%+期末理论考试70%的比重,现在则提高实训项目在期末考核中的比重,本着理论够用、注重实践的原则,考核形式采取平时成绩20%+期末理论考试40%+学生实训项目占40%这一考核方式,凸显理论的不可或缺性和实践的重要性。

综上所述,在《网页设计与制作》课程教学中,要注意丰厚学生理论储备,提高所需技能和素质,为学生的可持续发展打下坚实的基础。

参考文献:

[1]蒋秀姣.CDIO环境下网页设计课程教改探讨[J].广西教育C(职业与高等教育版),2012(10).

[2]王刚.CDIO工程教育模式的解读与思考[J].中国高教研究,2009(5).

网页的设计与制作范文5

关键词:网页设计与制作;慕课;终身学习

一、背景

当今社会正处在一个变革的时代,信息化在推动着政治、经济、文化、军事、教育各个领域都在不断地变化着,人们获得信息的方式不仅限于传统的媒体(如电视、报纸、书籍、杂志和广播),可以随时随地通过电脑、平板电脑或手机访问网站和浏览网页。在校大学生也不例外,他们每天都要通过电脑、手机或平板电脑阅读资讯,查阅资料,或进行相关专业的学习和科学研究,网页正是这些信息和知识的载体。因此,越来越多的大学生对网页设计与制作产生了浓厚的兴趣。掌握网页设计与制作的方法和网站开发的相关技术也非常实用和重要。本文对当前高校开设的网页设计与制作课程进行了深入调研,据统计我校每年选修这门课的学生超过千人,这门课程非常受欢迎。

与此同时,慕课的出现使得教育也出现了翻天覆地的变化。慕课是指大规模网络在线课程,这些开放课程大部分是由全球知名高校制作,然后放在一定的学习平台上,向全世界免费开放,他对学习者没有什么要求,只要你有一部可以联网计算机或智能手机,就可以自由选择平台上提供的课程进行学习,学习完后你可以选择参加考试,成绩合格就可得到由课程的提供者认证的合格证书。

那么,慕课时代我们如何来讲授这一门课程呢?接下来我来从网页设计与制作的教学中经常遇到的问题来着手讨论。

二、在网页设计与制作的教学中,存在以下几个问题:

1.网页设计与制作课程是一门高度综合的课程,是技术与艺术的结合,它涉及网络技术、平面设计、动画设计、程序设计等多种知识。首先要学会读写HTML,熟练掌握可视化网页制作软件Dreamweaver的使用,能手动修改CSS样式表文件,了解JavaScript脚本语言;其次要熟练使用Photoshop、Fireworks和Flash等软件;最后还要对ASP等动态网页制作技术有一定的了解。如何在有限的课时内去选择有代表性的教学内容,既让学生掌握了网页设计与制作的精髓,又能培养学生不断获取新信息的能力。

2.网页设计与制作课程主要介绍网页的设计与制作及网站的建设与管理,课程每一部分内容都有相对独立性和完整性。该课程教学基本是在多媒体教室开展,特点是操作性强,而用多媒体教学基本采用“满堂灌式”和“填鸭式”,这种单调的教学方法和教学手段不能调动学生的学习积极性,不能激发学生的学习兴趣。一门课讲下来可能让学生感觉到零散,难以达到融会贯通,而且在网页设计与制作课程的讲解过程中,发现学生在上课时看老师的操作能掌握,课下过会就忘了。所以,要在这门课的教学过程中简单明了地把课程的体系结构介绍清楚,再建立一个课上内容和课下相连接的桥梁,让学生知道上课的内容实例,用教学内容里的相关素材加以操作,使得学生可以在课下对上课内容进行巩固,以期达到较好的授课效果。

三、如果把慕课应用到《网页设计与制作》教学中,这门课的学习将有以下几个方面的变革。

1.学习方式的变革

在当前的高等教育改革中,我们一直试图利用网络将学习延伸到课堂外,让学生能够不受空间和时间上的限制随时随地学习交流。慕课的出现为这一理想的实现提供了可能,使得学生对于知识的理解和吸收,往往要比传统课堂更有效率。慕课的发展使传统教育的学习方式面临变革,但它也是新生事物,不能替代课堂教学。我们需要迅速转变思想观念,积极探索更加适合高等教育发展的道路。因此,利用这一特性,在大学教学过程中采用线上线下相结合的混合式教学、翻转课堂等新型的教育模式也在许多高校中进行试点。鉴于网页设计与制作涉及网络技术、平面设计、动画设计、程序设计等多种知识,各个知识点之间比较零散,难以融会贯通的问题,可以把课程内容划分为若干个模块,通过一个典型的小型网站来引入网页制作,由浅入深地介绍各个知识点的操作,建立班级QQ群,把上课资料全部上传共享。将基本的知识讲解放在线上,让老师省下更多时间与学生当面交流分享,答疑解惑,获得更好地教学实效,学生通过课堂学习和课下辅导相结合,既掌握了网页设计与制作的精髓,又能培养不断获取新信息的能力。并且所有的慕课课程也不一定都要都亲力亲为,可以充分的使用“拿来主义”把网上的优秀的资源拿来使用。

2. 教学方式的变革

慕课在线课程为教学方式的多样化提供了新的途径。课堂与在线教学相结合,可以实现更加深入和个性化的学习,能够显著提高教与学的质量和效率。学生可以按自己的节奏、进度和方式随时随地学习,课堂时间更多地用来进行师生间的深度互动。每学习一段内容之后的测试和即时反馈有利于学生学习的循序渐进。学生在慕课上不仅能学习本门课辅导老师的授课过程,还能学到世界各地名校名师的授课,把宝贵的资源最大可能的共享,教师通过这种“翻转课堂”模式,从一个讲授者、讲解者,真正变为学习的激励者、启发者。

3.评价方式的变革

慕课可以全面跟踪和掌握学生学习行为、学习过程,进行有针对性的教学,更准确地评价学生,提高学生学习效率,大幅度提升人才培养质量。而它的大数据分析功能可以帮助教师轻松地完成对学生的分析与评价,并实时调整教学手段。

四、把慕课运用到教学中,学生有以下几方面的改变:

1.学生的动手能力增强

这门课主要通过一个小型网站的实例,分步介绍各个章节的内容,课上老师操作,课下同学们按照老师给的素材、要求和操作步骤练习并拓展,增强了学生的动手能力。

2.学生的就业竞争力增强

当前电子商务发展迅速,掌握网页设计与制作的方法和网站开发的相关技术也非常实用,可以运用到以淘宝、天猫、当当、京东、亚马逊等为代表的电子商务网站中,使其更好地发挥作用。拓宽我校学生的就业面,提高就业竞争力。

3.在校学生整体素质提高

加强各学科的相互渗透和交叉综合,拓宽学生的思维空间,还可以融合学科前沿知识和高新科技,培养适应社会需求的应用型人才。

4.慕课可引导社会向终身学习慢慢转变

学生在校时,可以把慕课作为一种辅助教学的手段。即使毕业工作了,也可以通过在线开放课程自由、开放的学习模式,实现终身学习自我提升。

慕课的开放性以及系统性对当前教育改革有着深远的影响。教育成为了人们基本的权利,使得终身学习成为可能。慕课在探索开放互联网背景下全新的大学课程组织实施模式,撬动着根深蒂固的传统课堂的组织管理模式。因此,我们有必要对于慕课进行总结和思考,进而将课堂与在线教学相结合,使得学生能全面掌握每一门课,整个社会向终身学习转变,增强整个社会的竞争力。

参考文献:

[1]王亮 浅谈慕课背景下计算机网页设计课程的教学改革.智富时代,2015.7

[2]段永平,杨再祥.浅议慕课在高职教育改革中的作用――以高职《网页设计与制作》课程为例.新课程(下),2015.7

[3]张琳 慕课视角下网页设计课程的教学生态模式研究.电脑知识与技术,2015年21期

基金项目:安徽财经大学校级教研项目“慕课时代的《网页设计与制作》课程教学探索”建设成果,课题号:ACJYYB2014102

作者简介:

杨威(1982-),管理科学与工程学院,讲师;

网页的设计与制作范文6

关键词:职业能力;工作过程;网页设计与制作;教学改革

中图分类号:G642文献标识码:A文章编号:1009-3044(2012)20-4953-04

Investigation of "Web Page Design and Making " Teaching Reform Based on Vocational Ability Training

HU Xiao-hong, WANG Li-fen, ZHANG Jing-feng

(Beijing Vocational College of Electronic Science, Beijing 100029, China)

Abstract: According to the higher vocational students’ ability training requirements and the problems of traditional teaching, explore the vocational ability training courses based on reform thinking, to the professional activities as the main line, students as the main body, proj ects for the carrier, combining teaching reform to apply it. Through the analysis of typical tasks and vocational ability, based on the con struction of the working process in the web design and production course, from teaching concept, teaching mode, teaching contents, teach ing methods and evaluation methods, it puts forward the reform of the concrete implementation plan.

Key words: vocational ability; work process; web page design and making; teaching reform

1教学改革的必要性

随着信息网络技术的飞速发展,利用互联网获取信息已成为人们生活学习不可缺少的部分,当今社会需要大量的网页设计制作人才,《网页设计与制作》是高职计算机多媒体专业的核心课程,具有实践性强、应用面广、与岗位联系密切、极富创造性等特点。《网页设计与制作》每部分内容都具有相对独立性和完整性,要求学生能主动参与到学习中,培养学生的实际动手能力和应用能力。传统教学模式以教师为中心,按章节顺序列举案例将知识点串联连起来,学生学完课程后感觉知识点零散,不能达到融会贯通的效果,不能根据企业需求独立完成网站规划、网页布局和制作网页的任务,学生所掌握的知识技能与企业需求脱节,不能胜任网页设计师的岗位要求。为适应企业对高职人才的要求,实现教学与就业岗位零距离接轨,以工作过程为导向,以职业岗位为中心,从教学理念、教学模式、教学内容、教学方法、考核方式等方面进行教学改革非常必要。

2教学改革的基本思路

《网页设计与制作》是典型的工学结合课程,主要特征是理论实践一体化,教学目标是训练学生编写HTML代码制作网页的能力,熟练使用Dreamweaver、Flash、Photoshop软件制作静态网站的能力,培养学生规划网站结构、建立管理站点、测试与网站的能力,培养学生网页设计创意思维能力和色彩感悟能力,培养学生具备“团队协作精神、沟通能力、获取应用知识能力、解决问题能力、自主学习能力、创新能力”等职业核心能力,使学生能从事网站编辑、网站美工设计职业岗位工作,养成良好的职业道德。

传统教学模式按照章节顺序讲解软件功能来组织教学,学生模仿老师上机实践被动接受知识,只学会了网页中文本、图像、超链接、表单、CSS样式、层和时间轴、表格、框架、模板和库、行为的操作方法,不能独立设计出符合职业岗位需求、技术运用合理的网站。因此,教学中要不断更新教学理念,将职业能力的培养贯穿教学过程,按照网站开发流程设计学习情境,每个学习情境划分为若干个任务,以真实的网站项目为载体组织教学,重视上机实践环节,重视学生校内学习过程与实际岗位工作的一致性,不断强化学生的专业能力和职业核心能力。

3教学改革的内容