网页设计教学计划

时间:2025-01-05 15:07:41
网页设计教学计划

篇1:网页设计教学计划

一、课程的性质与任务

课程的性质:本课程是为培养中职学生对网页设计与制作的基础知识而设置的一门专业实训课程。由于网页设计与制作所涉及的软件和相关知识十分广泛,针对我校学生的专业方向和专业基础,本课程侧重于网页视觉效果和版式布局的设计与制作,对大中型网站制作中的所涉及到的动态程序编写等较复杂技术手段作了回避或仅作简单介绍。

课程的任务:通过本课程学习,使学生了解网页制作的基础知识、基本流程,并能熟练使用MacromediaDreamweaver进行个人网站和中小型商业网站的设计、制作与维护更新,为培养高级网页设计专业人才打下坚实的基础。

二、教学基本要求

通过课程的教学,在理论知识教学和技能培养两方面要求学生达到下列目标。

(一)理论知识方面主要达到:

1.了解互联网、网页、网站、超级连接、HTML语言、FTP、等基础网络知识;

2.了解网站设计制作的常用工具与基本流程

3.了解html语言的一般规律

4.了解不同网站类型不同的设计与制作要求

5.了解网站的整体结构规划

(二)能力方面主要达到:

1.熟练掌握MacromediaDremweave的基本操作;

2.掌握photoshop中网页设计稿文件的切片与优化输出;

3.掌握网页图像的优化技巧;

4.了解网站的测试、发布、推广与维护;

三、教学条件

保障每个学生都能单独使用一台电脑,每台电脑都配备Dreamweaver、photoshop等设计软件。

四、教学内容及课时安排

第一章网页设计基础知识(4课时)

第一节网页设计概述

第二节在DreamweaverCS3中建立站点

第三节创建站立点地图

第四节设置Web服务器

第二章网页的(4课时)

第一节文本操作

第二节图像操作

第三章网页的布局(4课时)

第一节表格

第二节在布局模式下绘制布局表格

第三节框架

第四章超链接的创建与管理(4课时)

第一节超链接和路径概述

第二节超链接的使用

第五章CSS样式表与行为(5课时)

第一节使用CSS样式表

第二节行为及简单应用

第六章AP元素和时间轴(4课时)

第一节使用AP元素

第三节AP元素时间轴配合使用的动态效果

第七章表单的使用(6课时)

第一节创建表单网页

第二节创建留言簿

第三节验证表单内容

第八章图像和动画的制作与优化(4课时)

第一节图像的制作与优化

第二节动画的制制与优化

第九章网站文件的检查与发布(2课时)

第一节网站文件的检查与测试

第二节注册域名、申请空间与网站发布

第十章综合训练(4课时)

第一节网站的规化

第三节网站的上传发布、备案和维护

五、教法说明

(一)本课程是一门专业技能训练课程,以学生的实践操作为主,注重设计与制作能力的培养、经验与技巧的积累。课程中引导学生在练习中解决具体的问题,使学生能灵活地、熟练地应用所学的理论知识。

(二)教学练习中,以优秀实际案例为参照,增强教学的趣味性、实用性和针对性。

(三)课程末要求设计制作一个完整的小型网站,并上传、发布和推广,以综合运用和巩固所学知识,激发学生兴趣,为将来的进一步学习打下基础。

六、考核方式与评分方法

(一)考勤总成绩的10%。

(二)过程考核(理论知识、提问、查阅、课堂作业与课堂表现等)总成绩的30%

(三)以综合性设计作业的方式,设计制作完整的小型网站,占总成绩的60%。

篇2:网页设计教学计划

当前背景与关键问题分析

随着互联网的快速发展,网页设计的需求日益增加。企业、个人及组织都需要具备良好网页设计能力的人才。然而,许多初学者在学习过程中面临诸多挑战,包括缺乏系统的学习资源、实践机会不足以及对设计原则理解不深等。因此,制定一份详细的教学计划显得尤为重要,以帮助学员克服这些困难,提升他们的设计能力。

实施步骤与时间节点

第一阶段:基础知识学习(1-4周)

在这一阶段,学员将学习网页设计的基本概念和技术。课程内容包括:

CSS基础:掌握CSS选择器、样式规则、布局模型等。

JavaScript基础:了解JavaScript的基本语法、DOM操作及事件处理。

每周安排2次课程,每次2小时,结合理论与实践,确保学员能够在课堂上进行实际操作。

第二阶段:设计工具与软件使用(5-6周)

这一阶段将重点介绍网页设计常用工具的使用,包括:

设计软件:学习AdobeXD、Figma等设计工具的基本操作。

原型设计:掌握如何制作网页原型,进行用户测试与反馈收集。

每周安排1次工具使用课程,结合实际案例进行练习,确保学员能够熟练使用设计软件。

第三阶段:用户体验与用户界面设计(7-8周)

在这一阶段,学员将学习UX/UI设计的基本原则与方法。课程内容包括:

用户研究:了解用户需求,进行用户访谈与问卷调查。

信息架构:学习如何组织信息,设计网站结构。

视觉设计:掌握色彩理论、排版技巧及图形设计。

每周安排1次UX/UI设计课程,结合实际项目进行设计练习,提升学员的设计思维。

第四阶段:项目实践与作品集制作(9-12周)

在最后阶段,学员将进行实际项目的设计与开发。课程内容包括:

项目选题:学员根据兴趣选择项目主题,进行需求分析。

设计与开发:学员将运用所学知识进行网页设计与开发,完成项目。

作品集制作:指导学员整理个人作品,制作专业的作品集。

每周安排1次项目指导课程,确保学员在实践中得到及时反馈与指导。

数据支持与预期成果

根据市场调研,网页设计师的需求在未来几年将持续增长。预计到2025年,网页设计相关职位将增加20%。通过本计划的实施,学员将具备以下能力:

能够独立使用设计软件进行网页设计。

理解用户体验与用户界面设计的基本原则。

完成至少一个独立的网页设计项目,并制作个人作品集。

计划文档编写与执行

本计划将以文档形式呈现,内容包括课程大纲、时间安排、教学目标、评估标准等。文档将确保易于理解与执行,便于教师与学员参考。每个阶段结束后,将进行阶段性评估,确保学员掌握所学知识,并根据反馈调整后续教学内容。

结语

网页设计教学计划的实施将为初学者提供系统的学习路径,帮助他们掌握必要的技能与知识。通过理论与实践相结合的方式,学员将能够在实际项目中应用所学内容,提升自身的设计能力与市场竞争力。希望通过本计划的实施,培养出更多优秀的网页设计人才,满足日益增长的市场需求。

篇3:网页设计教学计划

一、教学指导思想:

本学期我将认真做好所教课程的各项工作。认真学习中职计算机学科的教学大纲和网页制作的相关教材,明确教学任务和教材体系,力争“教书”与“育人”贯穿始终。全面贯彻教育部关于中职教育的大政方针,努力探索计算机教学规律,在激发和培养学生的学习兴趣,养成良好的学习习惯,提高动手能力的同时,着力培养学生树立正确的荣辱观和人生观,积极推进素质教育。在教学中要充分利用计算机来培养学生的信息素养,有效地提高教育教学水平。促进学生创新精神和实践能力的培养,充分考虑学生的发展需要,强调学生自主学习,发挥教师的主导作用,学生主体作用,以学生个体发展为目标,不断提高教育教学质量。

二、学生情况分析:

上学期学生已经初步学习了部分课程,对此可能有了一定的了解,但是中职学生整体素质层次不齐,绝大多数学生学习目标明确,但也有少数学生对微机在当前和末来社会中作用认识不够。虽然有基础但是通过一个假期之后,很多知识需要巩固。但总体来看本课程学生们的学习兴趣还是很好的。

三、教材分析

本书共8章,前面已学习了前三章,本学期主要学习后五章。

第四章打造企业留言板本章的'教学重点和难点是插入表单对象的基本方法及设置表单及表单对象属性的方法。要求掌握表单、文本域、单选按钮、列表/菜单、复选框、文本区域、隐藏域、按钮、文件域、跳转菜单、字段集、【检查表单】行为、密码验证的方法等知识点。主要是通过完成企业留言板这一项目来学习的。通过总的项目来分析逐个小任务。最终完成知识点的学习。为了更好的使同学们掌握重难点,在教学中我会精讲多练,让学生案例分析,讨论,最终上机操作,如:用户注册,163信箱等的制作。

第五章在Dreamweaver中美化页面本章教学重难点是添加、修改和删除行为的方法及在网页制作中应用行为的基本方法。要求学生掌握行为的概念、【行为】面板、常用事件、状态栏文本、弹出式菜单、打开浏览器窗口、交换图像、控制Shockwave或

Flash、弹出信息、拖动层等知识点。主要是通过逐个任务来完成教学的。首先教师演示教学案例。通过PPT课件讲授基本知识。然后通过让学生自己动手重新制作教学案例来巩固基本知识。最终通过实训让学生进一步熟悉所学知识点。

第六章站点的发布本章教学重难点是在IIS中配置FTP服务器的方法及通过Dreamweaver发布网页的方法和在模板中插入模板对象的方法。要求学生掌握安装IIS服务器、配置Web服务器、配置FTP服务器、发布网页、检查链接、改变链接、查找和替换、清理文档、保持同步等知识点。本章主要通过教师实例演示,学生动手操作来完成教学任务的。为了让学生更加熟练操作,教师主要通过多个实例操作练习的方法来完成教学。

第七章CSS样式的应用本章教学重难点是创建和设置CSS样式的方法及附加样式表的方法。要求学生掌握【CSS样式】面板、CSS样式的类别、定义CSS样式的方法、CSS的【类型】等属性对话框、3种选择器各自的特点、创建超级链接的高级CSS样式、设置单元格ID名称和样式、修改CSS样式、删除CSS样式、应用CSS样式、附加样式表、重命名样式等知识点。主要通过项目教学法来完成教学,项目的主要目的是让学生掌握CSS样式的基本知识。项目主要通过CSS样式控制购物网页的外观,一方面要熟悉CSS样式的基本使用方法,另一方面要了解购物网页页面的基本特点。本项目使用的网页布局技术仍然是表格,另外还涉及文本、图像等网页元素。

第八章网页制作综合实例本章重难点是使学生综合运用所学知识点。要求学生掌握网站设计流程、设计网页布局、各级网页制作的方法及网站的推广。本章主要是让学生自主完成学习任务,以培养学生发现问题,分析问题,解决问题的能力。同时培养学生主动学习的意识。

四、教学措施

1.计算机是一个不断发展的学科,也是一个日新月异的学科,不断会有新的计算机技术出现,教师要在第一时间了解这些动态,然后学会交给学生。因为计算机在现实生活中的应用都是最新的技术,如果与现实脱节了,那么学生现在学到的计算机知识在现实中根本就用不上。所以需要教师有良好的计算机学习能力,为学生做好引导者。

2.采用项目教学法,任务驱动式,案例讲解,实例讨论等教学法围绕“教务管理系统”组织教学内容,分解出一个个子任务分组学习,分组讨论,充分调动学生的学习积极性,开发个人潜能。

3.学生自主完成学习任务,以培养学生发现问题,分析问题,解决问题的能力。同时培养学生主动学习的意识。

4.该课程理论性和实践性均强,要求学生勤学多练,除掌握对网页制作的操作外,还应要求学生做好flash与平面设计,并引导学生综合运用。根据学生的学习情况制订贴近学生生活的实践操作以真正达到了学以致用的目的。

篇4:网页设计教学计划

网页设计软件包括:

Photoshop:学习图像处理、编辑、通道、图层、路径综合运用;图像色彩的校正;各种特效滤镜的使用;特效字的制作;图像输出与优化等,灵活运用图层风格,流体变形及褪底和蒙板,制作出千变万化的图像特效。

Freehand:不论是个人作品设计、公司徽标、海报制作,都可以轻松完成,应用于广告、印刷等行业

CorelDraw:通过CorelDRAW9的全方面的设计及网页功能融合到现有的设计方案中,制作矢量的插图、设计及图像,出色地设计公司标志、简报、彩页、手册、产品包装、标识、网页及其它。

PageMaker:学习排版设计的基本法则、使用方法与技巧,工具箱、快捷键的使用,菜单功能及操作技巧,出版物、书籍、宣传彩页、出片输出注意事项,报纸杂志等的高级专业排版制作的方法。

Illustrator:学习图形绘制、包装、宣传页的制作,让你更加方便地进行LOGO及CI设计,不到一个月,您就会成为一名真正的美术大师,在Photoshop的基础上再学它如虎添翼,效率成倍提高。

网页制作软件包括:

一、菜鸟级网页制作软件

如果你是一个网页制作初学者,那么让下面几种软件带你走进那绚丽多彩的网页制作世界吧!

①MicrosoftFrontPage

如果你曾对Word很熟悉,那么相信你用FrontPage进行网页设计一定会非常顺手。使用FrontPage制作网页,你能真正体会到“功能强大,简单易用”的含义。页面制作由FrontPage中的Editor完成,其工作窗口由3个标签页组成,分别是“所见即所得”的编辑页,HTML代码编辑页和预览页。FrontPage带有图形和GIF动画编辑器,支持CGI和CSS。向导和模板都能使初学者在编辑网页时感到更加方便。

FrontPage最强大之处是其站点管理功能。在更新服务器上的站点时,不需要创建更改文件的目录。FrontPage会为你跟踪文件并拷贝那些新版本文件。FrontPage是现有网页制作软件中惟一既能在本地计算机上工作,又能通过Internet直接对远程服务器上的文件进行工作的软件。

Netscape编辑器

NetscapeCommunicator和NetscapeNavigatorGold3.0版本都带有网页编辑器。如果你喜欢用Netscape浏览器上网,使用Netscape编辑器真是简单方便!当你用Netscape浏览器显示网页时,单击编辑按钮,Netscape就会把网页存储在硬盘中,然后就可以开始编辑了。你也可以像使用Word那样编辑文字、字体、颜色,改变主页作者、标题、背景颜色或图像,定义描点,插入链接,定义文档编码,插入图像,创建表格等,是不是与FrontPage2000还有些像?但是,Netscape编辑器对复杂的网页设计就显得功能有限了,它连表单创建、多框架创建都不支持。

Netscape编辑器是网页制作初学者很好的入门工具。如果你的网页主要是由文本和图片组成的,Netscape编辑器将是一个轻松的选择。如果你对HTML语言有所了解的话,能够使用Notepad或UltraEdit等文本编辑器来编写少量的HTML语句,也可以弥补Netscape编辑器的一些不足。

AdobePagemill

Pagemill功能不算强大,但使用起来很方便,适合初学者制作较为美观、而不是非常复杂的主页。如果你的主页需要很多框架、表单和ImageMap图像,那么AdobePagemill的确是你的首选。

Pagemill另一大特色是有一个剪贴板,可以将任意多的文本、图形、表格拖放到里面,需要时再打开,很方便。

ClarisHomePage

如果使用ClarisHomePage软件,你可以在几分钟之内创建一个动态网页。这是因为它有一个很好的创建和编辑Frame(框架)的工具,你不必花费太多的力气就可以增加新的Frame(框架)。而且ClarisHomePage3.0集成了FileMaker数据库,增强的站点管理特性还允许你检测页面的合法连接。不过界面设计过于粗糙,对ImageMap图像的处理也不完全。

二、中级网页制作软件

如果你对网页设计已经有了一定的基础,对HTML语言又有一定的了解,那么你可以选择下面的几种软件来设计你的网页,他们一定会为你的网页添色不少。

DreamWeaver

自制动态HTML动画的网页

DreamWeaver是一个很酷的网页设计软件,它包括可视化编辑、HTML代码编辑的软件包,并支持ActiveX、JavaScript、Java、Flash、ShockWave等特性,而且它还能通过拖拽从头到尾制作动态的HTML动画,支持动态HTML(DynamicHTML)的设计,使得页面没有plug-in也能够在Netscape和IE4.0浏览器中正确地显示页面的动画。同时它还提供了自动更新页面信息的功能。

DreamWeaver还采用了RoundtripHTML技术。这项技术使得网页在DreamWeaver和HTML代码编辑器之间进行自由转换,HTML句法及结构不变。这样,专业设计者可以在不改变原有编辑习惯的同时,充分享受到可视化编辑带来的益处。DreamWeaver最具挑战性和生命力的是它的开放式设计,这项设计使任何人都可以轻易扩展它的功能。

Fireworks

第一款彻底为Web制作者们设计的软件

Fireworks的来头实在不小,它的出现使Web作图发生了革命性的变化。Fireworks是专为网络图像设计而开发,内建丰富的支持网络出版功能,比如Fireworks能够自动切图、生成鼠标动态感应的javascript。而且Fireworks具有十分强大的动画功能和一个几乎完美的网络图像生成器(Export功能)。它增强了与dreamweaver的联系,可以直接生成dreamweaver的Libaray甚至能够导出为配合CSS式样的网页及图片!

Flash

让你的网页动起来

Flash是用在互联网上动态的、可互动的shockwave。它的优点是体积小,可边下载边播放,这样就避免了用户长时间的等待。#{6FLASH6}#可以用其生成动画,还可在网页中加入声音。这样你就能生成多媒体的图形和界面,而使文件的体积却很小。FLASH虽然不可以像一门语言一样进行编程,但用其内置的语句并结合JavaScripe,您也可做出互动性很强的主页来。有人曾经说过:下个世纪的网络设计人不会用FLASH,必将被淘汰出局!我相信这句话没错!

HotDogProfessional

制作要加入多种复杂技术的网页

HotDog是较早基于代码的网页设计工具,其最具特色的是提供了许多向导工具,能帮助设计者制作页面中的复杂部分。HotDog的高级HTML支持插入marquee,并能在预览模式中以正常速度观看。这点非常难得,因为即使首创这种标签的Microsoft在FrontPage中也未提供这样的功能。HotDog对plug-in的支持也远远超过其他产品,它提供的对话框允许你以手动方式为不同格式的文件选择不同的选项。但对中文的处理不很方便。

HotDog是个功能强大的软件,对于那些希望在网页中加入CSS、Java、RealVideo等复杂技术的高级设计者,是个很好的选择。

HomeSite

制作可完全控制页面进程的网页

Allaire的HomeSite是一个小巧而全能的HTML代码编辑器,有丰富的帮助功能,支持CGI和CSS等等,并且可以直接编辑perl程序。HomeSite工作界面繁简由人,根据习惯,可以将其设置成像Notepad那样简单的编辑窗口,也可以在复杂的界面下工作。

HomeSite更适合那些比较复杂和精彩页面的设计。如果你希望能完全控制你制作的页面的进程,HomeSite是你最佳选择。不过对于生手过于复杂。

三、高级网页制作软件

MicrosoftVisualStudio

该系列的版本有:2003、2005、2008和未来的版本;

适合开发动态的aspx网页,同时,还能制作无刷新网站、webservice功能等,仅适合高级用户。

Jbuilder

不论是各种版本,均适合使用其开发出JSP网页,仅适合高级用户。?

下载全文