网页的设计与制作(精选11篇)
1.网页的设计与制作 篇一
一、设计目的
通过一个月的网页设计学习,设计一个简单的网站来检测自己的学习成果,看看哪些东西还没有掌握,需要进一步的去巩固!网页的设计区别于实体化的一些东西,其多为多媒体的存在,意味着它可以容纳更多的信息以及更多的展示形式,网页设计则要求设计者具备一些特殊技能以营造特定浏览情景。网页设计可以在短时间内增强我们的洞察力以更好察觉使用者的兴趣点,只有这样才能满足他们的需要。
二、设计要求
运用所学的知识设计一个简单的网站,类型不限
三、需求分析
网页设计是将技术性与艺术性融为一体的创造性活动。网页设计是以功能行为第一指导原则,以技术因素为主要考虑对象,以完成或实现必要的功能为目标。近几年随着网络的发展而逐渐受到人们的重视,它本身已网络为载体,把各种信息以快捷、方便的方式传达给受众,在这种标准的要求下,逐步产生了审
美需求和功能需求等。人们对美的追求是不断深入的,网页设计同样如此。如何使受众能更好的和有效率地接受网页上的信息,这就需要从审美方面入手。网页设计的审美需求是对视觉设计美学的一种继承和延伸,两者的表现形式和目的都有一定的相似性。
网页设计的主题为我的篮球网,它是我根据自己的兴趣做出来的网站,内容非常简单,但却富有深意!它融合了当今大多数青少年朋友的兴趣爱好,可以说是一个大众化的网站!
四、制作过程的内容及结果
1、网站目录
打开dreamweaver cs4,建立站点,放到F盘里,在目录下有images(包括图片、flash)、scripts、shipin、web(建立的网站)文件夹。如下图示:
2、我的篮球网(首页)
主要代码:
2.网页的设计与制作 篇二
关键词:网页设计,网页制作,网页设计原则,网页体系结构
网页设计与制作的用户界面作为与用户打交道的门面,它在网站开发平台中占有非常重要的地位,因为它直接面对的是广大浏览用户。由于网页设计是计算机科学的一个专门研究方向,有其自身的原则、标准和方法,本章从简要介绍网页的一般设计原则和方法出发,结合网页开发的特殊性,系统阐述网页开发平台界面的开发和实现。
1 网页的设计原则
网页的设计除了要掌握页面设计的一般原则外,还要把握其特殊性,因为网页的主要功能是向浏览者提供信息,所以网页设计和其它应用软件设计存在一定的差异。总的来说,网页设计是一项既简单又复杂的工作。说其简单,是因为设计者只要遵守一项原则就行,那就是:设计者的设计应该增强而不是减弱网页所要提供的信息,不可喧宾夺主。说其复杂,是因为网页设计要考虑到很多问题的方方面面,需要有许多灵感和技巧在其中。
下面根据页面设计的一般原则,结合网页开发平台的实际情况,认为网页开发设计应遵循以下基本原则:
1)统一的风格
风格有三大特点:抽象性、独特性、人性化。
抽象性指网页的整体形象给浏览者的综合感受。这个“整体形象”包括站点的CI(标志,色彩,字体,标语)、版面布局、浏览方式、交互性、文字、语气、内容价值、存在意义和站点荣誉等等诸多因素。
独特性指本网页不同与其他网页的地方。或者色彩,或者技术,或者是交互方式,能让浏览者明确分辨出这是你的网页所独有的。例如新世纪网络的网页是黑白色的,网易壁纸站的特有框架,即使你只看到其中一页,也可以分辨出是哪个网站的网页。
人性化是通过网页的外表、内容、文字、交流可以概括出一个站点的个性、情操,可以用人的性格来比喻网页。
2)良好的交互
在网页设计中,用户通常根据所提供的交互方式进行浏览或操作,设计者在设计网页的页面时,应始终考虑如何提供良好的交互性:如主页的界面设计对浏览者来说是否具有吸引力;是否可以更好地引导浏览者访问站点;是否能保证用户简便、快捷、准确地操作网页;是否能为用户提供有效的帮助和出错信息;所创建的网页是否更加符合浏览者的需要。网页的交互操作主要集中在网页的多维超链接空间和网页的提交操作中。
3)视觉效果
视觉效果指用户在开始打开网页时的第一印象,好的网页能让浏览者产生强烈的视觉冲击,给浏览者留下深刻的印象。所以对于网页来说视觉效果是相当重要的,它主要体现在网页的色彩搭配、字体设置和排版结构上。
第一,网页的色彩具有精神价值,对人的心理影晌有时是直接刺激,有时是间接联想。设计者做到有针对性合理的用色,来体现网站适应人的心理需求和特色十分重要。那么如何搭配色彩来表达网站的内涵?色彩总的应用原则应该是“总体协调,局部对比”。也就是说网页的整体色彩效果应该是和谐的,只的局部小范围可以有一些强烈色彩对比,它包括网页的背景、文字、图标、边框、超链接等。首先,网页要有主色调,以确定网站的总体基调,充分利用色彩的象征性、职业的标志色、冷暖的感觉和时退的效果来展示网站的艺术内涵和文化品位。其次,网页的颜色搭配最好不要超过3-5种,网页的前文和背景的色彩对比要尽量大,特别不要采用花纹繁杂的图案作背景以便突出主要文字的内容。
第二,网页的字体设置包括字体的样式、效果和大小。选择贴切的字体有助于表达网页的内涵。对于网页的字体设置通常归纳以下几点内容:一是不要使用超过3种以上的字体。字体太多则显得杂乱,没有主题。二是不要用太大的字。因为版面是宝贵有限的,粗陋的大字体不能带给访问者更多信息。三是不要使用不停闪烁的文字。四是原则上标题的字体较正文大,颜色也应有所区别。
第三,网页的排版结构即网页的版面布局。版面是浏览器看到的完整页面,而布局指以最适合浏览的方式将图片和文字等内容排放在页面的不同位置。目前网页版面布局主要有:“T”结构布局、“口”型布局、“三”型布局、对称对比布局和POP布局。经分析、比较这些布局,得出在除了网页标题部分和结尾部分,网页中间的主体部分一般采用1:2、2:1或1:2:1的结构,这些结构都方便地、有条理地组织了网页的信息。当然,这并不意味着一定要采取这些组织结构,只要能够合理地组织信息、便于交流,采用其他更为灵活的结构方式也是可以的。
2 网页体系结构的设计
网页设计平台可以运行于任何的浏览器。相应的用户界面需要同时考虑微软的IE浏览器和网景的Netscape浏览器,同时用户界面也需要符合这些浏览器的标准。从设计的角度,把网页开发平台用户界面划分为两个层次:用户界面元素的设计和交互操作的设计。
2.1 用户界面元素的设计
用户界面元素是指一些具有特定功能和操作方式的可视化图形对象。在不同的应用系统中,有不同的用户界面元素。在浏览器中,用户界面元素包括:浏览窗口、图形图像、表格、链接、框架、表单、按钮、对话框等。用户界面元素设计的内容包括采用哪些界面元素、界面元素的定制、界面元素的如何布局以及界面元素的管理等。
2.2 交互操作的设计
交互操作设计是指用户如何通过输入设备和各种界面元素,实现人机交流信息的目的。由于网页开发平台是在WWW浏览器下运行的,交互的过程是通过表单块提交操作或链接方式来完成的,即用户通过鼠标和键盘在界面元素上触发相应的事件,软件接收到事件后,作相应的处理,然后将结果通过界面元素或其他途径反馈给用户。交互设计的关键在于如何利用各种界面元素,定义自己的交互操作规范并进行管理。
2.3 网页布局的设计
网页开发平台的页面布局总体上遵循了上面所介绍的设计原则。通常情况下,根据网页开发平台的整体组织结构,可以分四类页面:首页的页面布局、后台管理页面布局、导航主题页面布局和一般消息页面布局。下面以个人网站为例,分析各类页面的布局设计:
1)首页布局
首页的整个布局可以采用“三型”结构,而中间的主体部分可以考虑采用比较清晰简洁的结构。网页主色调则根据网站的内容选择合适的颜色,不易采用太过于鲜艳的色调。此外,任何网页均有标志图片log,可放在左上角,右上角则放置整个网站的导航栏,版权信息通常放置在首页的底部。
2)后台管理布局
后台管理的页面布局可以采用“T型”结构,用框架把整个浏览窗口分割成三部分,上面是后台管理的标题及标志图片,下面的左边是后台管理的集中菜单,采用out Look风格,右面显示的是各菜单要完成的任务。
3)导航主题布局
导航主题页面的布局可以采用与后台管理页面类似的“T型”布局,用框架把整个浏览窗口分割成三个部分,上面为导航栏和网站登录模块,下面左边为所选择导航主题的第二层主题或内容列表,右边为相应的网页内容。导航主题页面的结构可以采用树型的分层次结构模型,不但有利于动态管理,而且也有利于浏览者对各种主题内容的访问。
4)消息页面布局
消息页面布局通常比较简法,由上、中、下三部分组成,即采用“三型”结构,首部是网站的标志图,中部是消息的主体,包括导航条、标题和内容,标题的颜色可以选择采用棕红色的大字体,起到醒目作用,正文采用默认的黑色小字体,尾部是版权。
3 网页的制作技术
3.1 网页统一版面技术
由于网站中的网页要求有统一的风格和良好的视觉效果,即要求网页有统一的版面,由于级联格式页(CSS)技术能集中管理WEB站点的格式元素(字体、背景、文本、边界和清单)和定义全局的版面格式,所以在我们的网站设计中大量地应用了该种技术。
为使网页开发平台利用CSS技术统一风格,实现版面设计,在页面套用CSS技术不是用直接法或导入法,而是用了链接CSS文件法。其方法如下:当多个网页页面采用统一的风格需要套用CSS文件时,首先需要建立CSS格式页。CSS格式页文件的内容与普通的HTML文件相同,都是一般的文本文件,只是扩展名为CSS,在CSS格式文件中,不需要用
参考文献
[1]胡珊.浅谈个人网页的制作[J].经营管理者,2008(9):25-27.
[2]洒玉波.浅议网页艺术设计流程[J].现代技能开发,2003(5):77-79.
3.网页的设计与制作 篇三
【关键词】网页制作;教学;设计
早在20世纪初,我国就已经把“网页制作”作为高校基础课程的内容。“网页制作”不仅能提高学生对信息技术的应用能力,还能提升学生的动手能力和设计、规划能力,有利于促进学生的全面发展。在近年来的实践中,“网页制作”课程的开展已在高校取得了较好的效果,在培养学生团队合作、自主创新能力方面都取得了卓越的成效。
1.教学现状
网页制作课程包括设计软件的学习和设计技术的学习两部分。一般高校的计算机技术管理等专业都会设置一定的网页制作课程来提升学生的网络技能。
在课程设置上,一般院校都会在学生进入大二后开设网页设计课程。主要原因是,网页制作包含了较多的网络技术语言,且考查到了学生对信息、设计的知识的综合应用,需要在大一阶段打好理论、技术的基础。
网页制作课程的教学内容主要包括程序设计语言、数据库原理等。其中程序语言包括了C语言,C++语言,Java语言等,数据库原理则分为Access数据库基础,VFP数据库基础等内容。学生可以根据自己的专业情况和学习进度从中做出选择和组合。
2.教学目标
网页制作课程的总体教学目标是,使学生通过对相关网络技术基础内容的学习和实际的上机操作,掌握一定的网络技术应用能力,并在此过程中培养学生的自主创新能力和团队协作精神。其中具体的教学目标有以下几条:
2.1 知识目标
在进行网页制作前首先要掌握一定的网络基础知识和软件操作流程。例如Dreamweaver是网页制作中十分常用的一种软件。在进行网页基础知识的学习时要对软件菜单栏、工具栏等项目的操作方法进行熟练掌握。对于一些基本的编辑、排版技术也要做到有一定的了解。具体应掌握的技术有表格绘制、排版的技术,动画、音频的处理技术,网页编辑、链接的技术,图形绘制晕染的技术等。
2.2 技能目标
技能目标主要指根据现有的网页内容,通过模仿、修改等方式初步完成网页的制作。在网页中应包含一定的解释、说明文字,与文字相对应的图片、符号及一定的动画、切换效果等。在进行网页内容的排版时,可借助一定的表格划分内容结构和层次,还可给网页配上一定的背景图片和音乐以丰富网页内容,增加网页的观赏性和完整度。
2.3 情感目标
情感目标主要包括学生在进行网页制作时培养的团体合作、自主创新及操作动手等能力。与此同时,学生在学习网页制作的过程中也相应地提高了鉴赏能力和学习能力,给未来的职业发展打下了一定的基础。
3.网页制作课程的内容
网页制作课程的教学内容主要包括网站制作基础知识、网页制作、网页特效、网页图像处理和动画制作等四个部分。其中,网站制作部分会涉及到网站和网页概念的区分,网站设计语言等内容;网页制作则会应用到Dream Weaver,FrontPage等网页制作软件;在网页特效部分,会着重介绍JavaScript、Gif图片的制作;在网页图像处理和动画制作上则会应用到Photo Impact和Flash动画制作软件。
4.网页设计课程的设计思路
尽管我国许多高校都开设了网页设计这一课程,但由于课程设计、操作设备等条件因素的限制,其实施效果并不理想,制作出的网页也难以达到实际使用标准。造成这一情况的主要原因有两个。首先是网页色彩的搭配不符合审美的要求,其次是网页内容的安排缺乏一定的合理性和规范性。网页设计课程的作用就是帮助学生在审美、设计等方面获得全面的提高和成长,因此在设计教学内容时,必须综合考虑到各个方面,设计出相对科学、高效的网页设计培训课程。
在教学进度的设置上,可以采用分部教学的方式,将一些具有难度的项目分解为几个部分进行教学。例如几个网页制作软件的应用,对于初学的学生而言具有一定的難度,教师在教学时可以先从基础知识入手,使学生对软件的用途有一个整体的把握。其次,在分部讲解软件中所包含的功能,使学生在实际操作中逐渐掌握软件使用的方法。
课程设计必须充分遵循学生学习、进步的一般规律,切实提高学生网络技能。为达到更好的教学目的,教师在教学时应注重根据学生的学习兴趣进行教学安排,充分激发学生的学习动力,提高学习效率。同时,在教育形式上也可进行一定的创新,充分利用网络资源,为学生提供更多的学科信息。在学习不同内容时,也应采用不同的教学模式。例如在学习网页制作的相关理论知识时,要注重教学语言的简洁、生动,使学生能在短时间内理解网络应用语言和网页图像符号;在网页制作过程中,应着重培养学生的自主创新能力和编排规划能力。在设计网页内容时充分保证学生的自主性,让学生根据自己的审美情趣和专业技巧对网页内容进行安排。教师在这一过程中主要起到引导作用,在学生遇到技术性困难时给予一定的指导和帮助,使学生能在具体的操作过程中,培养起一定的自学能力和创新能力。为提高学生的相互协作能力,教师还可建立合作小组,对一些重点难点的内容进行小组分工。在具体实施工作上,则由小组组员自主安排,在保证了小组合作的同时,也强调了学生学习的自主性。
5.教材分析
我国大部分高校在进行网页制作教学时都采用了《Dreamweaver中文网页制作基础》这一教材。这本教材的最突出优点就是采用了设置任务的模式完成网页制作的教学。在每一章内容的介绍中,教材中都会设置相应的教学任务和实用案例。学生在完成任务的同时,对教材中涉及到的基础知识点和操作技巧都进行了应用,并在不断操作中强化了记忆,相较于传统的教学模式,更有利于学生对知识的掌握和应用。另一方面,这本教材的内容设置充分遵循了学生的学习规律,并把握好了重点。在教材的前半部分是对网页设计基础知识的简介,其中包含了对数据库软件、Office应用软件、Flash软件等软件的操作规范和说明,使学生在进行实际的上机操作前,对这些基础知识点有了较为全面的把握。教材的重点放在了网页的设计过程上。教材对网页设计的步骤进行了详细、具体的说明,并通过文字和图形结合的方式向学生展示了一些具体操作流程,学生能在较短时间内掌握设计方法,完成网页的自主设计。
6.结语
网页制作是一门综合性很强的学科,对学生的理解能力、设计能力、审美情趣及动手操作能力进行了综合的考查。同时,对于教师而言,网页设计课程的开展也考查了教师的授课能力和创新意识。在网络技术日新月异的今天,掌握好网页制作技术有利于开发学生的创新精神和合作精神,提高学生的综合素质。
参考文献
[1]王晓晴.浅谈“网页制作”之网页版面的教学设计[J].计算机光盘软件与应用,2014(2):31-34
[2]薛巧梅.任务驱动教学法在网页制作教学设计中的应用[J].武汉船舶职业技术学院学报,2013(5):69-71
[3]高晶.浅谈任务驱动教学法在网页制作教学设计中的应用[J].中国校外教育(基教版),2012(12):99-102
4.网页制作教学设计与思考 篇四
[关键词]信息技术/网页制作/任务驱动
中学信息技术课程的任务是培养学生的信息素养,具体包括快速获取信息的能力,正确地评价信息,有效地利用信息和准确地表达信息。因此,信息技术课也应以信息处理为主线来展开,而不该成为单纯的计算机应用软件操作课。以“网页制作”为例,整个制作过程对学生获取、评价、表达和利用信息的各项能力都是一种培养和锻炼。下面,笔者就这一单元的教学设计做具体阐述。
一、教材分析
我校目前使用的教材是江苏省中小学教学研究室编写的高一《信息技术》。网页制作是其中第五章的教学内容。在这之前,学生已初步掌握了网络通信的基础知识,因特网的信息服务,网络信息的搜索、浏览和下载,以及电子邮件的使用等内容。因此,学生已经具备了获取信息的能力,网页制作单元就可侧重培养信息表达的能力,这对于加强学生的信息意识,提高信息处理的能力有着重要的作用;网页的设计也给学生提供了展示个性、自主创新的机会,促使他们主动地学、创造性地学;网页的评价则能使学生了解内容编排的原则,页面布局的种类,色彩搭配的风格等,提高他们的艺术修养和审美情趣。
教材中采用的网页制作软件是FrontPage2000。由于FrontPage2000采用了与Word等其他Office软件相类似的图形操作界面,可以自动生成Html代码,轻松实现网页发布。在第三章,学生已经学过了Word字处理软件。因此,对FrontPage2000的启动、关闭、文件操作、文字编辑和图片处理都会有一种似曾相识的感觉,这种知识迁移对后续的学习非常有利。
二、设计思想
1、任务驱动
本单元的学习通过完成网页作品来实现。班级网页的信息来自学生生活的班集体,每个热爱班级、关心班级的同学都能产生一种急切地完成任务的动机,而完成任务又能给他们带来成就感和满足感。这种心理上的内在动力驱使学生自觉地把计算机作为一种信息处理的工具来使用,由“要我学”变成“我要学”。在教学中,教师通过创设情境,激发学生的创作欲望,把总任务划分到每节课,按照学生的制作进度来布置子任务,使学生在教师的引导下逐步达成教学目标。
2、小组协作
制作班级网页是个大任务,具有一定的开放性和综合性。因此采取小组协作学习的方式是非常必要的。小组成员的知识程度、学习能力和思维方式都有差异,可以通过讨论、交流与合作,取长补短、拓展思路。每个学习小组由6-8人组成,每人负责制作1-2个页面,组合成一份班级网页。最后,各小组作品集中评比,选出优秀作品,上(转载自本网http://,请保留此标记。)传到校园网上公布。
基于资源
要培养学生的信息能力,就必须为他们提供大量处理信息的机会。基于资源的学习就是让学生接触到丰富的学习资源,为学生的知识构建提供支撑。笔者采用ASP技术自主开发了一个信息技术学习网站,该网站具有强大的交互功能,不仅能为学生创设丰富的资源环境,还为每个注册用户提供个人空间,支持作品的上传或下载,并开辟了学生论坛和教师答疑,供师生们交流和讨论。网站的使用不仅方便学生的学,还能改善教师的教,也为师生间的交流提供了虚拟空间。
三、学习目标
本单元的认知、情感和动作技能三种目标分述如下:
认知目标
1、能简要陈述FrontPage2000主要功能,熟悉其操作界面
2、能用自己的话解释下列术语:HTML,URL,网页,主页,超链接
3、能主动获取、收集班级信息,并加以分类和整理
4、能客观评价网页的内容和风格,具备一定的审美能力
情感目标
1、具有集体荣誉感,愿意为班级的网页建设出谋划策
2、具有乐于助人、团结协作的精神
3、能尊重他人的劳动成果,有保护知识产权的意识
动作技能目标
1、能熟练地建立、打开、保存、浏览网页文件
2、能按照需要建立框架网页,设置各框架中的初始网页
3、能在网页中熟练地插入文字、图片、动画、水平线
4、能使用简单的表格编排网页内容,使网页的结构清晰,内容整齐
5、能选择合适的网页背景图案和背景音乐
6、能根据实际需要使用不同的超链接,合理地组织网页
7、能在网页中插入悬停按钮、滚动字幕和横幅广告管理器,使网页具有动感
8、能够插入简单的表单,使网页具有初步的动态交互功能
四、学习资源设计
在基于资源的学习中,教师的任务就是收集、设计和管理学习资源,引导和帮助学生自主地查找并获得学习指导,通过师生间、生生间的交流与合作,完成知识的建构和技能的提高。因此,学习资源的设计尤为重要。本单元需要的学习资源包括以下部分:
1、推荐给学生的网站地址链接,如门户网站、班级网站、搜索引擎、信息技术网站等
2、本单元学习的目标和任务,以及每课时的子目标和子任务
3、教师对班级网页栏目的划分建议,如同学档案、教师风采、学习园地、班级活动、休闲娱乐、班级留言板、酷站链接、站长信箱等等
4、根据每课时的学习目标制作的操作指导,包括操作界面的演示
5、网页设计所需的各种素材,如图片、动画、Midi音乐等等
6、拓展学习材料,如Photoshop、Flash、Asp、Access等技术资料
7、Frontpage2000的帮助系统和信息技术教材也是重要的学习资源
5.网页的设计与制作 篇五
任务导向法高职在《网页设计与制作》实训课程中的应用
陈雪娇
(辽宁理工职业学院,辽宁锦州 121007)
摘要:随着职业教育的蓬勃发展,传统的教学方法在课程中亟待改进。本文主要研究在任务导向法的指导下,对实训课的教学过程进行重新设计,对教学目标重新定位,选取任务为导向的教学内容,建立多元评价体系,构建新型的教学关系。关键词:任务导向;课程设计
《网页设计与制作》是一门实践性很强的学科,授课过程的实践表明:“任务导向法”在本课程中的能够促进学生学习的积极性,它符合素质教育以学生为主体、教师为主导的思
①想,同时也符合教育理论“乐学教育”、“愉快情感”的教育思想理念。
一、基于任务为导向教学目标的确定
高等职业院校《网页设计与制作》课程旨在培养计算机前台网页制作人员,因此,该课程应以行业需求确定为培养目标,以实践能力为目标实施教学活动,用多元的评价机制评价
②教学效果,并突出以能力为主的理实结合的教学目标。
教师可以将《网页设计》课程分为3个模块:运用PS对网页进行效果制作;运用Dreamweaver软件搭建网页、运用 PS、Flash 软件为网页制作 LOGO 及广告动画、三个软件的综合使用,并分别确定如下目标。
(一)能力目标
能够具备规划网站能力,编写网站策划书;能够进行网站效果图设计及网站动画设计;能够应用新技术DIV+CSS进行网站布局,进而进行静态网站的开发与制作。
(二)知识目标
掌握 Dreamweaver 的工作环境、菜单、工具栏的使用方法;掌握新建网站的方法、文档的保存方法;掌握网页的编辑技术;掌握网页超链接的插入和编辑技术;掌握表格、布局表格、单元格、框架、层的辅助定位工具操作;掌握文本、图片、动画、视频的插入、编辑、格式设置的方法;掌握利用 PS 制作处理网页中所需图像的操作方法及图像格式转换技术;掌握基本动画和高级动画的制作。
(三)素质目标
培养学生的敬业精神、团队协作神;自主学习能力;沟通能力、感悟能力;表达能力、知识应用能力;获取知识能力、自我发展能力、创新能力;责任感、效率观念。
二、基于任务为导向教学内容的选取
教师根据划分的模块可以将整个项目分为2个子项目,每个子项目对应的子任务如下:
(一)用ps制作网页效果图
制作 LOGO 及广告动画制作网页动画;制作网站LOGO、最终形成网页效果图。网站风定位、网站布局设计、网站草图绘制。
(二)搭建网页
组织和管理网页文件和文件夹;进行网页布局;超链接的制作和编辑;网页元素的插入和编辑。处理网页中的图形图像制作和处理网页中所需的图形图像文字边框等素材。
三、基于任务为导向教学过程的实施
本次教学实训主要是以学生的独立分析、研究、实践为主,教师的传授、指导和共同参与展开的。
(一)实训内容分析 本次实训的主要内容就是设计制作PS网页效果图,并通过效果图完成制作网页。
(二)实训过程分解 1.任务解析
本项目属于企业类网站,在前面学习的基础上可将这类站点的开发简化为:项目的前期策划、效果图设计、动画设计制作、网站静态页面的编辑。
2.学习资源的发布
明确任务后,教师帮助学生理解任务、分析任务、分发各种图标及素材等,收集好所需资源。
3.计划与决策
在教师的建议下分组,明确分工,细分任务,按照计划开展进度。教师要实时关注学生进度,提出可行性建议和知道意见,形成可行方案。
4.实施
教师下达学习任务,学生根据任务做好计划,对于重点难点进行讲解和分析,学生做好知识点记录。对于重点难点,教师先行演练,学生同步跟练。简单知识点可以学生自主学生,商讨学习,自己解决完成任务中遇到的问题。
(三)“双品”转化
“双品”转换,即作品到产品的转化。是在临摹学习过后,自行设计一套产品,这既是从学习到创作的提升;也是学生学习领域到职场领域的过度。鼓励学生自己设计一个完整的网站,实际是将网站欣赏、网站规划、效果图设计、网页布局设计等教学模块进行重构和细化,在自己的创作中不断发现和解决问题,对实训课程之外的另一种强化和延伸。从学生的作品与产品中,不可否认学生已经熟练了网页的制作软件:Ps、Flash、Dw,但是作为一名专业从事网页工作的设计师,除了掌握这些,还需要在视觉素养方面更上一层楼。否则,我们的学生只能是工匠,而不是设计师。
四、基于任务为导向教学评价的确定
课程的评价模式通过多方面相结合综合评价学生的知识掌握情况、技能水平和综合素质,学生自评、学生互评、综合评定多元评价模式,过程评价与最终结果评价相结合。
五、总结
总之,教无定法,重在得法。以项目为载体、以任务为导向的教学方法能够调动高职院校的学生学习积极性。学生在进行项目设计时,操作更加灵活,展示自己的思路,从而更主动地参与到教学活动中来,促使学生为完成项目而进行多渠道的自主学习,让学生能在知识的学习和将来的工作岗位间实现零距离接触,为学生走向工作岗位奠定一定的基础。
参考文献:
6.高职《网页设计与制作》说课 篇六
1、课程的定位与目标
《网页设计与制作》是计算机专业的专业骨干课程, 作为一门培养学生网站开发的课程, 对学生网页设计与制作能力的培养和职业素养起主要支撑作用, 对职业岗位能力培养方面的作用不可或缺。
本课程在整个课程体系中处于承上启下的核心地位, 在第三学期开设, 该课程可为后续课程提供静态网页设计与制作的理论基础和操作技能。以计算机应用基础、图形图像处理、FLASH动画制作为前导课程, 并为后续课程动态网页设计课程打下良好基础。本课程的学习有助于学生深入学习计算机类相关专业其他知识和提高职业技能, 完善学生的专业知识结构, 提升学生从事实际工作的综合素质。
知识目标:
·掌握网页编程基础html相关知识;
·熟练掌握网页中元素属性设置方法;
·熟练掌握网页页面布局的各种方法;
·掌握表单网页制作方法;
·掌握网页特效的制作方法;
·掌握网站测试的方法。
能力目标:
·培养学生收集、处理信息, 准备、加工素材的能力;
·培养学生制作网页、设计网站的综合能力;
·在网页中编制需要的脚本, 进行网站的上传下载、更新管理;
·培养学生运用所学的理论知识和技能解决网站实际问题的能力。
素质目标:
·具有勤奋学习的态度, 严谨求实、创新的工作作风;
·具有良好的心理素质和职业道德素质;
·具有高度责任心和良好的团队合作精神;
·较强的自我知识及技术更新能力。
2、课程设计理念与思路
课程设计理念:
本课程根据高职教育的特征, 以计算机职业能力培养为重点, 以行业为依托, 将"面向过程"、"项目导向"、"工学结合"、"任务驱动"作为课程开发与设计的基本理念。
课程设计思路:
课程设计将面向工作过程的项目教学、任务驱动教学、案例教学的教学思想融为一体, 将网页制作视为一个整体项目过程, 打破传统网页教学的条块界限, 网页实际项目制作过程作为课程的教学主线。充分体现学生主体地位和教师的主导作用, 培养学生的自主学习、协作学习能力, 培养学生运用所学知识解决实际问题的能力;以培养职业能力为核心, 以案例项目教学为主要手段, 积极探索教学方法与成绩评价方法的创新, 保证课程目标的实现。
3、学生基础与智能特点分析
学生主要来源于本省, 计算机基础相对薄弱。在教学中发现学生的学习热情很高, 善于思考和发现、分析问题, 作为教师, 要注意保护学生的学习积极性, 运用任务驱动、案例分析等教学方法和手段调动学生的学习兴趣, 同时要培养学生养成良好的学习习惯。
4、教学内容选取与教学组织安排
教学内容:
本课程根据网页设计与制作的岗位实际需求的知识、能力、素质要求选取教学内容, 课程教学内容分为四大部分:
第一部分网页制作的基础知识:这一部分内容将针对培养学生分析设计网页整体设计能力, 以使用学生对网页制作的常用工具、开发流程、常用版式等内容有个总体把握。
第二部分HTML语言:这一部分内容讲授网页制作的基本语言HTML, 主要是针对培养学生对网页代码的分析理解能力, 掌握HTML可以更方便更灵活地控制网页。
第三部分Dreamweaver:这一部分是全部课程的核心, 在图形图像处理、Flash动画制作等前序课程基础上讲授网页制作工具Dreamweaver, 使学生具备布局设计、网页编辑、媒体应用、特效制作、发布与管理网站的基本能力。
第四部分网页制作综合实例:这一部分通过一个实际网站的设计与制作使学生具备网页制作与管理的实际能力。
在实际教学中, 遵循学生网页制作能力培养的规律, 以网页的实际制作过程为教学内容依据, 将教材的内容进行整合, 对教学顺序进行重新安排, 合理设计课程目标任务, 让学生在做中学, 具体如下:
5、教学模式、方法、手段
教学模式:本课程采用理论与实践紧密结合进行教学, 将面向过程、项目导向、工学结合的理念贯穿于整个教学过程之中。
教学方法:为提高学生学习积极性, 我们采用多种教学方法以提高教学效果。
教学手段:
(1) 利用现代化教学手段, 在网络教室应用电子教室进行教学。
(2) 在投影教室中, 利用课件或演示实例, 优化教学过程, 提高教学效率。
6、教学考核评价
根据网页制作岗位职业能力及职业资格标准要求, 制定了本课程的教学评价方案。采取过程考核和期终考核并重的模式, 考核分“团队考核”和“个人考核”, 强调软能力的考核。总成绩构成:课程考核总成绩=平时成绩20%+平时教学项目50%+期末综合作品30%, 突出体现了过程化考核, 培养学生实践动手能力和团队合作能力。
7、教学资源
(1) 师资
校内专业教师和企业专家能手。专任教师具有相应专业本科以上学历, 具有相应的职业资格证书, 同时具有一定的企业工作经历。
(2) 实训室
建有独立的局域网, 配备多媒体教学系统:广播教学、学生演示、文件传送等。
(3) 教材与教参
教材:《网页设计与制作案例教程》, 陈承欢等编著, 人民邮电出版社出版, 2010年。
教参:《网页设计与制作》, 周连兵主编, 中国石油大学出版社出版, 2010年
(4) 网络资源:高职院校的网页精品课网站, 网页素材、视频网站等。
结束语:
说课的功夫在于说课之外。说好课, 必须有一个好的教学设计, 必须对课改、教改有全新的把握, 扎实开展教学研究。说课时, 让同行、专家感觉学习该课程有意义、有兴趣、有成果, 达到愿学、爱学的目标, 这样的说课才能让同行、专家接受, 产生共鸣。
摘要:说课是高职院校人才培养工作评估中一项重要内容, 是考察学校人才培养工作状态与质量的重要途径。本文介绍了《网页设计与制作》课程说课的主要内容。
关键词:高职教育,说课,人才评估
参考文献
[1]陈琼.运用“五问法”写好高职专业课说课稿.职业教育研究, 2010.8.
[2]柳遂文.对高职院校“说课”的几点认识.黄冈职业技术学院学报, 2011.4.
7.网页的设计与制作 篇七
关键词:工作过程 网页制作 课程开发
【分类号】TP393.092-4
《网页设计与制作》课程是一门技术性,实用性及操作性很强的课程,已经成为众多高职院校网站开发、电子商务、计算机等相关专业开设的热门课程,网站建设与维护也已成为相关专业学生必备的一门技能。当今网络时代,Internet以网站的形式存储了海量的信息,通过网页的形式进行信息展示、互动交流、产品购买已渗透到人类社会生活的诸多领域。目前,社会各工作领域中网站建设、开发与维护的技术人才需求量极大,亟需要具有相应技能的岗位人才。
《网页设计与制作》这门课程培养的是学生的网站策划能力、网页设计与制作能力及网站的管理与维护能力。在整个网站建设与开发过程中,该课程起到基础性及支撑性的作用。传统的课程教学方式通常按照知识技能的学习顺序进行教授,学生在每一部分相对独立的教学内容中只能学到网页制作中的局部内容和技术,这种方式使整个学习过程变得零碎,最终学生缺乏整体建设网站制作项目的能力。因此,基于工作过程进行课程的开发,使学生能够在项目中熟悉工作流程,提高网站建设的综合能力,将极大的有利于学生职业能力的培养。
1、课程的地位与作用
《网页设计与制作》课程是山东传媒职业学院网站规划与开发技术专业、计算机多媒体技术专业的一门专业核心课程。根据我院立足广播电视行业、面向社会、培养高端技能型人才的总体培养目标,这些专业均要求面向广播电视(网络电视、手机电视)、各企事业单位网站、网站开发公司、广告公司和中小型网络推广公司等单位,培养能够在网站策划与编辑、网站前端工程师、网站程序开发工程师、网站运维及手机客户端开发等岗位上立足的技能人才。《网页设计与制作》课程作为培养以上岗位人才的主干课程,主要是培养学生在从事网站开发设计及网站管理等技术支持行业,针对网站策划与编辑、网站前端工程师等岗位,培养具有网站策划与编辑、网页设计与制作、网站管理及维护等技能,并具备一定的综合分析解决问题的能力,创造创新能力,及具备团队精神和责任感的全方位职业素养的人才。
分析该课程在以上专业岗位课程体系中的地位,如图1所示,该课程处于整个课程体系的中间环节,具有极其重要的地位和作用。其前导课程是计算机应用基础、计算机网络技术、计算机图形图像(Photoshop)、Flash动画设计,后续课程是Javascript、动态网页设计(php)与mysql数据库技术、网页设计综合实训等。该课程所处的地位具有至关重要的作用,它要求学生在掌握前导课程的知识技能基础上,要具备一定的综合应用能力;同时该课程的学习又与后续其它专业课程的学习有着千丝万缕的联系,并给它们提供一个重要的知识基础平台,实现网页前端设计代码与交互效果代码、后台功能代码的融合。该课程在岗位课程体系中具有重要的作用,课程培养的关键职业能力是网站策划、网页设计制作及网站管理维护能力,因此该课程直接面向的具体岗位有网页美工设计师,网页前端设计师,网站交互设计师、网站管理维护人员等。
2、基于工作过程的课程开发理念
根据高职高专院校培养高端技能型人才的培养目标,坚持以培养职业能力和职业素质为本位的课程观,树立基于职业岗位工作过程的课程开发理念。课程设计始终贯彻以“工作过程为导向”、“工学结合”的思想。通过深入网站设计开发的公司企业进行岗位职业能力与工作过程的调查。在课程设计时采用模仿实际的工作过程及工作任务进行课程开发。
课程设计采用基于工作过程的项目化课程教学设计。依据工作过程将课程内容按岗位职业能力进行整合、划分与安排,将课程內容划分成若干个项目学习模块,并在每个项目模块下设置多个学习任务,将岗位职业技能融入到其中,实现“以项目为导向,以工作任务为基础,以任务驱动方式”引领学生进行技能的学习。项目模块的内容既要符合实际的工作过程,也要在教学顺序上兼顾学生的认知规律,使学生循序渐进的全面掌握课程知识技能。教学过程本着“以学生为主体,教师为主导,训练为主线”的方式,坚持以学生动手为主,配合讲练结合,师生交流、学生协作等方式在专业实训室完成相应的工作任务,培养学生的实践应用能力,设计创造能力及团队合作能力,养成学生良好的职业行为习惯、职业能力与职业素养。
3、课程开发过程中教学项目的组织与设计
要学习网页设计与制作,首先必须先进行网站的规划,并掌握本地站点及WEB站点的安装与配置,在此基础上才能进行网页的制作与预览。然后再遵循由单一网页设计到主题网站设计的思路进行由单一到复杂的教学项目的设计,同时在网页设计及网站设计项目中又分别根据网页的布局方式,网站的主题等进行分类学习和制作。最后在通过课程学习所掌握的能力基础上,由学生分组完成一个主题网站的设计与制作,使学生的专业能力、自主学习能力、职业能力得到进一步提升和锻炼。
因此,结合课程的培养目标,遵循循序渐进的学习规律,基于工作过程进行课程开发,对教学内容进行整合与排序,把课程内容设计成一系列由点到面教学项目,共分为以下六个项目模块,分别是:(一)网站规划基础、(二)HTML CSS简单网页制作、(三)DIV CSS高级网页制作、(四)个人网站制作、(五)公司网站制作、(六)网站综合实训。每个项目模块的教学内容又包含若干个学习任务。六个项目模块及所包含的任务始终围绕课程的培养目标展开,在教学过程中由易到难的培养学生网站整体规划能力、网页效果图设计能力、网页素材制作能力、网页布局技术、网页交互效果制作、网站测试及网站的管理维护技能等。教学项目的开展依据工作过程,并在整个教学项目设计中实现由易到难,由单一到综合递阶式的学习方式,便于学生接受和学习。教学项目设计的层次结构如图2所示。
在课程开发设计过程中,教学内容的选取尤为重要,首先课程内容要与行业企业的岗位技能需求相一致,保持教学内容的先进性,实用性,及与工作岗位的一致性,做到“学以致用”;教学项目的学习顺序既要符合工作过程,也要充分考虑学生的认知规律,按照六个模块分阶段循序渐进的展开教学;教学重点的选取遵循课程培养目标,同时主张为后续课程的学习打下夯实的基础,教学重点内容主要有HTML网页结构的制作、CSS样式表的制作及网页布局技术等,这在每一个教学项目中都占有较大的学习比重。教学内容的制定始终体现以职业能力培养为目标的课程教学。
4、总结
8.网页设计与制作实训报告 篇八
设计题目:起止日期: 工作室或公司网站设计
2013.12.23-2013.12.27
目录
一、关于网站 ···························· 3
1、网站的主题 ·························· 3 2.网站材料 ··························· 4
二、网站的规划设计 ························· 5 1.网站的功能定位 ························2.站点的内容 ··························3.站点的风格 ··························4.网站功能模块图 ························三.网站技术解决方案 ························
1、网站的制作工具 ························
2、所用技术 ···························四.网页介绍 ····························
1、制作网站的网页 ························2.第二层展示 ··························3.动漫排行榜展示 ························4.第三层展示 ··························5.关于短片的插入: ·······················五.关于我们: ···························六.实训总结: ··························· 2 5 5 6 6 7 7 8 9
13 14 14
一、关于网站
1、网站的主题
我的网站的主旨在于从各个方面全面的介绍动漫,展示动漫产品以及漫画,包括有动漫排行榜,小短片,另外,网站里还有漫画,以及周边产品。建立一个展示动漫的平台。同时,网站里的每一个网页都有统一的风格,每一个网页的主题都是图片加上文字介绍,用以展示自己性格的效果。最重要的是做出自己的风格,给浏览者好的欣赏感受。
动漫,是动画和漫画的合称与缩写,取这两个词的第一个字合二为一称之为“动漫”。
现可考证,该词语出处为1993年创办的动漫出版同业协进会与1998年创刊的动漫资讯类类月刊《动漫时代(Anime Comic Time)》,后经由漫友杂志传开,因概括性强在大陆地区的使用开始普及起来。在中国以外,并没有此种说法。国外习惯性将动画(anime)、漫画(comic)、游戏(game)三者合称作ACG,或加上轻小说(novel)合称为ACGN。
由于漫画本身的发展形成了现代故事漫画的表现形式,将影视艺术融入漫画之中,使得漫画与动画更容易结合,影视艺术独特的地方在于它能通过镜头的推拉摇移和片段剪辑的蒙太奇技巧来表达想法和感受。
漫画正是吸收了影视艺术的这两个特点。当要讲述的故事越发复杂、人物越发丰富的时候,用传统单线式叙事的方法就越行不通,蒙太奇的介入就成为一种需要了; 当漫画家在传统表现手段中无法找到更合适的抒发感情的方法的时候;当读者需要作品有更强的冲击力和表现力的时候,各种镜头的灵活运用就成为一种必需了。一部现代故事漫画往往集远、中、近、特四种镜头于一身,漫画家往往能熟练地运用镜头的移动和各种蒙太奇剪接,对故事特定部分的情绪和氛围进行渲染。这就是现代故事漫画容易和动画结合的一个原因,因为它天生就像动画的分镜头剧本,读者在看漫画时仿佛就是在看一部电影。正是有着这样的相似性,所以如今将动画和漫画合称为“动漫”。
动漫领域衍生出的许多术语均已经被广泛应用,例如:正太,萝莉,御姐,百合,BL等。
动漫产业日益与游戏产业结合紧密,在日本已经形成一个成熟的产业链,动漫已经 3 从单单的平面媒体和电视媒体扩展到游戏,书籍,网络,玩具等众多领域。许多动漫游戏应运而生,例如《死神bleach》PSP平台的游戏,也有许多GALGAME被改编成动漫作品。
Manga(まんが,manga)为日语“漫画”的罗马字注音。另外,英文词cartoon的中文音译“卡通”,也是漫画与动画的合称,但被用来特指美国动画。版面有限,相关词条,详见:“动漫概论” 按类型分类:
情感;推理;动作;战争;后宫;宠物;历史;搞笑;机战;少年;冒险;治愈;童话;格斗;
少女;悬疑;科幻;竞技;社会;神魔;热血;校园;耽美;原创;魔法;教育;恐怖;惊悚;
政治;哲理;经典;励志;伦理;恶搞;血腥;言情;暴力。按版本分类: 电视动画(TV):
电视频道上播映的动画作品。
剧场动画(MOV):影院公映的动画作品,是日本动画按传播方式分类的一种,在中国又被称为剧场版。
OVA(OAD):原创动画录影带,其中OVA是单独发售,OAD是随书发售的。网络动画(NET):以网络为播放平台的动画。
动画音乐:一部动漫作品中的音乐,包括主题音乐和背景音乐(BGM)。
动画原创:依漫画改编的动画,由于动画的更新速度比漫画快的关系,当动画的剧集快赶上漫画时,动画的剧情就要脱离漫画剧情,开始动画原创。
同人:也叫二次创作,由漫画、动画、游戏、小说、影视等作品甚至现实里已知的人物、设定衍生出来的文章及其他如图片影音游戏等等,或“自主”的创作。COS:全称COSPLAY,装扮成漫画、动画、游戏、小说等中的人物,也可以是原创。
2.网站材料
主要在网站上搜集所要的网页信息,包括图片、文字、相关的产品。同时,查询相关的动漫、百度等方式收集所需的文字资料,图象资料,网页特效等,用以得来更加具有说服力的页面。要想做好自己的网站,能够给浏览者好的欣赏感受,就要尽量搜集材料,搜集得材料越多,以后制作网站就越容易。精选自己收集的材料,作为自己制作网页的素材,这样就可以做好一个好的网站。
二、网站的规划设计
1.网站的功能定位
我的网站共有5个主页面:首页、动漫之家、动漫排行榜、动漫连载、周边产品。每一个页面用图片来做。
我是用素材拼音命名网站名,用以方便存储和转发。网站主页整体色调为梅红色,配上深沉的背景图,搭配出一种层次感。然后点缀其他不同的颜色相配,突出主题,颜色没有过多,过杂,用以避免给人一种杂乱的感觉。版面设计十分灵活,根据各部分内容的不同适当的自由设计。网页布局主要用框架和表格,用框架定位内容的大体结构,再用表格具体定位。位子的设计也是重要的一个部分,根据具体内容决定字体风格,相同的风格多次调用是用css设计一个样式,以保证随时、准确的调用。
2.站点的内容
我们动漫汇主要是要向客户介绍动漫,包括动漫的介绍,动漫的周边产品,动漫的图片及动漫的漫画或是动漫片段。站点里面包括:
首页:第一层网页,画面主要有动漫汇的logo,logo下方是一个横幅,鼠标经过会有光亮,点击仍将是动漫的主页。左边是一个动态动漫图,显得主页可爱又有动漫气息等。下方是会员登录,点击登陆跳转至输入账号及密码界面,如不是会员,点击注册跳转个人用户注册界面。主页的背景图是动漫海报,由两层叠加。主图是6幅动漫图,6种动漫的介绍。鼠标进过动漫图时,会有相应的动漫简介。
跳转页:第二层和第三层,主要的主页的过渡。里面有动漫的详细介绍,有动态图欣赏左侧是关于动漫的周边产品。点击看漫画或动漫,即可欣赏相关动漫。
3.站点的风格
整个网页色彩明显,我们添加了gif图,这样网页稍微有活力,背景都是用动漫海报。其中使用翻看图片的特效,使得看漫画不那么单挑。同时也插入视频,使得网站有活力一些。
首页的标题插入闪光效果,鼠标经过时能出现,不容易产生无趣感。首页的图片不只有图片,鼠标放至图片上会有文字出现,是动漫的简介。使得网页有活力。
4.网站功能模块图
三.网站技术解决方案
1、网站的制作工具
做网页时主要使用的是Dreamweaver CS3另外,为了处理网页中的其他元素,还使用了Photoshop、FLASH等软件。
2、所用技术
动漫汇需要大量的图片及相关的话题。我们需要插入图片,大小要适合,以动漫海报为网页的背景,则设置好页面设置,选好准备好的海报图。插入gif图片,需要时在ps中做gif图。插入视频时需要设置好相关的,视频名称中不能有中文,是flv格式的。图文介绍的需要经过ps的加工,使得首页的图片有生机活力。插入表单,是关于用户的登录,点击跳转至登录或是注册界面。首页标题都有链接,点击进入相应的网站。首页下方是关于动漫汇,为了突出字,用ps进行加工。
四.网页介绍
1、制作网站的网页
素材、风格、模板都设计好以后,下一步就是具体的制作网页。制作网站时,首先要做的就是站点的规划,建立一个本地站点“web”,建立的各个页面都应该放在本地站点中,在网页制作时所需的各个元素都进行了统一的管理,建立统一的文件夹放同一类型的文件,我在制作时建立了各类动漫的文件夹来存放图片。同时,由于漫画页面中的信息太多,于是建立了一个专门的文件夹存放相册信息,网页中的css 样式文件也应统一管理,做到有条不紊,我设计的网站的首页如下图:
根据自己的网页风格,在网上搜集合适的图片,另外网页的页宽一般没有超过900像素,以保证左右不出现滚动条。右下边插入的是表格,表格中添加了浅红色的背景图片。用以体现网站的主题色彩,表格还定位了网页特效、系统时间和flash动画。
2.第二层展示
页面中,中间的页面主要包含动漫介绍,周边产品,但浏览者有了新的认识后,可以点击下方的“点击看漫画”按钮来进入第三层页面(漫画页面)。而背景图必须选择横图,而且两边的位置要有良好的视觉效果,我们的排版虽然精简,但是非常有视觉效果,使页面的整体布局合理,既突出网站的主色调,又给人以凝重的感觉,同时增加页面的可看性。
动漫介绍页面
3.动漫排行榜展示
动漫排行榜是为了让浏览者更方便更快更准确地了解到动漫的最新信息而制作的,红色的为最热门的TOP5,分别有:总排行、日本漫画排行、香港漫画排行、大陆漫画排行等排行榜榜单。我们也会定时更新榜单,为了让广大读者更快更直接地了解最新的动漫信息。
4.第三层展示
看漫画页面,是我们制作的重点,并且为了让大家能看漫画,我们专门找了类似翻页的网页特效,方便读者的翻阅,而且让网站更炫,也不容易觉得无趣及疲劳。第三层部门动漫是漫画欣赏,有的是动漫观看。主要是看我们更新的是什么哦~ 也可以让各位动漫迷提前看到剧情的发展,好看又过瘾啊!亲。定时进入查看最新动漫吧~注册用户账号,方便随时进入看哦 送上一幅漫画图: 第三层页面的设计代码如下:
9.自考网页设计与制作简答题总结 篇九
2、WEB在实际应用之中,主要包含三个方面?P7-8
3、商业网页设计的要求?P17-18
4、DREAMWEAVER的基本特征?P21-22
5、使用图象处理工具可对图象怎样样的处理?P23
6、“所见即所得”型型网页制作工具的致命弱点p27
7、初学制作网页从几方面着手?P27-28
8、网站设计原则?P30
9、网页设计专业流程?p31-32
10、商业网站的风格特征?P35-36
11、非商业网站的风格特征?P38
12、网站用三级结构?P40
13、规划目录结构时应当遵循的几个原则?P45-46
14、“抖动”的原理P58
15、运用色块制作网页时需要掌握的几个要点?P65-66
16、网页设计的通用规则?P69-71
17、DHTML的四个主要组成部分?P143
18、javascript具有的基本特点?P144-145
19、java与javascript区别?145-146
20、由于在机制上java和java applet完全不一样,在功能上的差异表现为几个方面?P146-147
21、使用DHTML的原因?P154
22、CSS的作用?P160
23、引用CSS的方法及优点P163(正数11行至15行)
24、在栏目上设置应考虑几方面?P324-325
25、WEB服务器的.概念?P325
26、获得服务器空间的方法?P327(3种)
27、PWS主要由五部分组件组成?P328
28、WEB站点性能受什么因素影响?P335
29、选择虚拟主机提供商的时候,要考虑几个方面?P345-346
30、站点推广方式?P352-355
31、HTML与XML的区别?P357-358
32、xml的主要特点及其他特点?P359360、P362-363
10.网页的设计与制作 篇十
[关键词]网页设计;网页制作;任务驱动;项目教学
《网页设计与制作》作为一门实践和应用能力很强的课程,本门课程在计算机专业课程体系中处于一个非常重要的位置,《计算机网络基础》、《图像处理技术》作为其先导课,为其提供必要的知识准备,比如计算机网络的熟悉、图像处理的掌握等,而《网页设计与制作》课程又为其后续课程《.Net技术基础课程设计》、《.Net高级应用》等课程提供有力的支持,比如开发界面的设计、HTML代码的熟练掌握等等。这就要求学生不仅要掌握专业知识,更要具有运用专业知识分析和解决实际问题的能力。
课程教学中提高学生的实际动手能力是关键。这就要通过对教学内容的合理安排对学生进行正确引导,教学过程以工作项目为主导,教学内容的设计就需要改变传统的以知识点为主体的模式,而以实际工作任务需求为基础,注重理论知识、实践知识与职业技能的综合。教学方法的设计以任务驱动教学法和项目教学法为核心,在具体实施过程中,以任务为主线、教师为主导、学生为主体,把课程的整体内容按知识点划分成多个独立的实际工作项目,使学生既学会了知识,又应用知识完成了多项实际工作,达到了知识和能力的双丰收。
一、理论基础
近年来,计算机技术发展迅猛,知识结构更新速度快,这已成为高等职业院校计算机类课程教学过程中的难题之一。在当今信息时代,计算机技术的普及时刻要求我们必须教会专业学生熟练掌握计算机技能,而计算机硬件、软件的持续更新,又使得“会”的内涵在不断发生变化,这就要求计算机教室在“教”和“学”方面及时更新,以适应计算机发展的需要。
1.任务驱动教学法
任务驱动教学法是近年来广泛应用的教学方法。它是在建构理论的基础上繁衍的一种新型教学模式,学生的学习过程必须与任务相对接,通过问题的导引来激发学生的学习兴趣;从简单的范例入手,带动理论知识的学习,培养学生独立探索、不断创新的学习能力,提高学生的学习兴趣,培养学生主动学习的意识。教师在开始“任务”设计时,要综合考虑到网页设计与制作所涉及的理论、技能及扩展知识的连接,将该任务分解成若干个子任务,以任务驱动的方式分步骤地指导学生完成课业,在完成子任务过程中,由浅入深,循序渐进,保证课堂教学目标顺利完成。
2.项目教学法
项目教学法也是近年来各高职院校广泛应用的教学方法。它以自主式、探索式学习为基础,采用科学实践的方法,激发学生积极主动地学习。在实际教学过程中,教师将需要完成的任务或需要解决的问题以项目的方式下发给学生,教师通过现场分析本次课程的教学内容,分解教学任务,把将要讲授的理论知识融入到学生即将完成的任务中,以小组的方式,由学生本人按照实际工作中的完整流程,共同制订计划、分解任务、分工完成整个项目操作,学习过程成为每个人都参与的团队实践活动,学生通过小组协作方式完成项目,达到真正掌握课堂知识的目的。
项目教学法最显著的特征是以项目为主线,以学生为主体,以教师为主导,它改变了以往教师主动讲授、学生被动听讲的传统教学模式,创造性地提出了学生主动参与、组内自主协作、组间探索创新的教学新模式。学生成为学习的主体,通过独立完成项目,主动把理论和实践有机結合,这不仅提高了学生理论知识水平和实际操作技能,同时在教师正确和有目的的指引下,培养了其团队合作、共同解决问题的能力。
二、任务驱动法的具体应用
1.创建情境,设计任务
授课前,教师提前向专业学生布置这门课程、这个阶段、这个单元、本节课程的学习任务,要求学生课前带着任务和问题去预习;授课时,教师向学生推荐一些和本次课程相关的网页、网站等资源供学生现场欣赏,把学生带入到真实的学习情境中,激发学生的学习热情,引导学生去思考、构想如何设计网页、制作网页,确定本门课程的总任务——建设一个完整实用的网站和页面;教师要针对课程所涉及到的每个知识点将总体任务划分成若干个任务,如文本网页、图像网页、超链接网页、表格网页、框架网页、CSS样式网页、层在网页中运用、时间轴在网页中运用、模板网页和库操作等,再将每个任务进一步划分成若干个子任务。任务的划分应遵循由浅入深,由易到难,即子任务应紧密围绕任务一个个去完成,任务应紧密围绕总体任务一个个去实现。教师根据网页制作的规律,主动创建激发学生学习兴趣的任务,营造愉快的学习氛围,使学生自觉、主动地完成规定任务。
2.分析任务,提出问题
提出任务后,不急于讲解,先让学生带着任务进行思考、分析、研讨,提出完成该任务需要解决什么问题。在提出的所有问题中,有些问题学生以前已经学过的,可以让学生自行去解决;有些问题是学生以前没有接触到的,即隐藏在任务中新的知识点,这正是本次任务需要解决的问题,最好由学生主动提出这些问题,解决问题很容易,仅仅是技能方面的掌握,而提出新问题、从新的视角去看待老问题,却需要学生具有创造性的想象力。例如,在具体应用CSS样式的教学过程中,教师先演示某一网页文字效果,引导学生主动与学过的网页文字效果进行比对,让学生自己去分析任务、提出问题,而不是直接告诉答案,给出现成的结论。
3.自主学习,解决问题
提出问题后,教师先不要直接跟学生讲解问题如何去处理,而是跟学生指明解决问题的思路和线索。要以问题的探索引起和激发学生的爱好和兴趣。学生根据自己掌握的知识独立完成任务,通过主动探索和团队的协作开展活动,在活动的过程中掌握新知识和新技能,并将知识进行融会贯通,并运用到实际操作中。例如,学生如果做一个公司的网站设计,学生就先去上网了解一些其他公司网站的设计思路及效果,然后再尝试根据该公司提供的素材和要求进行设计。在任务制作过程中,要充分考虑到学生间的个体差异,随时给学生提供技术支持,让学生尽快掌握知识,并熟练操作。
4.评价反馈,总结提炼
在教学实施过程中,教师不应以学生所掌握知识的对错为基准,应以学生参与整个教学活动的态度、解决实际问题的能力、创造力的发挥、吸取的经验和教训为基准。对学生整体评价应包含以下几方面内容:是否理解、掌握并熟练操作新知识;自主学习能力是否提高;独立操作能力是否提高;创造性解决问题的能力是否加强等。
三、项目教学法的具体应用
1.设计思路
首先,项目名字的选取既能引起学生的兴趣,又能和实际工作相一致;其次,项目内容的设定要包含所有知识点,各项目间是相对独立又有密不可分的关系,项目的内容激发学生的学习兴趣和愿望,使学生掌握的知识能学有所用、学以致用,真正起到事半功倍的效果;再三,项目内容之间的关系相互递进,螺旋上升,形成了从初学到熟练操作的学习过程。本门课程共划分了七个独立递进的项目,即:制作文本网页、制作超链接导航网页、制作图像和多媒体网页、制作布局网页、使用样式表设计模板网页、制作特效网页、站点的测试与发布。
每个项目的设计与制作过程都包含了整个网页设计全过程,即:项目的分析、设计、制作、测试和发布全过程,完成一个项目就完成一个工作任务。虽然各项目的实施过程是繁琐的,但内容操作上是递进的,细节上是不同的。后续的项目会使用到之前项目的知识点,既巩固了旧知识,有学习了新知识。
2.实施过程
在具体教学过程中,为每个项目设计了相应的任务单,按照实际工作流程,在工作任务单中设计相应的学习情境。例如,某企业想要设计一组网页,用来展示自己企业产品的种类、性能、售后等信息。提出需求如下:主页面的框架结构采用上下结构,上框架中以表格布局的方式放置企业的徽标、标题栏、导航栏,下框架以表格的方式展示企业的相关内容,从感官效果上整体感、立体感非常强烈,能够很好地体现企业的形象。
具体教学过程如下:首先,对学生进行分组,2至4人为一组,以组为单位完成项目的设计与制作过程;其次,小组接到任务单后,由组长给组员分配具体的工作任务,并将分配任务结果填写到任务单上,例如,框架设计、页面设计、首页制作、其他页面制作、美工特效、后期合成等任务;再三,按照具体分工,各组成员开始进行页面分析、设计、制作的工作,并上交作品和任务单。在整个教学实施过程中,教师的角色发生了改变,只是在布置任务前,先将知识点做一下讲解,而后教师便成为项目的指导和顾问,学生成为了学习的主体。
3.考核方式
考核方式由期末考试方式变成过程考核方式,考核方式以每次作品评价、答辩评价为主体。作品评价一方面来自教师的评价,另一方面来自小组间的评价,事先在教室将作品公布,组间进行互评,并写出评价建议,体现评价的公平性、公正性、公开性;答辩评价是对小组中每个成员进行考核的一种手段,在答辩过程中,学生自己阐述工作过程,教师询问有关知识点,并回答情况和任务单给予客观的评价。经过考核后,学生的成绩能够准确地反应出平时学生的理论、实操掌握情况,注重了学生能力的培养,满足了我國高等高职教学的需要。
四、总结
本文围绕《网页设计与制作》这门课程,着重阐述了任务驱动教学法和项目教学法的具体运用和实施。教师在采用这种教学方法授课过程中,有利于学生掌握理论知识,加深理解认识,学会灵活使用这些知识;充分地调动了学生的学习积极性、创造性,使学生成为学习的主体,使学生的学习更能贴近实际工作过程,提高了职业技能,满足社会的需求,符合我国高职院校的培养目标和教学要求。
作者简介
敖冰峰(1974-),男,黑龙江省哈尔滨人,黑龙江职业学院副教授,主要从事计算机教学管理和专业建设工作;徐鹏(1980-),男,黑龙江省哈尔滨人,黑龙江职业学院讲师,主要从事计算机教学和课程建设工作;乔阳(1978-),男,黑龙江省哈尔滨人,黑龙江职业学院讲师,主要从事计算机教学和课程建设工作。
11.“快乐学习”网页设计与制作 篇十一
关键词:《网页设计与制作》课程,教学方法,实践环节,考核方式,快乐学习
随着万维网的迅速发展, 网页已经成为网络世界传播信息、开展业务的最主要载体, 网页制作相关职位的市场需求持续增长。中等职业学校相关专业纷纷开设了网页制作课程, 但是对于非计算机专业的学生来说, 没有前期基础知识的支撑, 对于理论的学习会觉得较枯燥, 实践操作上手容易, 但想要融会贯通却很难, 很多学生死记硬背, 久而久之学习变成了一种负担, 学生的学习积极性和主动性都受到了一定的影响。在这样的教与学的过程中, 想要让学生体会到学习的快乐就变得更难, 快乐学习成了一纸空谈。面对这样的状况, 在网页设计与制作教学中, 我积极探讨多种教学方法, 合理设计教学环节, 采用适当的评价方法, 努力增强学生的学习快乐感。
一、采用适当教学方法, 激发学生的学习兴趣
传统的教学方式是教师在课堂上讲授理论内容, 学生上机练习, 教师辅导。这样一堂课结束后, 学生可能对上课讲的内容听明白了, 但在实际操作时往往无从下手。《网页设计与制作》是一门实践性很强的课程, 教师让学生动手去做, 经历网页制作、网站设计的各个细微环节, 实现教与学的互动, 才能充分激发学生主动学习的兴趣。学生具备了网页制作的基本知识和操作能力, 教师可以采用“模仿”式教学, 让学生设计和制作一个完整的网站, 边做边学, 使学生进一步熟悉相关理论知识的应用与实际操作。
在教学中, 教师要选定一个难易度适中的网站, 既不能太难模仿, 使学生产生畏惧心理, 又不能太简单, 而达不到教学的目的。学生在“模仿”课环节, 对指定的网站首页和其他主要网页进行模仿还原, 该网站的各类素材可以直接使用, 对于页面在尺寸、色彩、外观上也可以相同。对于这种特定的、明确的任务, 学生往往会表现出极大的热情。学生在演练的过程中难免会遇到各种问题, 网站完成以后, 普遍都会存在着不同方面的缺陷。老师应通过实际案例的具体剖析, 拉近学生与课程教学的距离, 将收集的典型的问题重点讲解。学生因为刚刚实际操作过, 对具体的问题有具体的认识, 因而在听讲过程中针对性较强, 对如何解决自己遇到的问题也会很感兴趣。兴趣是最好的老师, 有兴趣才有快乐可言。
这样, 学生既可以复习网页制作的基本操作, 又能对完整设计一个网站的流程有更深的了解。学生在模仿教学的过程中, 会不断地克服一个又一个的困难, 学习自信心会大大地增强。爱默生说过, 自信是成功的第一秘诀。有了信心, 学生才能扬帆起航去找寻学习中的快乐。
二、注重综合实践环节, 调动学生的学习主动性
在学生基本掌握了本课程的内容后, 教师要注重综合实践环节的融会贯通, 可布置一份综合作业, 要求学生设计一个个人网站, 网站既要有鲜明、统一的风格, 又要有完善的内容, 页面的结构、图片的位置、链接的方式设置合理, 做到网页布局的和谐统一, 还要做到容易更新, 等等。要做到这些, 学生就必须在制作网站之前, 对网站进行一个总体规划, 然后逐步进行设计。
为了让学生展现良好的创作技巧和独特的风格, 布置综合作业之后, 教师可先让学生进行选题, 构建出自己的网站结构, 然后上网查询相关的资料, 再对网站进行规划, 写出书面的网站设计方案, 教师对每个学生的方案进行审查和评阅, 及时指出应改进的地方和存在的问题。通过这些环节让学生学会查找、阅读专业文献资料的方法, 培养学生撰写方案的能力。
如此完整的综合实践, 放手让学生依照自己的想法设计、制作属于自己的网站, 让学生自己做主, 学生的学习主动性会大大提高, 就能愉快、积极地去学习, 调动自己的内在潜能, 不断完善和提高自己。学生对某一件事和某一项活动的主动性发挥得越充分, 与之相关的能力发展得就越快。
三、综合全面评价学生, 增强学生的学习成就感
《网页设计与制作》课程的考核方式承袭传统的应试模式, 考试内容侧重于对记忆型知识的考查, 忽视实践动手能力和知识运用能力的考查。这样传统的考核方式既不能考查出学生真正的实力, 在某种程度上又束缚了学生多向思维的发展。为了让学生对学习《网页制作与设计》课程产生兴趣, 除了理论考试之外, 我们还应该将整个考核过程融入到日常的教学环节中去, 设计出让学生容易接受并感到“快乐”的考核方法。
实践表明, 《网页设计与制作》课程的考核方式应该以学生实际制作的网页作品作为考核的主要内容。在作品考核的基础上, 把学生的学习过程也纳入考核的范围, 形成“过程+作品”的考核模式。教师可以将学生不同阶段作品的完成情况作为考核依据。这样, 教师不仅可以有效控制学生的学习过程, 而且可以根据反馈, 适当调整教学进度。
一直以来, 考核都是教师的“专利”, 学生是被动的“待估品”, 这样传统的考核方式让老师和学生的距离拉得太远, 产生疏离感。“亲其师”才能“信其道”, 只有老师做学生的朋友, 亲近学生, 与学生相互学习、共同切磋, 以学习成员的身份与学生一起参与到学习的过程中, 学生才敢在老师面前放松身心, 体验到零距离带来的那份亲切, 敞开自己的心扉。因此在考核中, 教师要放弃自己的“权力”, 和学生一起相互的讨论、评价, 让学生享受到自己考核自己的乐趣。学生在其中找到自己的优点, 会肯定自己;发现自己的缺点, 会提高自己, 学习成就感会逐渐增强, 考核过程就不再是痛苦的, 而是蕴藏无限快乐的过程。
在网络高度发展的今天, 学生可以非常便捷地在网络上获取到大量的关于网页制作的学习资源, 因此老师面临着更多的挑战, 不仅需要对网页制作相关技术进行持续研究, 而且要在教学方法、教学手段上不断进行革新, 以充实的内容吸引学生, 以活跃的氛围打动学生, 让学生爱学习、好学习, 在学习过程中获得成就感和满足感, 得到身心的愉悦, 实现快乐学习。
参考文献
[1]谢志妮.案例教学法在《网页设计》课程中的应用[J].广东青年干部学院学报, 2007, (68) .
[2]余平.高职高专网页设计教学改革实践与探索[J].文教资料, 2007, (2) .
[3]张伟娜.《网页设计与制作》课程教学的探讨与实践.乌鲁木齐成人教育学院学报, 2005, 13 (1) .
【网页的设计与制作】推荐阅读:
网页设计与应用08-27
网站建设与网页设计11-21
网页设计与编程实训(课程设计)报告06-18
网页设计学习的心得体会10-05
网页设计课程设计报告06-16
网页设计师简历06-20
网页设计大赛题目07-11
网页设计执行大纲11-15
网页设计实验报告总结09-07
网页设计师学习课程09-15