网页制作与设计实用13篇

网页制作与设计
网页制作与设计篇1

所谓研究性教学,是指确立以探究和创新为核心的教育理念,更新教育教学观念,着眼于培养学生的探索精神和创造性,构建以培养学生的创新精神和创新能力为基本价值取向的教学内容和教学方法体系,着力解决教师研究性"教"和学生研究性"学"的问题,培养具有创新意识和创新能力的高素质人才,发挥学生在学习过程中的主动性和积极性,使之成为我国经济社会发展需要的具有较高素质和较强能力的易就业人才。

一、课程研究性教学的目的和意义

《网页设计与制作》课程研究性教学的实践性探索旨在通过对网页设计与制作职业岗位群的分析,充分了解市场对本专业学生知识、能力、素质的要求,确定切合市场、科学合理的模块化课程体系,选用适当的教学手段和方式,有效地促进教学质量的提高,提高学生的专业技能和就业机率,最终实现专业培养目标。

二、课程研究性教学的理论依据

1、现代学生观

2、多元智力理论

3、建构主义学习理论

4、发展性教学评价理论

三、课程研究性教学的实践过程

1、网页设计与制作岗位需求分析

通过广东省大中专毕业生就业指导中心网站、智联招聘、中华英才等专业招聘网站对广州、北京、上海、哈尔滨、南京、天津、武汉、深圳、沈阳、杭州、西安等大中型城市的人才招聘信息进行分析统计,确定与高职《网页设计与制作》课程相关的职业岗位主要有:网页设计、网页设计与制作、网页美工、网页制作、网站管理、界面设计、网页编辑、网站运营,在这些岗位需求中,选取了800个岗位进行分析,如表1所示。

2、根据岗位需求分析,构建新型课程体系

(1)本课程在计算机类专业课程体系结构中的位置

本课程在计算机类专业课程体系中处于一个非常重要的位置,《计算机应用基础》、《数据库应用技术》、《VB/C语言程序设计》作为其先导课,为其提供必要的知识准备,比如设计平台的熟悉、数据库设计方法的掌握以及程序代码的设计规范等等,而《网页设计与制作》课程又为其后续课程《Web程序设计》、《网站建设与维护》、《软件工程》等课程提供有力的支持,比如管理信息系统开发过程中对于开发界面的设计、学习JSP、ASP/、PHP等开发工具中对于HTML代码的熟悉掌握等等。总之,本课程的学习有助于学生深入学习计算机类相关专业其他知识和提高职业技能,完善学生的专业知识结构,提升学生从事实际工作的综合素质。

(2)课程体系结构内容

从内容结构体系来说,《网页设计与制作》课程包括了五大部分,分别是:网页设计基础知识、网页编程语言、网页设计工具(包括Dreamweaver部分、Fireworks部分、Flash部分)、动态网页介绍、综合实践(实训),它是一门技能整合的课程。

3、《网页设计与制作》课程设计

(1)设计理念

1)突出专业课程的职业性、实践性和开放性。

2)学以致用。

3)学生是学习主体,鼓励学生职业能力发展,加强创新能力和意识培养的理念。

(2)设计思路

以校企合作为切入点,以培养职业能力为核心,以项目教学为主要手段,积极探索教学方法与成绩评价方法的创新,保证课程目标的实现。

4、教学内容的重构

(1)教学内容的针对性与适用性

《网页设计与制作》是我院计算机网络技术专业的核心课程,同时还是计算机类其它专业、艺术设计类以及电子商务类专业学生的必修课。结合职业需求,我们所确定的教学内容在针对性和适用性方面具有如下特征:

1)教学内容的设置,满足职业能力培养的需要

通过大量的社会调研,分析了网页设计人才应具备的职业能力素养,从而选取合理的教学内容。内容的选取着重培养学生具备以下能力:

①网页的赏析能力

②网页布局的设计能力

③网页色彩运用的能力

④网页的编程能力

⑤常见网页设计工具和图形图像处理软件的运用能力

⑥网站建设和网页的能力

⑦项目开发中的协作能力和人际沟通能力

2)基于工作过程的模块化教学内容的设计

针对职业能力的培养要求,采取基于工作过程的模块化教学,按照网页设计制作实际流程来安排教学内容。

5、教学方法与手段的创新

(1)教学模式的设计与创新

《网页设计与制作》课程是计算机类专业学生的核心课程。为了让学生更好地掌握网页设计的方法和技巧,提高学生的动手能力,借助多媒体手段、电子教室、教学网站、电子邮箱和QQ流等手段,在教学方法上进行了一系列的改革举措:

1)课程内容模块化,化解难点,循序渐进

2)精心准备案例项目,从宏观上进行教学设计

3)微观教学采用"四阶段教学法",将"教、学、做"融为一体。

4)注重师生互动,营造课堂气氛

5)充分利用现代化教学手段,提高教学效果

6)举办学生作品大赛,展示成果、促进交流

(2)多种教学方法的灵活运用

1)多媒体教学

2)"理论+实践"教学模式

6、建立以应用为导向的考核方式

打破传统的考核模式,建立新的、开放式的全程考核模式。根据本课程的特点,提出并逐步实行以项目系统考核为主线的考"应用"不考"理论"模式,同时也鼓励学生以证代考。成绩评定:

(1)期末综合作品和网页制作水平占50%

(2)平时作业、学习态度、出勤等占30%

(3)阶段性实训作品占20%

五、教学效果

1、学生对专业的学习兴趣明显提高,原来消极学习的学生现在也变成了"好学分子"。

2、 研究性教学的实践性探索的开展,使教师有机会和条件将理论和实践教学两种教学能力结合起来进行系统深入的研究,使理论教学和实践教学两种教学能力在有机结合中得到相互促进、相互提高,受到了学生的普遍欢迎和认可,教师教学的主体地位得到了强化。

3、学生考证通过率显著提高。

网页制作与设计篇2

The Design of Subject Learning Webside: Web Design and Making

HUANG Yi-bao

(Gaozhou Normal Subcollege of Maoming University,Gaozhou 525200,China)

Abstract: The development of Information technology improves Educational Informatization. So under the network condition, the buiding of educational resources are the important parts of Educational Informatization. Subject Learning Website represents the importance of the buiding of educational resources. This paper takes the course Web Design and Making ( Gaozhou Normal School of Maoming College) as an example, presenting the design of Subject Learning Webside, and mostly expatiating three aspects: demanding analysis, system design and function design.

Key words: subject learning Webside; Web design and making; design

1 专题学习网站的概述

专题学习网站是指在互联网络的环境下,围绕某门课程或多门课程密切相关的某一项或多项学习知识点,有机地结合起来形成专题,让学习者进行广泛深入研究的资源型学习网站。它可以用来存储传递加工和处理教学信息,能让学生进行自主学习和协作学习,并对学生的学习情况提供在线反馈。根据这些理论,专题学习网站主要包括专题结构化知识库、专题资源库、专题协作学习工具和专题学习评价四大部分内容[1]。

2 专题学习网站的需求分析

《网页设计与制作》在本校是大专学生比较感兴趣的学科,并且本学科具备操作性强、个性突出、资源广泛等特点,有利于引导学生的学习主导性和协作性。

2.1 专题功能需求分析

根据专题学习网站的总体要求和本学科的特点,本专题学习网站主要实现以下功能:

1) 资源管理功能。按专题学习网站的理论要求和教学需要,资源管理功能必须能对资源进行查询、修改、删除、分类、整合等资源处理功能,同时还要提供资源的搜索和资源下载功能。2) 交流讨论功能。向用户提供一个交流讨论的空间,可以对学习内容的交流讨论,也可以上传与学习相关知识或问题或作品进行交流讨论。3) 评价展示功能。包括作业批改、作品展示、自我测试、竞赛投票等在线评价。4) 用户管理功能。包括专题学习网站的资源管理用户、学习留言用户和专题论坛用户。根据不同的需要设置不同的权限,以使师生共同使用和合作管理。

2.2 专题角色需求分析

功能的需求主要来源于角色,不同的角色有着不同的需求。本专题学习网站的角色主要有两类:学习者和管理者。各类用户有自己相应的权限,登录后只能访问自己权限内的功能模块。

1) 学习者的功能需求。学习者主要是利用专题网站进行学习活动,包括查看专题知识与相关资源、交流心得与讨论问题、提交作品与上传资源、测评反馈与投票评价。2) 管理者的功能需求。管理者主要是利用专题网站向学习者提供学习的资源与协作的场景,包括资源管理、讨论管理、评价管理和用户管理。

3 专题学习网站的系统结构设计

3.1 专题学习网站系统框架设计

根据需求分析中的专题网站功能分析,可以把专题网站分为网页基础、动态技术、数据库、辅助工具、作品展示、专题论坛等模块,网站的框架结构设计如下 :

1) 专题结构化知识:网页基础、动态技术、数据库、辅助软件。2) 专题资源库:拓展资源、相关链接、强化训练、素材集锦。3) 专题协作学习工具:学习留言、专题论坛。4) 专题学习评价:作业批改、自我测验、作品展示、竞赛投票。

3.2 专题学习网站系统程序流程设计

根据需求分析中的专题网站角色分析,可以把专题网站分为前台应用和后台管理两个模块,网站的程序流程图(如图1所示)如下。

3.3 专题学习网站体系结构设计

专题学习网站作为管理信息系统又称MIS(Management Information System)的一种,根据功能需要,主要包括前端应用程序以及后台数据库的建立和维护的后台管理。要把前端应用程序与后端的数据库联系起来,即给用户提供数据库相应信息和将用户相应信息存入数据库等,本专题学习网站基于面向互联网和用户机要求不高的基础上,采用的体系结构为B/S。B/S是Brower/Server的缩写,客户机上只要安装一个浏览器(Browser),服务器安装数据库。浏览器通过Web Server 同数据库进行数据交互。那样通过用户的登录,以及相应的权限,就可以实现在远端对系统的浏览、查询和修改。基于B/S的体系结构得出专题网站运行模式包括有客户机、应用程序服务器、数据库服务器三部分[2],其各部分运行工作如下:

1) 客户机:属于表示层,用于界面的入导,接受用户输入,然后向应用服务器部分发送服务请求,最后显示处理结果。2) 应用程序服务器:属于业务逻辑层,执行业务逻辑,向数据库服务器发送请求。3) 数据库服务器:属于数据存储层,执行数据逻辑,运行SQL式存储过程。

4 专题学习网站的功能设计

专题知识资源的输出应用,即前台显示主要是依托动态技术和数据库技术的结合,根据用户需求提供一定的参数,动态地从数据库提取数据,并自动整合为网页形式输出。而作为专题学习网站的管理部分,即后台管理则是通过管理平台与数据库联合起来实现的。

4.1 专题学习网站资源的形成

为了达到为师生提供结构化的专题知识的需要,必定要将学习内容相关的文本、图形、动画、视频等资源按一定的教学策略进行分类、组织、入库,以此达到知识结构化重组,形成了以网页形式的专题网络教学课件[3]。并且提供上传、下载、维护、搜索等资源管理与应用功能,以此形成专题资源库。除了设计组在初期完成的教师教学资料和收集的资源外,网站的管理员或授权的教师甚至学生根据教学的需要和使用的反馈信息,能不断地对专题知识或专题资源库更新、调整。这是一个不断循环、动态调节的资源生产过程。根据数据库设置的角色,用户可以拥有相应的添加、修改、删除、重组资源等权限。并且还设置了审核权,这个权限要赋予教学的专业教师负责,以确保资源的正确与有学习意义的。

4.2 专题知识的结构化重组

使用专题网站教学,既要学习专题知识,又要学习有关联且经过整合的拓展知识;既可以根据个人爱好或能力自主选取相应的其它知识学习,还可以进行相应专题的实践训练。基于这些目的,专题网站必须能够提供有针对性的自主探究学习,才能调动学生的主导性和能动性。由于本专题学习网站采取了网页设计的动态技术和数据库技术,所以除了对专题知识的查询、添加、修改等外,还可以对已有的资源进行重组整合。例如,在教学网页图片的应用时,给学生提供了Fireworks软件的拓展学习资源,那样除了可以根据教学进程Fireworks的教程外,在学习完Fireworks后,可以将的所有Fireworks教程,重组成一个资源。只需要将所有Fireworks教程根据教学顺序,将其超链接集合成一个新的资源到专题知识栏目,如此可以方便学生的学习。同样可以对各章节或各年级学习遇到的问题或教师一个阶段的教学心得等,进行结构化重组,有利于不同程度的或不同级别的学生学习和教师对教学的改进。

4.3 专题协作学习工具

专题学习网站为师生提供协作学习的空间,既利于学生之间的交流,共同学习相应内容,也利于学生对相应学习内容反馈问题和教师根据反馈进行调整或解决问题。同时,对学生以外的网页爱好者开放,更利于学生与互联网上的网页爱好者交流,以使知识面更广和交流更深刻。在本专题学习网站,专题协作学习工具主要包括有学习留言和专题论坛。学习留言主要是专题知识后的留言板,在每一个资源后都给学生提供留下学习心得或需求信息的空间,以便于其他学生的便捷认识或教师掌握教学程度。教师对学习留言拥有整理和回复权,以确保信息的有意义和回复相关问题。专题论坛主要为学习者之间或教与学之间进行讨论、问答、交流而进行的协作、探讨学习的交流工具。根据《网页设计与制作》学科特点,将论坛分为新手上路、CSS美化、图片加工、动画制作、数据库、动态技术、素材源码等栏目,可以让师生分享教程和学习心得,探讨相关问题。除专任教师要管理论坛外,还可以在各栏目设置学生版主,这样既让问题得到及时解决,也让资源得到及时更新,还可以加强资源审核。

4.4 专题学习评价

包括学生提交作品、教师评改作业、学生互评、学生自我测试、竞赛投票等功能,根据评价内容不同,有打分数等级的评价,也有详细评析的评价,也有公开投票的评价。主要是要实现到师生能进行评价、能看到评价、能交流评价、能反馈评价,只有这样才能达到评价的最终目的。首先,通过收集与学习专题相关的思考性问题和总结性考察的评测资料,学生完成相应专题或阶段或知识点后,可以进行自我测试,以检测个人掌握程度;其次,学生在此提交作业,教师对作业打分或评析;再次,学生通过网络提交作业或竞赛作品,教师对作业或竞赛作品进行展示,也给学生之间提供了比较和交流,从而进行他人评价和自我评价。

5 结束语

专题学习网站实际上就是一本拓展的课本和一个开放的课堂,有着多元的内容和多样的评价,既使师生学习的空间得到了拓展,也满足了学生因材施教的发展。但正因为如此,专题学习网站不能成为纯粹的资源收集网站,更应该达到鼓励和引导自主学习、协作学习、创新学习的目的。因为不管是教师在教的过程,还是学生在学的过程,都不仅是一种利用资源的过程,更是一种创新资源的过程。因此,专题学习网站的设计要遵循整合性、自主

性、交互性、开放性等原则。在设计中注重把主动权交给用户,不要把学习的模式或内容固定,让用户在教与的基础上,既能学习基础知识和拓展知识,又能讨论交流和相互评价,更能够在教学过程中创造资源。

参考文献:

网页制作与设计篇3

一、课程标准

专业知识目标。熟悉和掌握网页设计与制作的基本知识,了解和熟悉HTML语言,掌握静态网页设计与制作的知识,掌握网页中动态效果的设计与实现方法,掌握网页中图片设计和处理、动画设计的知识,掌握网站检查与的知识。

职业能力目标。具备收集、处理、准备、加工的能力;具备网页设计及网页中图形设计、动画设计的基本能力,能独立设计一个内容完整、图文并茂、技术运用得当的网站;具备初步的网站开发、维护和管理能力;具备独立撰写网站制作说明等简单科技文件的基本能力。

职业素质目标。按时守信的诚实作风;乐观向上的敬业精神;沟通协作的团队意识;知识获取和应用的自主学习能力;探索实践的创新能力。

二、课程设计

围绕“将工作任务转化为任务引领、并以任务驱动进行教学的课程”的思路进行课程设计。

工作任务分析。具备Internet、网页设计与制作、后台数据库设计和建立、网站规划与建设、通讯及网络技术等技术方面的专业知识。具备网站规划,静态网页设计,建立动态网站,进行网站的上传、更新、维护的能力,同时必须具备一定的平面设计基础。

工作任务设计。在《网页设计与制作》学习领域中贯穿两个平行的工作任务:一个是模仿型总任务:《XX学院网页》网站设计与制作;一个是开放型总任务:个人网站设计与制作;以模仿型总任务作为教学载体,教学的基本要求和完成实际工作所要求的基本知识、技能都融入在该任务中。根据网页设计和网站建设的实际工作流程,将该任务切分为若干子任务,学生依据任务样本,在教室的示范引导下通过模仿逐个子任务,最后完成总任务,获取学习成果。

学习领域设计。本课程学习中每个情境对应一个子任务,设计方案如下:

三、实施建议

(1)教学模式。本课程采用“理实一体、任务驱动”的教学模式。课程教学全部在多媒体机房进行,“教、学、做”完全融合,整个教学过程分为“总任务导入逐个完成由模仿型总任务分解而成的子任务,与此同步逐个完成开放型总任务最后完成两个总任务(获取学习成果)”的过程。

(2)教学方法:任务驱动,讲练结合:采用任务驱动教学,以完成模仿型任务作为教学载体,以完成开放型任务作为教学拓展。教师以任务引领,实施以学生为中心的教学,融“教、学、做”为一体。学生通过完成任务的过程实习对所学知识的构建;案例引入,创设情境:引入颇具代表性的各类网站,一一展示给学生,并和他们一起就网站特点、内容、结构、技术逐一进行分析和讨论;讨论交流,启发引导:在完成工作任务时,怎么做,按照什么步骤做都由学生参与讨论;边学边做完成任务过程中引导教师与学生、学生与学生之间的多向交流;适时进行典型作品的欣赏点评,同时引导学生参与自评和互评。教学过程中注重传授学生一种思想,一种解决问题的方法,引导学生从多个方面去解决问题,用多种方法解决同一问题。

《网页设计与制作》一体化教学是一个系统工程,在一体化教学中要注意计算机教室、教学计划、教材、教案、学案、及教法、师资等的设计,只有这样,才能符合一体化教学的要求,才能组织好一体化教学。相信在不久的将来,为适应职业技术教育的发展要求,逐步实现一体化教学,为职业技术教育培养出更多更好的实用型、技能型人才。

网页制作与设计篇4

准备建设的专题学习网站是基于网络资源的数字化学习平台,利用网络技术,创设主动学习情境,让学生在开放、互动的平台上去寻求《网页制作》专题资源,激发学生学习兴趣,让学生主动思考、主动探索、主动学习,实现高效课堂。让学生在建设网站的过程中,学习掌握提高《网页制作》的技能,体现“学中做,做中学”的教学理念。

《网页制作》是开设一学期的课程,主要内容包括网页的基础知识、网页布局和色彩搭配、HTML语言、JavaScript脚本语言、Dreamweaver软件使用、CSS层叠样式表、AJAX技术、jQuery技术、网站的创建与管理。还涉及到使用Photoshop软件对网页图像进行处理、使用Flash软件制作网页动画等其他相关课程。

在实际的教学过程中,往往需要使用大量的素材和学习视频教程。这些学习资源怎样能够方便快捷的分发到学生的计算机上,成为需要解决的问题。如果机房的计算机是通过网线连成小型局域网的,就可以先把工作页、资料包等学习资源先存储到一台学生机上,再利用windows自带的文件夹共享功能,将其共享,便于其他学生从这台计算机上下载资源。文件夹共享实现过程如下:

鼠标右击文件夹,在弹出的快捷菜单中,选“共享和安全”,选中在网络上共享这个文件夹。这时,其他用户就可以通过网络访问这个文件夹,下载其中的学习资源。

这样利用文件夹共享的方法实现资源下载,优点是操作简便。缺点是机房的计算机一般都带有C盘还原功能,往往一次共享完成后,下一次重新启动计算机后,还需要再次设置文件夹共享,十分麻烦。专题学习网站就可以实现简单的文件夹共享达不到的效果,可以使素材和教学资源分类存储在服务器上,以清晰明了的操作界面,便于学生在线学习和下载相应的网页制作素材。

1 《网页制作》专题学习网站的作用

专题学习网站为中等职业学校计算机专业学生《网页制作》课程的学习提供优质的数字化学习资源,为学生提供制作网页所需的丰富资源,搭建展示学生作品成果的平台。通过专题学习网站创设学生自主学习的情境,引导、激发学生学习《网页制作》课程的积极性,建立高效课堂,让学生更好的掌握网页制作的技能。

(1)研究中职学生特点,动手实践能力相对于理论知识学习能力强。

(2)分析《网页制作》课程,涉及内容广、技术多,实践性和技能性强。

(3)设计开发专题学习网站,探索基于专题学习网站的《网页制作》课程的教学模式。

给《网页制作》课程的教学提供教学资源,辅助学生进行自主学习。在课外时间里,对于学生的学习给予支持,帮助学生学习在课堂上没有完全掌握的知识。提供学生展示作品的平台,学生和老师在这里可以对学生的作品进行一系列的评价。提供一个在课外进行师生交流或生生交流的平台,学生可以在这里提问、交流学习心得等。

2 《网页制作》专题学习网站的设计

首先网站需要教学资源模块来进行教学的辅助,教学资源模块既能辅助课堂教学,也可以指导学生进行自主学习。其次作品展示模块,学生需要一个作品展示模块,首先通过展示学生自己的作品能够激发学生自己的兴趣,第二展示作品模块有助于学生进行自评互评。第三,讨论模块,既要有以班级为单位的讨论小组,也要有全校师生都能进行参与的大型讨论平台,使学生在学习中出现问题时,能够自主的进行讨论学习。

在建站之初,为网站以后继续完善(例如:开发手机客户端等),需要考虑给学生划定一块空间,让学生自己上传自己的网站作品。自己维护自己的网站,将网站交给学生自己运营。让学生发出自己的声音。

为了把建立网站的过程和学生的《网页制作》的学习过程相结合。主要是教学资源的共建共享,在课堂使用该网站的教学资源进行辅助教学,结合工作过程系统化的课程开发,结合工作页的素材的使用。通过上传网站网页给学生一个展示自己作品的机会。

可以让每一个班级在校园网上建立自己的班级网页,将校报办到网上去,网页上建立与中职学生相关的栏目,例如:求职、招聘信息等。组织学生自己定期更新常用工具软件的版本,交流专业课的学习体会。利用所学知识解决实际问题,活学活用,学生在使用专题学习网站中遇到了问题,通过小组讨论去寻找答案。将工作过程系统化课程学习情境实施的六个步骤:资讯、计划、决策、实施、检查、评价,充分运用到教学实践当中。达到学生越学越爱学,越学越想学的自主学习状态,真正实现专业课教学是以学生为主体,教师起到陪伴学生自主学习的作用。

3 《网页制作》专题学习网站的实现

网站开发中,数据库技术主要用来支持实现协作学习平台、专题研讨等动态网页部分数据的存取。常用的数据库有ACCESS、SQL Server、My SQL等。图像处理技术主要用来设计、生成网页背景图片,使网页更加美观,有利于创设“真实”的学习情境。常用的图像处理软件有Photoshop、Fireworks。

运用静态网页制作技术、动态网页制作技术、数据库技术、三层结构技术进行网站开发,编码实现网站的建设制作过程。《网页制作》专题学习网站的测试、评价和完善,专题学习网站建成完成后,依照专题学习网站各个功能模块的功能,在应用专题学习网站教学的过程中不断纠正和完善,通过问卷调查专题学习网站的应用效果,更全面的了解基于专题学习网站的教学模式的有效性。

通过校园网试运行《网页制作》专题学习网站,邀请网站设计与制作专家和学生使用专题学习网站,根据反馈意见,对网站进行修改和完善。

4 结束语

专题学习网站不仅为学生提供了丰富的专题学习资源,还为学生提供了功能强大的协作平台和专题研讨区,为学习者开展协作学习、交流和探讨相关问题、展示自己的学习成果提供了良好的舞台。利用专题学习网站进行课程教学,培养了学生自主学习、协作学习等综合能力,形成了一种崭新的数字化学习方式。

专题学习网站的资源要丰富,提供必要的演示视频录像,能够给学习者以足够的资源进行探究式的学习。教师博客、微博是教学的辅助平台.用以促进教学的交流。通过博客、微博叙事式的记录可以更好地了解教师的教学思想、研究成果和兴趣爱好.也可以进行教师之间的教学交流。学生可以发表自己的见解和想法。特别是作品创意,供其他同学学习和参考,以达到共同进步的目的。

运用教学设计思想对《网页制作》专题学习网站进行设计,主要包括需求分析与功能定位,中职学生特征分析,专题内容的选择,信息资源的选择与设计,自主学习的设计,学习评价系统的设计,学习情境创设等内容。通过专题学习网站创设学生自主学习的情境,引导、激发学生学习《网页制作》课程的积极性,建立高效课堂,让学生更好的掌握网页制作的技能。

参考文献:

[1]郝中超,金薇.Web3.0环境下运用专题学习网站实现学习资源共享建设的思考――运用专题学习网站实现学习资源共享的应用现状调查分析[J].中国教育信息化,2013(01).

网页制作与设计篇5

Design and implementation of teaching websites

Gao Yaxia1,2, Zou Hairong3

(1. Shaanxi University of Science & Technology, Xi'an, Shaanxi 710021, China; 2. Shaanxi Commercial School; 3. Shaanxi University of Technology)

Abstract: In order to improve teaching efficiency and spread good teaching resources and information in a larger scope but a short period of time, the network teaching platform is developed using Dreamweaver tools and ASP technology. A dynamic web page is applied at the front desk in teaching website, and SQL Server 2005 is used in the backstage data base to satisfy large amount of consumer. After testing and operation of the site, the functions such as answering of the network, online discussions, assignments and learning announcements, uploading and downloading courseware, teaching management and user management are realized in this teaching website, which provides an efficient and convenient teaching environment on web.

Key words: SQL Server; teaching Website; Dreamweaver; ASP

0 引言

随着计算机和信息技术的飞速发展,网络教学也在快速发展和普及。教师与学生都迫切需要一种简便高效的教学方式,网络教学的出现正好满足了人们的这种需要。随着网页技术的发展成熟,人们对网页的要求也不再是文字、图片的简单堆砌和单调枯燥的内容,而是实时性、交互性和丰富性,使用动态技术的网页越来越受欢迎[1]。本文介绍采用ASP动态网页技术结合SQL Server 2005数据库构建一个“网页设计与制作”课程教学网站。学生通过访问该网站,可以浏览/下载课件、在线作业、在线交流与讨论等;教师可以上传课件、在线答疑等;管理员可以修改、删除、添加、查询用户信息、进行教程管理等。系统发挥了ASP技术显示于客户端和运行于服务器端,以及保护用户资料的安全性等特性。

1 系统需求分析

利用互联网技术进行网络教学,可以跨越时空限制,最大范围地传播资源,具有投资少、覆盖面广、受益人多和互动性强等特点,使办学单位减少了人力和物力的消耗,并为广大学子提供了丰富的资源。可见,网络教学为教育事业开辟了广阔的前景。由于在网络中易于实现资源共享,学生可以将个人问题转化为公共问题,并借助集体智慧解决个人问题,学生在网络中容易找到志同道合的学友,各自就共同感兴趣的问题发表自己的看法,有益于培养学生的信息素养和解决问题的能力等[2]。教师可以在网络平台成为导师,接受或选择学生的辅导请求,起到指导和督导作用。通过对在校大学生和教师调查发现,计算机网络教学因其互动性强、教学效果好等优势成为人们的新需求。网络教学网站系统的开发,主要是为用户设计和开发一个便于学习与交流的网络教学平台,以提高教学效率。

2 开发技术和方法

本网站教学平台采用目前流行的B/S(Brower/Server)结构。整个网站可以运行于Windows 2003 Server/Windows XP平台上,系统前台使用流行的工具和脚本语言Dreamweaver HTML语言和ASP技术开发,后台采用当前最流行且性能较高,数据库维护与管理性能很强大的SQL Server 2005。B/S是随Internent技术的兴起,对C/S(Client/Server)结构的一种变化或者改进的结构,在这种结构下,用户界面完全通过www浏览器实现,一部分事务逻辑在前端实现,但主要事务逻辑在服务器端实现[3]。系统充分发挥了ASP技术显示于客户端、运行于服务器端,以及保护用户资料的安全性等优点。

3 “网页设计与制作”教学网站的设计

3.1 系统功能设计

从教学用户的角度,网页设计与制作课程教学网站可划分为教师、学生和管理员三大功能模块。具体内容如表1所示。

表1 系统用户与功能设计

[分类\&模块\&使用者\&教师\&查看短消息\&教师\&学习及作业公告\&教师\&上传课件\&教师\&网络答疑\&教师\&讨论交流\&教师\&学生

\&查看短消息\&学生\&浏览课件\&学生\&查看作业公告\&学生\&网络提问\&学生\&讨论交流\&学生\&管理员\&消息管理\&管理员\&教学管理\&管理员\&讨论管理\&管理员\&用户管理\&管理员\&]

3.2 数据流程

3.2.1 系统总流程

在网站首页进行用户账号的登录时,系统接收到用户账号后,首先与数据库中存放的账号进行权限分析和匹配,若账号相匹配,则进入相应权限的用户模块;若账号不匹配,则提示用户操作错误,返回登录界面。系统的总流程如图1所示。

[用户登录][账号是否正确?] [验证权限] [具体模块][数据库] [N][Y][学生][教师][管理员][结束]

图1 系统流程图

3.2.2 后台管理流程

管理员用户具有对整个系统的管理权限,除接收短消息功能外主要实现管理学生和教师模块的内容,课件管理可在一个特定的时间内删除数据库里的课件记录和站点内相应的文件,这样可节省站点的空间;用户管理可针对目前系统的工作量适当地添加或删除系统管理员,也可更改用户账号;在讨论管理区内管理员可删除一些过期的或恶意的帖子,也可针对一些话题发帖;在教学管理区内可对学生、教师、学院、专业、班级等进行编辑、修改、添加和删除。详细流程如图2所示。

[管理员登录][接收短消息][课件管理][用户管理][讨论管理][教学管理][收信息][发信息] [学生管理][教师管理][学院管理][专业管理][班级管理][课件管理][开课管理][操作完成] [数据库]

图2 后台管理流程图

4 “网页设计与制作”教学网站的实现

4.1 数据库设计

数据库是网站信息管理的后台支持,存储着前台页面所需要的信息,在信息管理系统中有着很重要的地位。数据库设计的好与坏,直接影响到网站系统的运行效率。良好的数据库设计,可以提高数据信息的存储效率,保证数据信息的完整性和一直性。同时,一个合理的数据库结构有利于程序的实现。本网站系统使用数据库SQL Server 2005建立教学(teaching)数据库。后台数据库的连接采用字符串连接,其连接文件的代码如下:

ctrConnection="Driver={SQL Server};server=(local);uid=wy;

pwd=123;database=teaching;" //连接字符串

set conn=server.createobject("ADODB.CONNECTION")

//创建连接对象

conn.open ctrConnection %> //打开数据库

4.2 网站主要页面实现

4.2.1 网站主页面

课程教学网站主要是实现教师、学生在线学习与交流的良好平台,进入系统首页就能够方便的选择用于学习的资源信息等内容。资料列表模块,显示学生可以自主学习的所有教学资料信息;网上答疑模块,提供师生在线交流、学习和讨论的平台。主页运行效果如图3所示。

图3 网站主页界面

4.2.2 网站管理页面

网站后台管理系统能够实现教师、学生、课件与教学资源及用户信息的管理等功能。系统管理员登录页面的运行效果图4所示。

图4 管理员登录页面

5 系统功能测试

为了提高网站开发和设计的效率,该教学网站使用目前流行的B/S模式[5]。整个网站可以运行于Windows 2003 Server/Windows XP平台上,系统前台采用先进的Dreamweaver、HTML语言工具和ASP技术开发。后台数据库采用当前最流行且性能较高,数据库维护与管理性能很强大的SQL Server 2005实现。通过对网站系统的基本信息模块,消息管理模块、课件管理模块、上传下载课件模块,作业公告、BBS模块与教学管理等功能模块(学生管理,教师管理,课程管理)进行系统测试,结果表明,所设计的功能都能实现,系统性能良好,能够满足用户的实际需求。

6 结束语

本教学网站平台的开发和应用,实现了教学资源的访问、课件上传下载、师生互动、学习交流和网上答疑讨论等功能;使优秀的教学资源和交流信息能在大范围、短时间内传播。给教师和学生提供了一个方便、高效的网上教学与学习平台,从而提高了学校教学效率与教学质量。

参考文献:

[1] 周兴华,周新伟,张军等.ASP+SQL Server数据库开发与实例[M].清

华大学出版社,2008.

[2] 蒋理.动态网页设计实用教程[M].西安电子科技大学出版社,2007.

[3] 王萍萍,李晓娜,孙更新.ASP+Dreamweaver动态网站开发[M].清华

大学出版社,2008.

网页制作与设计篇6

由于《网页设计与制作》这门课程需要丰富的素材、资源和教学案例,有必要构建课程教学资源库。课程资源可以采用边学习边建设的模式,在云平台下搭建私人空间和公共空间。私有空间是学生自己建立单独的操作环境,也是个人主页的形式,根据个人喜好在私有空间上上传各种学习资料。在私有空间以设置不同的访问权限,允许其他成员访问私有空间中的资源,不仅可以达到隐私保护的目的,还方便学生相互共享。公共空间是教师为学生搭建的公共的学习平台,如上图1,每个学生都可以访问公共空间上的学习资源,方便共享。本课程中的教学资源在授课以前教师已经上传,比如PPT课件、书中案例、实训任务书、实训报告、习题、电子书等资源。在学习过程中学生可以根据自己的个好和自主学习需求,对学习资源进行自主搭建,一个学期下来,就可以搭建完整的资源库。这两个空间的搭建,构成了一个多元化的学习平台,学生可以在公共空间和私有空间之间进行各种访问学习,进行交流,构成了一个以云平台环境为主的学习协作大环境,这个大的学习环境可以促使学生开展全方位的、开放的、基于真实背景的互动。这样平台的搭建也是当前计算机教学改革的主要研究内容之一,是课程向深层次发展的产物。共享型学习模式流程图

三、云平台下教学模式的设计

以学习者自主学习为重要形式的远程教育,教学过程的自主性与灵活性也是一种新的教学模式。传统的教学模式无法解决学生分散,学习自主学习的问题,在云平台下可以以教师讲授为主进行在线的集体教学,教师可以利用百会会议集中学生进行语音同步讲授,集中解答学生遇到的问题,还可以像课堂面授一样进行教学示范。教师可以向学生介绍本次远程课堂的主要任务,并亲自示范操作,学生自主进行实验操作,操作完成以后将自己设计的作品上传到百会维基上,这样所有学生作品共享了,学生可以学习其他学生作品,并且给出相应的评论,发表博客反思,同时根据老师和其他同学给出的建议修改作品。

网页制作与设计篇7

一、“网页设计与制作”课程教学存在的问题

网页设计与制作课程是一门操作性和实践性都很强的实用型课程,应以就业为导向,以实际工作岗位所需的技术应用能力和基本素质为主线,突出培养应用型人才。传统的以教师为主的教学往往会导致学生的自主学习能力差,无法激发学生的创造性和能动性;对课程实践环节的重视程度不够,使学生的实践能力和专业技能难以提高;以期末考核成绩为主的考核方式,因过分强调结果而忽视过程,无法激发学生在学习过程中的热情,也无法全面了解学生技能掌握的真实情况。针对这种状况笔者认为,更新教育观念、探索新的教学模式才是根本出路。笔者根据多年的教学经验,对网页设计与制作课程从教学内容、教学手段、教学方法、考核方法方面进行了一系列的创新改革。教学内容主要解决如何调动学生积极性,激发学生创新能力,如何提高学生创新能力、实践能力、设计能力、发现问题和解决问题能力等综合素质;教学方法主要解决如何实现“以人为本”,如何通过任务引入、启发等方法,激发学生的发散性思维。同时利用软件工作室,为学生的创新和实践能力的锻炼和培养提供一个良好的平台。

二、教学内容的创新

课程内容的选取与组织是课程教学改革的基础。人才培养方案对“网页设计与制作”教学内容进行重新整合,把课程学习划分成培养学生的基本设计制作能力和培养学生的综合设计制作能力两个阶段。

第一阶段安排在大一第一学期,主要针对没有任何设计经验的大一新生,重点介绍基本知识,包括超文本标记语言html、网页布局和css、Dreamweaver软件的使用和简单的JavaScript的使用。在第一阶段教学中,笔者采用任务驱动教学方法,创设情境,引导学生自己总结掌握代码的使用方法和艺术设计的美感。第一阶段学习结束的时候,学生可以独立完成一个小的图文并茂并且布局合理的网站。第二阶段教学放在大一第二学期初,针对具备基础程序设计能力的学生,重点培养学生的综合设计制作能力。在第二阶段的教学中,以学生为主体、以教师为引导,采用国家火炬计划河北省软件人才工程实训课程,使学生融会贯通所学知识,完成一个具体的项目,以达到提高学生综合设计能力的目的。迄今为止,学生完成的项目包括“旅游网站”、“小游戏网站”和“化妆品网站”。教学实践证明,这种理论和实践技能并行的教学模式,更加有助于学生的创新能力的提高,使学生在不断的实践中掌握设计技能,在技能学习中提高基础能力。

三、教学手段的创新

在授课期间灵活采用多种教学手段。利用多媒体投影演示教学,将真实项目的设计与制作过程直观的演示给学生,传达给学生难以理解的教学内容,来达到教学的目的。利用课程网站辅助教学。建设课程网络教学平台,以有效地促进学生课后的学习。课程网站放置学习资源,并定期更新,学生可以通过课程网站了解先进的技术和理念。利用课程qq群、博客等辅助教学。通过课程qq群、博客等现代化沟通方式和学生探讨学习中的疑点和难点。

四、教学方法的创新

课程每个章节内容结构主要由三部分组成:

知识点:介绍本章需要掌握的知识或技术。

应用案例:介绍本章知识应用的案例。

创新训练:针对具体的问题,应用本章技术来完成知识点的应用。

在整个课堂教学中,主要采用案例教学法和任务驱动教学法实施教学。将实际工作任务引入教学体系,将每次课程中的教学重点与难点知识与技能,精心设计并包含在工作任务中,使之与实际应用结合起来。

在实践教学中采取分组教学法来实施教学。首先进行分组时,兼顾学生任务实施过程中相互间的合作配合问题和学生的个体情况,采取互补的方式,按学生的学习成绩、知识结构、学习能力、性格特点搭配分组,利于学习的相互促进。每组人数控制在6人左右,同时设立组长一名,便于意见的集中统一。对各组员明确分工,防止个别组员出现依赖思想,确保每个学生都参与到工作实践过程中。各个组员分工合作,独立完成工作任务,以提高学生的团队合作意识和竞争意识,提升职业素养。

五、考试方式的创新

课程考核以学期末大作业形式实现。改变了以前闭卷笔试的考核形式,要求学生在课程结束后独立形成一个完整的网站,主题自拟并且积极向上,使用Dreamweaver,Photoshop和Flash等软件实现至少80%课上讲解的知识。对使用课外的工具和手段使得网站更加生动的学生可加分,即鼓励学生自己摸索和创新网站制作方法。最终成绩的评定依据网站的创意、美观性、内容、技术和工作量等多个方面来评分。同时也考核了学生在项目开发过程中对所学知识的运用能力、实践能力、学习方法、创新意识、协作精神和职业素养。本课程最后的综合成绩评定除了依据上述大作业完成情况,还依据平时上课情况和上机实训完成情况,其比例分别为60%,10%和30%。

总之,经过不断的摸索与实践,通过以上的教学方法与教学手段的改革和实践,不仅提高了学生的学习兴趣,让学生对自己的设计作品更加满意,对自己更加充满信心,同时也培养了学生制作的美感,充分发掘了学生的创造潜能,锻炼了创新和协作精神。

参考文献:

网页制作与设计篇8

内蒙古科技大学是地方高等院校,毕业生大多到企业从事设计、生产、管理等技术工作,故人才培养定位于“工程实施型人才”,要求学生具有扎实的基础理论和专业基础知识,能够教深入地掌握专业知识和流行生产技术,具有较强的工程实施能力,因此内蒙古科技大学的毕业生具有“上手快,留得住,后劲足”的特点,毕业生就业率连续多年位居自治区高校前列,被国务院授予“全国就业先进工作单位”光荣称号。该校的计算机科学与技术专业在学校人才培养思想的指导下完成了专业定位,重新制定了人才培养方案和课程体系,在此背景下,计算机科学与技术专业开设了《网页设计与制作》课程。

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

根据企业用人标准及对毕业生的回访调查,总结出了网页设计师的从业要求:具备优秀网站设计能力,能综合运用各类软件设计视觉创意网站,能独立进行平面网页的创意设计,具有良好的艺术触觉和美术色彩搭配功底,深刻理解web标准,熟悉CSS+DIV模式,能手写XHTML及CSS样式代码,懂得javascript应用,精通设计与网页设计软件,如photoshop、fireworks、dreamweaver等,能独立完成网站的规划和静态页面制作。可以看出一个优秀的网页设计师能够对网页的构成元素进行艺术规划和创造性思维活动,通过网页制作技术实现网页设计的目的,达到了艺术与技术的和谐统一。[1]为了培养大一新生对计算机专业的学习兴趣和热情,许多高校包括我校在内,将《网页设计与制作》课程规划为必修课安排在大一下学期开课,目的通过本课程所见即所得的特点,激发新生对计算机专业的学生兴趣和热情。可在以往的本课程教学内容安排上,重网页制作技术的讲授,对网页设计相关知识涉及甚少,即便学生掌握了XHTML、css+div、JavaScript等网页制作技术,可没有遵循网站与网页设计原则,致使学生制作出来的网页粗糙拙劣,毫无美感可言,这样的教学安排,难以培养学生的专业学习兴趣和热情。

2 《网页设计与制作》课程改革思路

以适应企业需求为导向,以培养学生网页设计能力为根本,以项目教学和案例教学为手段,以实际网站为目标,进行课程内容的编排和改革。[2]紧跟当前市场需求,及时对教学内容作出调整,特别强调网站与网页设计原则理论知识,在讲授网页制作技术的过程中注重网页设计基本理论与基础知识的渗透,努力提高学生的审美情趣,在潜移默化中让学生形成“技术为设计服务”的思想,让这种思想指导其网页设计与制作行为,最后将这种认识转换为能力,最终体现在其网页设计作品上。

3 《网页设计与制作》课程教学改革方案

以“技术为设计服务”为指导思想,以项目教学和案例教学为手段,通过项目驱动,[3]让学生在32学时讲授+32学时上机的学习过程中,独立完成上机项目。上机项目按照具备知识水平由易到难,需求由低到高,设计方案由局部到整体的梯度进行,符合教育教学的基本规律。结课后,以一个综合项目的开发作为对学生学习效果的最后的评价。综合项目的开发,实际上是学生实践和独立探究的过程,在此过程中,增长了学生的知识,培养了学生创造性思维和发现问题、解决问题的能力。

3.1 教学内容的编排

按照WEB标准,网页由三部分组成:结构(structure)、表现(presentation)和行为(behavior),因此,在教学内容的编排上,将《网页设计与制作》课程分为四大模块进行讲授和实践。分别为:网页与网站设计原则、XHTML基础知识、css+div、javascript。

网页与网站设计原则模块:在本课程的教学过程中处于指导地位和核心地位。通过该模块的教学,首先让学生掌握网站的3C设计原则,即简洁、一致性、对比度。通过一些优秀网站设计案例的展示,使学生对3C设计原则有初步的体会和认识。其次让学生掌握页面设计要点,包括:精心组织的内容、格式美观的正文、和谐的色彩搭配、较好的对比度、生动的背景图案、页面元素大小适中,布局均匀、不同元素间的留白等。通过优秀网站设计案例的讲解,让学生初步体会每一个页面设计要点。在随后的课程讲授及上机实践中,通过具体案例,强调网页与网站设计原则,让学生对3C设计原则及页面设计要点有更深的体会和认识,在潜移默化中,学会用网页与网站设计原则指导自己的网站制作行为。

其他三个模块为《网页设计与制作》课程的技术范畴。通过XHTML、css+div、javascript的讲授及配合各类上机项目的实践,使学生具备认识网页创建站点应用网页元素对网页布局应用CSS美化页面给网页添加动态行为的能力。最后以网页与网站设计原则为指导,设计开发一个综合项目。该综合项目要求要有鲜明的主题,内容与形式统一,个性突出、布局合理、配色美观。可以看出,通过本课程技术层面的学习,为学生奠定了制作综合项目的技术基础,而其掌握的网页与网站设计原则又将反作用于其网页制作的行为上,提高其网页制作水平,逐步达到技术与设计的和谐统一。

4 《网页设计与制作》课程考核体系

本课程的考核方式为考察,主要考察学生的实践能力及学生网页与网站设计原则的掌握情况。将平时表现,上机项目完成情况、综合项目的开况相结合,从而得出学生的最终成绩。

考核方案设计如下。

平时表现10分:包括上课出勤,上机出勤。有课堂主动回答问题的额外加3分。

上机实验40分:内容包括:包含文本、图像、超链接、多媒体的简单网页设计(3分);包含表格的简单网页设计(3分);包含表单的简单网页设计(3分);利用框架进行简单网页设计(3分);利用CSS样式表美化网页(10分);利用表格进行网页布局(3分)、利用DIV进行网页布局(5分)、利用DIV嵌套表格进行网页布局(5分);利用javascript实现网页特效(5分)。

综合项目开发:通过本课程掌握的网站设计原则及制作方法,完成综合项目的设计与制作。(50分)

设计要求(25分):需求分析充分,栏目设计合理,功能完善,网站深度不低于3级别(5分);主题鲜明,页面布局合理,配色和谐,形式美观,风格统一(10分);logo、banner的设计应突出主题,与页面风格相协调(5分);要有便捷的导航信息。网站内容丰富,具有良好的可读性(5分)。

技术要求(25分):站点文件组织规划合理,主页必须以index命名(2分);代码书写符合XHTML语法规范(3分);用Div对网站进行总体布局,局部布局可用表格(6分);用css进行页面的美化,对样式的定义统一写在外部样式表中(6分);多媒体元素运用得当,适合网络传输(3分);页面中包含有JavaScript实现的特效(5分)。

5 结语

改革后的《网页设计与制作》课程重视学生网页设计能力的培养,在每一次的教学实践环节中,都在强调网页与网站设计原则,在潜移默化中让学生学会用网页与网站设计原则来指导自己的制作行为。在此原则的指导下,74名学生完成的综合项目开发作品中,符合网站与网页设计原则的作品有62.3%,其中优秀作品比例为 12.6%,较未实行教改前学生的设计与制作水平有了明显提高。实践证明,以“技术为设计服务”为指导思想的《网页设计与制作》课程教学改革实在可行,提高了学生网站设计与制作水平,为其以后的就业打下了良好基础。

参考文献

网页制作与设计篇9

伴随着时代进步,万维网与人们的日常生活已经逐渐融为一体。同样,在现代企业发展过程中,也应该随大势紧跟网络的脚步,由此企业网站的门户作用也逐渐凸显,而作为关键的门户,网站的设计制作更是重中之重,由此为提高网站水平,引进人才的举措必不可少。而作为人才基地的高校,应高度重视网页设计与制作课程设计的发展,积极探索网页设计与制作课程教学改革的科学方法。新课程改革的背景下,高校教育模式的限制就显现出来,在此情况下,网页设计与制作教学在实际操作中在各个板块的弊端,都需要通过具有针对性的方案予以解决。而在本文中,针对具体教学问题进行分析,以期促进教学水平的提升,希望本文能对广大教育工作者有所启发,推动网企双向发展。

2“网页设计与制作”课程教学案例分析

“网页设计与制作”课程是我校公共计算机课程改革试点项目的二级课程,它面向整个学校计算机管理专业,相关专业根据其专业特点和教学需要,具有五个课程特点,是一种自我选择的课程,属于“大学计算机基础课程”之后的高级课程。

2.1“网页设计与制作”的教材分析

在进行“网页设计与制作”课程的学习之前,必须要求学生掌握相关的网络信息知识,这方面的知识包括网页的浏览、网页的搜索、知识的下载以及电子邮件的使用等,这些基础知识是为了让学生更好地具备对信息获取的技能。但是,由于大多数学生设计和制作网站,只能依靠操作。因此,教师需要传授“网页设计与制作”课程,以帮助学生更好地理解什么是网页,什么是网站?教会学生利用网页的基本构成元素以及超文本标记语言,来进行网页制作,帮助学生提高对“网页设计与制作”学习的效果,同时也能为往后相关的互联网知识学习打下基础。

2.2“网页设计与制作”的学情分析

通常学生在对“网页设计与制作”课程学习之后,他们能够更好地了解什么是网络信息,并且拥有利用信息的能力。他们通过了解网络知识,从而来更好地掌握对网络信息的下载、浏览、搜索、文件的发放及传输的技术等。通过调查研究发现,大部分的学生都希望自己能够制作出属于自己的网页,并把网页在互联网上。因此,大部分的学生对于“网页的设计与制作”课程具有浓厚的兴趣,而这些兴趣对于学生的学习具有积极影响。

2.3“网页设计与制作”的教学目标

“网页设计与制作”中,高校教师的教学目标主要分为三个方面,即知识与技能、过程与方法、情感态度与价值观。首先是知识和技能,必须帮助学生理解网页网站的基本概念,理解网页的基本元素,理解基本网页创建软件的界面和功能,并识别网站的地址-URL,超文本标记语言HTML,超文本传输协议HTTP;其次是过程与方法,老师通过分析和讲解这两种方法从而帮助学生掌握各项网页和网站知识;最后是情感态度与价值观,老师通过对“网页设计与制作”的教学,培养学生严谨求实的学习态度和勇于探索、崇尚科学的意志和品德。

3“网页设计与制作”课程教学存在的问题

3.1学生学习过于被动

我国高校“网页设计与制作”教学使用的模式,一般为老师教授基本理论,而后使用布置作业、模拟考核等方式来进行教学。而事实上,该种教学模式收效甚微。在死板生硬的高压教学下,学生对教学内容会出现本能抗拒,对枯燥的理论知识产生厌烦情绪,而在这种情况下,学生的积极性也受到了极大地遏制。由此产生的一系列恶性循环所导致的最终结果就是,学生没有打下深厚的理论基础,而之后的实际操作就更没有办法完成了。

3.2学生实践能力较弱

当老师演示时,学生对老师的行为并没有产生充分的理解,故此很多学生会轻视老师的演示,对实际操作的难度并没有一个确切的判断。而在实践中,又会出现学生对于具体规程的漠视,因为之前产生的自大心理而认为实践仅仅需要短时间就能完成。所以在实战中,许多学生才会发现,自己对详细的操作并没有深入了解,看上去简单的事情却很有难度,实战中根本无从下手。同时还有一些学生过于自我,忽视了网页设计和制作的科学性质,完全摒弃课本与老师的教授,通过自己的想法来指导操作。

3.3师生之间缺乏沟通

首先,在“网页设计与制作”的教学中,教师和学生并没有良性交流。同时,教师对学生的了解有限,对学生的具体情况不甚了解,学习程度与需求自然也无从判断。在教学中,一味照本宣科,无法充分满足学生的学习需要。其次,教师在课堂上的教授模式也至关重要,“只讲不问”,与学生的互动有限,参与度由此下降,课程也愈加乏味。再从学生角度出发,学生同样局限于传统师生关系,在有疑问的时候,因为害怕老师的批评等原因,不敢告诉老师。而学生间也同样如此,个体之间的学习是有限的,缺乏良好学习氛围是无法促进班级学习的良性叠加的。

4“网页设计与制作”课程教学改革的策略

4.1重新定位课程教学标准

为了能够调动起学生在学习“网页设计与制作”课程的主动性,首先高校的“网页设计与制作”教学课程应该遵循企业用人标准,在课程教学过程中,强调培养学生的团队精神,职业道德,网络信息收集能力,审美能力和艺术品质。其次,在“网页设计与制作”课程的教学过程中,还需要提高对课程教育目标的重视程度,根据新课程改革的教学要求来更好地培养学生的自主创新能力和创新思维,引导学生进行实践操作,让学生能够更好地掌握网页的规划能力、构建能力、设计能力以及制作能力等。

4.2优化教学内容

为了能够提高学生的实践能力,就必须要将“网页设计与制作”课程内容进行改革,以企业的用人标准和教学的需求来进行科学的设计,将这些内容延伸分为四个不同的模块,分别是Dreamweaver、Fireworks、Web基础知识和Flash。其中Dreamweaver包括网页跟踪的技术、网页站点管理的技术、动态网页设计的技术、数据库连接的技术以及其他基础的技术;Fireworks包括高级应用的技术,基础操作的技术和其他相关基础知识;Web基础知识包括网络的浏览器,网络的常用名以及高级应用措施等;Flash包括高级制作技术、基础动画制作技术以及其他相关技术。

4.3更新教学模式

高校“网页设计与制作”教学不该再局限于老式的教学系统,应积极拓宽视野,通过现代化的方式例如网上课程以及针对性的因材施教。在现代化的教学方面,首先要确保教机与学机的联动,确保学生都使用计算机,及时通过计算机传输并对学生的设计操作进行引导,提高学生的实践能力。同时,高校“网页设计与制作”在网上课程方面,也可以采取一定的趣味教学模式,跳出死板的老式图书教学,变更教学风格,通过视频等生动的方式,将技巧融入其中,帮助学生在潜移默化中慢慢对学习产生兴趣。

5“网页设计与制作”教学需要注意的问题

5.1以“新”制作网页

教师教学中应重视告诉学生网页内容的选择,避免出现俗套,需要强调的一个“新”字是很重要的。“新”这一原则要求,在设计网站的内容时,是指网站的内容不是被复制的,而是要形成一个属于自己的独特网站。环顾四周,许多互联网上的个人主页是简单的“杂货店”,内容虽然是包罗万象,但主题是一样的,每个人都几乎是一个“软件下载”或者“软件搬运”的员工,从开始的网络导航到最后的结束都没有任何的创新之处,缺乏创新的新鲜意义。因此,在网页设计教学的过程中,既要告诉学生对材料的选择上下功夫,同时也要做到对材料选择精准度的把控,以“新”为基础,以“精”为内容。

5.2以“简”来取网名

由于网站不能由单个网页组成,因此它有许多子页面。为了使这些页面有效连接,教师必须告诉学生,要为这些页面提供一些具有代表性和简洁易记的网页名称。这不仅有利于将来管理网页,而且在向搜索引擎提交网页时,更容易被其他人搜索到。在命名网页时,最好使用常用的小写英文字母或与页面内容相匹配的英文字母,这与页面上的连接直接相关。

5.3更新及时才能吸引人流

网页制作与设计篇10

就课程本身运用实质来说,工作的项目其实分为网站设计与管理、网页制作、图像与媒体设计与运用、数据库设计与管理、脚本与应用程序的设计与运用。经过市场调研和多年教学实践,我把把课程牵引项目分为八个具体任务:1.图文并茂网页的制作完成该项目的知识包括常见网页设计工具的使用、HTML文档基本结构、文本排版控制标记符、图像插入标记符、特殊字符以及物理显示标记符、css的意义、创建与使用方法。项目技能目标有安装和启动网页制作软件、熟悉网页制作的基本步骤、正确插入文本与特殊字符、正确对文本进行分段分行、正确插入图像、运用css技术控制文字图片样式。2.个人简历网页的制作完成该项目的知识包括有序列表标记符、无序列表标记符、表格标记符、超链接标记符、Css技术对列表的控制方法。项目技能目标有制作有序列表、无序列表、制作混合列表、运用超链接标记符启动电子邮箱链接、运用表格进行简单页面排版、运用css技术设置列表显示方式。3.电子相册制作完成该项目的知识包括网页图像素材的特点与主要类型、Fireworks对图片进行批处理的方法、电子相册排版要点、图像、表格、超链接标记符的相关属性、css技术的滤镜使用方法。项目技能目标有熟悉网页图像素材的特点与类型、掌握Fireworks的基本操作方法、了解并掌握网页图片处理的主要方法、熟知图像、表格、超链接标记符的属性、运用css滤镜技术美化图片效果。4.学习欣赏网站设计与制作完成该项目的知识包括本地网站的创建与、IIS的安装与设置方法、网站的规划与制作流程、框架技术进行网页布局的方法、超链接标记符在框架技术中的作用、锚点链接技术、网站LOGO的制作方法、制作网站flashbanner的方法、多媒体素材网页的制作方法。项目技能目标有:正确创建、设置、本地网站、正确安装、设置与管理IIS、运用框架技术进行网页布局、锚点技术在长版面网页中的应用、运用图像设计软件制作LOGO、运用flash制作具有动态效果的banner、掌握向网页插入动画、视频等多媒体素材的方法、熟悉css控制超链接样式的方法。5.门户网站制作完成该项目的知识包括门户网站的设计、规划与制作流程、网站创建、、维护管理的方法、Div+css布局网页的方法、创建子菜单的方法、Dhtml技术、Dreamweaver的高级应用技术。项目技能目标有熟悉运用div+css技术设计网页、掌握Dreamweaver创建与运用divAp的方法、掌握运用Dreamweaver时间轴功能制作网页漂移元素的方法、掌握Dreamweaver行为面板的使用方法、灵活应用DHTML增加网页特效。6.个人信息网站设计与制作完成该项目的知识包括个人网站的规划方法与制作特点、运用图形制作工具设计绘制网页布局、Fireworks执行切片并导出网页的方法、Dreamweaver布局切片网页的方法、页内框架技术在网页布局中的应用方法、动态导航条的制作方法、css对网页进行样式规范与美化的方法。项目技能目标有了解个人网站的制作方法与特点、设计并绘制网页布局图、应用切片技术设计网页布局结构、运用Dreamweaver优化切片网页、运用页内框架技术实现网站超链接、掌握制作动态导航条的方法、运用css对网页进行样式规范与美化。7.用户注册信息网页制作完成该项目的知识包括表单与表单元素的相关标记符、表单与表单元素的作用、表格布局表单元素、css对表格、表单元素的控制方法、Dreamweaver检验表单行为的应用、以电子邮件方式提交表单的方法。项目技能目标有熟悉表单及表单元素的设置方法、掌握表格布局表单元素的方法、运用css对表格、表单元素进行规范与美化、掌握Dreamweaver验证表单的方法、掌握电子邮件形式提交表单的方法。8.浏览、查找、修改通讯录的网页完成该项目的知识包括动态网页制作与设置、数据库的绑定、表单动作设置、表单元素与数据表的对应、动态表格插入与应用、动态网站的。项目技能目标有熟悉表单及表单元素、掌握动态网页制作与设置方法、运用表单动作设置动态效果、掌握动态表格的插入方法、掌握动态网站要领。

网页制作与设计篇11

作者简介:侯敏(1979-),女,汉族,陕西西安人,讲师。研究方向:软件工程,数据库

互联移动终端的大面积推广,使得掌握网页制作技术的人才在各个行业里都成为必不可少的需求;同时,地方普通高校为社会服务的使命感在不断增强,如何培养出“学即能用”的人才,使之在短时间内掌握主流的网页设计技术,提高站点访问量,是这门课程课堂教学效果进步的体现。

一、技术背景与课堂教学要求

(一)Internet发展历程

Internet经历了从Web1.0到Web3.0的迅猛发展。Web1.0是静止、单向、被动的;Web2.0则为用户开设了主动权,使得用户和网站可进行双向信息互动;Web3.0提升了用户的主动权,用户可对页面的多种元素(显示、色彩、像素、框架等)按需设置,订制专属的功能模块,整合数据资源,适用于电脑、手机、PDA等多终端平台定制。

(二)传统的网页设计与制作课程内容一般情况下,高校开设的网页设计课程从教学内容上可划分为两大块:

1.相关知识介绍。网站的概念、基本元素及页面等相关知识的介绍。

2.应用软件的使用。介绍使用最多的Dreamweaver系列网页制作工具,使学生掌握布局(表格、层、框架、模板等)、超级链接、表单和几种特效。随着互联网的全面推广和“学即能用”的需求,以上内容已不能满足互联网时代与时俱进的特点。最关键的问题在于:课堂学到的知识是否马上就能得到应用,是否与目前社会上专业的网页制作公司的技术规格保持一致。因此,本门课程的改革势在必行。

二、“服务于地方”教学内容的改革

(一)教学内容改革

内容改革是课程改革的首要环节。关于什么是关键内容,什么是次要内容,笔者走访了本地专业网页设计公司中企动力的设计总监马女士,通过对她的访谈,了解到时下主流的网页设计公司所涉及到的技术规范,对本校现阶段的教学内容做了必要的调整,简化了表格布局页面、框架设计等已被淘汰的陈旧技术的授课内容,有选择地介绍了网页交互特效及表单的应用,加强了网页美化工具、HTML语言及CSS的学习内容。改革后的课程主要分为六大模块:网页和网站的基础知识、网页美化工具(Photoshop或者Fireworks)、HTML语言、网页开发工具的介绍、DIV+CSS、动态网页技术。首先,通过具体的例子阐明网页、网站的定义,页面的布局类型(主要是盒模型)、整体造型及配色方案的相关知识;其次,介绍网页美化工具图片处理工具(Photoshop或Fireworks)的使用,学生可用其设计页面元素,加强页面的视觉效果与美观性,提升站点的专业度;再次,介绍HTML的基本语法结构和语句,使学生熟练掌握其主要标签的使用(传统的教学模式对这一部分的内容有所忽略)。

实践证明,学生若不熟悉HTML的语法构成,学习DIV+CSS这一主流的网页布局模式就会相当吃力。当然,对于非专业学生而言,学习一门语言,即便是文本标记语言,由于其本身对计算机系统相关知识的欠缺,授课会比较困难,学生也学得辛苦,但这又是一个必要的过程,其所占用的时间比较长,需要设计大量实例,反复练习才能掌握。之后介绍开发工具,重点是要理解页面的代码模式和设计模式,而DIV+CSS则是本门课程的重头戏,由于学生对代码有种天生的恐惧,所以,在建立CSS时又以开发工具建立为主,修改程序为辅。最后简单提及动态网页技术。由于课时限制(32节),本课程主要讲授静态网页制作。静态网页技术分为传统技术和新技术。传统课堂教学内容重点是布局表格、框架、模板等,而目前主流的网页制作公司则主要应用DIV+CSS。所以,对于陈旧的技术简单介绍即可,而把DIV+CSS作为布局的主要技术进行讲解。由于这些内容需要学生对代码部分比较熟悉,所以,在课时中增加了相应的HTML的基本语法结构和语句的介绍,并对主要标签的使用熟练掌握。

(二)实际授课效果

笔者今年为设计和思政两个专业的学生授课。设计专业的学生已经开设了PS,有一定的设计基础,所以,课程内容改革中的第一部分可以省略;思政专业的学生没有图片处理基础,笔者在授课过程中有意加强了这部分内容,讲授简单的图片处理方法和文字特效工具。实践证明,学生有追求新知识的欲望,基本能做到学以致用,并反馈到最终的作品中。往届学生的作品更像电子小报,而今年通过课程内容改革的学生作品虽不完美,但在形式内容上更接近Internet的正规网站,教学效果良好。针对我校提出建立培养服务于地方应用型人才的本科院校,传统的网页设计与制作课程必须响应时代号召,更新教学内容与方法。本文仅供从事该课程教学的教师参考。

网页制作与设计篇12

随着我国社会主义现代化的飞速发展,国内各行各业均得到了极大的进步。政治、经济、文化、社会、法律等诸多环境的完善给予了当代各种新技术良好的发展环境与支撑。互联网与计算机技术作为时下最为热门的技术,其已然和多个行业之间紧密结合起来。作为现代居民、企业获取信息、传播信息、共享信息、储存信息的重要途径,互联网与计算机技术的使用无不改变着当代居民的生活方式、企业的经营理念。而这些信息的获取与宣传,均需要依靠由HTML所编辑的网页程序。良好的网络界面设计、网络窗口点击习惯等,将会给予网络使用用户良好的体验与满足。高职院校作为现代社会人才培养与输送的重要根据地,其每年均会为社会输送大量的优秀人才。面对时代的不断发展与进步,以及现代居民对文化的需求、现代企业对人才素质的需求,高职院校也不得不开始思考适应社会主义新城市产业发展人才供给水平及质量的问题。作为时下最为热门并受各行业关注的网页设计与制作课程,已然成为了时下亟待进行教学改革的课程之一。能否整合资源切合实际教学需要、能否采用科学有效方法提升学生对课程的实践应用能力等均成为了重要的研究课题。

2高职网页设计与制作课程教学改革的发展研究

2.1开发与企业需求相对口的专业技术培养高职教育作为以培养契合实际企业发展、输送更具职业化现代化人才为目标的高等教育基地,其应当在现有网页设计与制作课程教学的大纲编写、内容设置等方面与社会中的岗位与需求相互结合。根据当前社会企业中网站开发团队通常扮演的职能角色,学习网页设计与制作课程的学生毕业后不单会从事网页设计师、网页开发师、网页检测师等岗位,而且还会从事网页美工师、网页维护工作员等岗位。面对众多就业方向与选择,当代高校应当紧密契合时展需要,针对现有教学目标、内容、纲领等给予调整以便于适应社会企业对人才知识水平与综合素质能力的需要。在此过程中,可以采用更加具有针对性的专业细分模式,并结合对口专业就业方向给予相应课程重点的调整。例如:针对从事电子商务网页设计与制作岗位专业人才的培养应当在基础课程培养后,重点提升WEB应用程序开发课程的教学;针对从事艺术网页设计与制作岗位专业人才的培养不单应重视基础知识教学,而且还应提升学生对于布局、构图乃至色彩等的敏感性程度,并提升学生对CSS等软件的学习。2.2采用项目驱动型教学模式与策略在当前高职院校开展网页设计与制作课程授课过程中,通常将学生作为教学客体来进行传授,而忽略了高职院校学生本身所具有的年龄阶段及灵活思维。网页设计与制作课程在实践教学环节经常采用案例教学的模式,以此来实现对学生更为全面综合素质的培养。然而,却容易由于上述问题的存在,从而使学生在学习过程中经常处于被动学习的状态,严重偏离了网页设计与制作课程名称所应有的提升学生动手能力、设计水平的要求。在此过程中为了良好改善这一现状及问题的存在,可以采用项目驱动型教学模式与策略。这一教学模式可采用三步走的方式:第一,进行项目选择。在开展网页设计与制作课程之处教师应当结合课本及大纲要求选择恰当、难度适宜的项目范本,也可以根据学生层次不同选择层级较多的项目范本。在此基础上,将大班教学模式打散,采用三五成群的方式实现小组建立,并选取题目开展讨论型动手能力实践学习环节;第二,采用专题教学方式。可以选择耳熟能详的一些网站设计样本,并将其与同行业公司网页的设计之间相互比较,从而使学生能够设置一个心中的标杆。在此过程中可以分别从网页主题、网页资料设置、网页logo设计等多个方面来开展专题教学;第三,组织讨论。在进行项目选择和相关标杆样板的指引之后,就可以对学生每个小组的成果进行比较和分析,利用总结的形式让学生能够在这种教学模式下实现阶梯式提升。2.3采用考核分阶段型教学模式与策略除了可以采用项目驱动型教学模式之外,还可以结合网页设计与制作实际工作特点开展分阶段教学。由于对一个大型网站的设计与制作通常会花费一个团队几个月的时间,每个阶段性完成点之间的衔接对最终网页的质量均会产生较大影响。为此,在进行高职网页设计与制作课程教学时,为了提升教学质量也可以与实际相互结合起来,开展考核分阶段型教学模式。在此过程中通常可将课本内容进行重新编排或总结,从网站选题、网站设计、网站制作、网站测试、网站、网站使用反馈等多个递进环节开展专题教学,并以考核机制来实现上述阶段过渡,从而保障每个学生都能够利用课堂快速实现自身知识容量提升。

3结论

通过上文的研究,可以发现,高职院校在当代社会现代化人才培养领域的地位十分重要。因此,面对互联网信息时代到来,其必须与时代共同发展。网页设计与制作作为广告行业、新媒体行业等新城市产业发展的重要基础知识与领域,高职院校应不断推动当今时代背景下的教学改革。在本文中作者首先针对国内互联网与计算机技术发展的现状进行研究,在此基础上对高职院校网页设计与制作课程教学改革的策略提出了些许具有系统性、可行性的建议。谨此希望能够利用本文的研究为国内高职院校网页设计与制作课程的教学质量提升带来帮助。

网页制作与设计篇13

一、技术背景与课堂教学要求

(一)Internet发展历程

Internet经历了从Web1.0到Web3.0的迅猛发展。Web1.0是静止、单向、被动的;Web2.0则为用户开设了主动权,使得用户和网站可行双向信息互动;Web3.0提升了用户的主动权,用户可对页面的多种元素(显示、色彩、像素、框架等)按需设置,订制专属的功能模块,整合数据资源,适用于电脑、手机、PDA等多终端平台定制。

(二)传统的网页设计与制作课程内容

一般情况下,高校开设的网页设计课程从教学内容上可划分为两大块:1.相关知识介绍。网站的概念、基本元素及页面等相关知识的介绍。2.应用软件的使用。介绍使用最多的Dreamweaver系列网页制作工具,使学生掌握布局(表格、层、框架、模板等)、超级链接、表单和几种特效。随着互联网的全面推广和“学即能用”的需求,以上内容已不能满足互联网时代与时俱进的特点。最关键的问题在于:课堂学到的知识是否马上就能得到应用,是否与目前社会上专业的网页制作公司的技术规格保持一致。因此,本门课程的改革势在必行。

二“、服务于地方”教学内容的改革

(一)教学内容改革

内容改革是课程改革的首要环节。关于什么是关键内容,什么是次要内容,笔者走访了本地专业网页设计公司中企动力的设计总监马女士,通过对她的访谈,了解到时下主流的网页设计公司所涉及到的技术规范,对本校现阶段的教学内容做了必要的调整,简化了表格布局页面、框架设计等已被淘汰的陈旧技术的授课内容,有选择地介绍了网页交互特效及表单的应用,加强了网页美化工具、HTML语言及CSS的学习内容。改革后的课程主要分为六大模块:网页和网站的基础知识、网页美化工具(Photoshop或者Fireworks)、HTML语言、网页开发工具的介绍、DIV+CSS、动态网页技术。首先,通过具体的例子阐明网页、网站的定义,页面的布局类型(主要是盒模型)、整体造型及配色方案的相关知识;其次,介绍网页美化工具图片处理工具(Photoshop或Fireworks)的使用,学生可用其设计页面元素,加强页面的视觉效果与美观性,提升站点的专业度;再次,介绍HTML的基本语法结构和语句,使学生熟练掌握其主要标签的使用(传统的教学模式对这一部分的内容有所忽略)。实践证明,学生若不熟悉HTML的语法构成,学习DIV+CSS这一主流的网页布局模式就会相当吃力。当然,对于非专业学生而言,学习一门语言,即便是文本标记语言,由于其本身对计算机系统相关知识的欠缺,授课会比较困难,学生也学得辛苦,但这又是一个必要的过程,其所占用的时间比较长,需要设计大量实例,反复练习才能掌握。之后介绍开发工具,重点是要理解页面的代码模式和设计模式,而DIV+CSS则是本门课程的重头戏,由于学生对代码有种天生的恐惧,所以,在建立CSS时又以开发工具建立为主,修改程序为辅。最后简单提及动态网页技术。由于课时限制(32节),本课程主要讲授静态网页制作。静态网页技术分为传统技术和新技术。传统课堂教学内容重点是布局表格、框架、模板等,而目前主流的网页制作公司则主要应用DIV+CSS。所以,对于陈旧的技术简单介绍即可,而把DIV+CSS作为布局的主要技术进行讲解。由于这些内容需要学生对代码部分比较熟悉,所以,在课时中增加了相应的HTML的基本语法结构和语句的介绍,并对主要标签的使用熟练掌握。

(二)实际授课效果

笔者今年为设计和思政两个专业的学生授课。设计专业的学生已经开设了PS,有一定的设计基础,所以,课程内容改革中的第一部分可以省略;思政专业的学生没有图片处理基础,笔者在授课过程中有意加强了这部分内容,讲授简单的图片处理方法和文字特效工具。实践证明,学生有追求新知识的欲望,基本能做到学以致用,并反馈到最终的作品中。往届学生的作品更像电子小报,而今年通过课程内容改革的学生作品虽不完美,但在形式内容上更接近Internet的正规网站,教学效果良好。针对我校提出建立培养服务于地方应用型人才的本科院校,传统的网页设计与制作课程必须响应时代号召,更新教学内容与方法。本文仅供从事该课程教学的教师参考。

在线咨询