admin 管理员组

文章数量: 1184232


2023年12月18日发(作者:线程销毁时 threadlocal)

《网页设计(HTML5+CSS3)》核心课程标准

课程编码

计划学时

适用专业

开课学期

先行课程

平行课程

后继课程

计算机应用基础

课程类别 专业核心课

128

软件技术

第一学期

课程类型

课程性质

学分

开课单位

考核类型

B类

必修

6

信息工程系

考试

JavaScript程序设计与jQuery框架

一、课程性质与定位

本课程是软件技术专业的核心课程,也是后续JavaScript程序设计与jQuery框架的基础课程,在Web前端开发中占有重要地位。通过本课程的课堂教学和实践教学,使学生能够掌握网页设计的两大基础,HTML和CSS,具备常见门户网站、电商网站的设计与制作能力,培养学生科学的思维方法,灵活运用知识的能力和自主学习的能力,为后续网站开发课程的学习、网页制作员工作的胜任打下坚实的基础。

二、课程设计理念

本课程强调对学生职业素养和Web前端编程能力的培养,按照理实一体、课内外互补、课堂教学与培优工程相结合的课程设计指导思想,以任务或项目为载体组织教学内容,采取讲练结合、微课教学、视频辅导、单元测试、赛练融合等多种教学形式和手段,突出学生的主体地位,在校内实训室完成所有教学环节,实现“教、学、做”的有机融合;通过班级讲授、团队学习、个体辅导、展示交流、技能大赛等手段,实现从模仿到应用到创新的高职学生递进式培养。

三、课程目标

(一)总体目标

本课程涉及网页基础、HTML5标记、CSS3样式、网页布局等内容。通过本课程的学习,学生能够了解HTML5基本标签和CSS3常用样式,熟悉网页设计流程,掌握常见的网页布局效果,掌握一定的Web前端开发知识,学会制作各种企业、门户、电商类网站。同时通过教学过程中的实际开发过程的规范要求强化学生的职业道德意识和职业素质养成意识,为学生后续课程学习夯实基础。

(二)具体目标

1

.能力目标

了解Web前端程序员等相关职业岗位的工作职责;具有一定的网页设计与制作能力;

具备良好的编程习惯和准确的语言表达能力;具有一定的科学思维方式和分析判断解决问题的能力;具有社会适应能力、沟通能力与自我学习能力;具有良好的职业道德与敬业精神,具有团队合作意识。

2 .知识目标

认识网页和网站,了解相关概念;熟悉ViSU阿StUdioCode和HbUilder的使用;熟练掌握HTML5基本标签;掌握常用H5表单控件并能熟练运用;理解CSS3样式规则及选择器,能合理使用CSS美化页面;理解CSS盒子模型、浮动和定位布局,并能应用到网页设计中;掌握HTML和CSS多媒体应用;掌握CSS3的变形、动画和转换;能达到“1+X”Web前端开发初级标准。

四、课程教学内容及学时分配

序号 项目名称 学习目标 学习内容 学时

1 .认识网页和网站

了解Web标准,了解网页和网站,明确HTML、CSS及2 .网站制作流程

3 .网页设计规范

4 .HTML简介

5 .CSS简介

4

JavaScript在其中的作用;1

认识网页和网熟悉常见的浏览器;熟悉站

DreamWeaver工具的基本操6 .JavaScript简介

作,能使用Dreamleaver创7

建简单的网页。

.常用浏览器介绍

8 .Hbuilder工具的使用

9 .使用Hbuilder创建第了解HTML5发展历程,熟悉浏览器支持情况;理解从零开始构建

一个页面

1

.认识HTML和HTML5

2 .认识标记

.HTML文档基本格式单

HTML5基本语法,掌握新特3

性;掌握HTML文档基本格式,4

2

HTML页面

.标记属性

12

.HTML5文档头部相关标记

能够书写规范的HTML网页;5

掌握文本控制表标记、图像6.标题和段落标记

标记、超链接标记,

7 .文本样式标记

能够制作简单网页。

8.文本格式化标记

9.特殊字符标记

10 .常用图片格式

11

.图像标记

12 .相对路径与绝对路径

13

.认识HTML5新标记

掌握CSS样式规则,能够书写规范的CSS样式代码;掌握LCSS样式规则

2.

引入CSS样式表

CSS基础选择器

CSS文本样式属性,能够控制3.

运用CSS技术设置网页样式

字体样式属性

页面中的文本样式;掌握CSS4.

文本外观属性

选择器写法,可以快捷选择页5.

3 16

CSS复合选择器

面中的元素;理解CSS层叠6.

CSS层叠性与继承性

性、继承性与优先级,学会高7.

效控制网页元素;了解CSS38. CSS优先级

新增选择器。

9. CSS3新增选择器

1 .认识盒子模型

2 .div标记

3 .盒子宽高

了解盒子模型的概念;掌握盒4 .边框属性

.内边距属性

运用CSS盒子子模型相关属性,能够使用它5

4

模型划分网页模块

们熟练地控制网页元素;理解6.外边距属性

块元素与行内元素的区别,能7

够对它们进行转换。

16

.阴影

8.背景属性

9 .元素的类型

1().span标记

11.元素的转换

1

.无序列表

.有序列表

8

掌握无序、有序及定义列表的5

2

添加列表和超

使用,可以制作常见的网页列链接

表模块;掌握超链接标记的使3 .定义列表

用,能够使用超链接

4 .定义列表实现图文混

定义网页元素;掌握CSS伪类,会使用CSS伪类实现超链接特效。

5 .list-style复合属性

6 .超链接标记

7 .链接伪类

8

.锚点链接

1

.创建表格

2 .表格标记

掌握表格标记的应用,能创建3

表格并添加样式;理解表单的4

添加表格和表

构成,可以快速创建表单;掌5

握表单相关标记,能够创建具6

有相应功能的表单控件;掌握7

表单样式的控制,能够美化表8

单界面。

.CSS美化表格

.表单构成

.创建表单

.表单属性

.input控件

.textarea控件

16 6

9 .select控件

10 .datalist控件

控制表单样式

1

.布局概述

2 .元素的浮动属性float

掌握标记的浮动属性,能够为3

标记设置和清除浮动;掌握标4

.清除浮动

.标记定位属性

16 7

.overflow属性

运用浮动与定记的定位属性,能够理解不同5

位布局网页

.Z-index标记层叠

类型定位之间的差别;掌握6

div+css布局技巧,能够利用7 .单列布局

该技巧为网页布局。

8 .两列布局

9.三列布局

10

.网页模块命名规范

1 .嵌入视频

2 .〈audio》嵌入音频

8

掌握HTML5中视频的相关属8

网页多媒体

性,能够添加视频;掌握音频相关属性,能够添加音频;理3 .音视频兼容性

解过渡属性,能够常

4 .控制视频宽高

5.过渡属性

见过渡效果;掌握CSS3变形属性,能够制作2D、3D转换效果;掌握CSS3动画,能够熟练制作常见动画效果。

巩固贯通HTML、CSS基本知

6.变形

7.动画属性

9

实战开发

识的运用

能独立完成“Web前端开电商或门户网站首页

16

1 .理论试题

16

2 .实操试题

10

证书模拟试题

发”初级证书对应理论和实操题

五、教学组织与教学方法

(一)采用“任务驱动”教学模式,所有课程内容的安排均围绕学习任务的完成来展开。

(二)主要采用的教学方法有以下几种:

1.任务教学法。解决真实或虚拟企业项目开发中的实际问题,用任务牵引,采用项目组的形式,按照软件公司运作形式和项目开发流程,以学生为中心,全面完成任务分析、信息收集、计划制定、做出决策、实施计划、反馈控制、评估结果、拓展思考等教学全过程,达到通过学生自己的实践或行动来培养和提高职业能力的教学目标。

2 .分组教学法。根据学生实际情况,采用男生带女生、普高生带职高生、基础好带基础差的学生进行分组,小组间共同完成任务,培养学生的协作、团队意识。

3 .激励教学法。在教学过程中,通过各种激励手段,有意识地引导学生各种创新式思维,促进学生之间智力活动的相互感染,从而开拓进取,提高学习效率。如各个学习任务的制定,由易到难,学生经过努力完成开发后,会有逐步递增的成就感;以赛促学,以赛促教,赛证融通,以绩效考核形式管理学生学习过程和效果,增强其团队意识和荣誉感,培养以创新视角和思维解决问题的意识和习惯,效果显著。

4 .资源多样法。通过慕课、在线开发课、微课、培训机构优秀资源、学习网站等为学生提供各种各样的学习资源,线上教学与线下教学相结合,充分利用各种碎片化时间,提高学生学习效率、学习积极性和主动性,锻炼其自主学习能力。

五、考核与评价

考核主要由平时成绩、理论考试以及实训成绩组成。也可以证代考,取得证书视为课程成绩95分以上。

(一)平时成绩

平时成绩强调平时的出勤、课堂纪律、课堂表现和作业,教师通过签到、打卡、随机抽查、课后统计反馈等手段的实施监控学生的学习效果以及学习态度等。平时成绩占全部考试的50%o

(二)理论考试

理论考试采用传统的笔试方式,为了更好的达到考核的目的,我们采用第三方出题的形式来组织理论考试。理论考试占全部考试的30%。

(三)实训成绩

主要以综合案例或项目为主,采用机试+评价方式进行,由教师对学生项目的完成程度、质量,并综合其完成过程中的表现,随堂给出成绩。实训成绩占全部考试的20%。

六、教学建议

(一)教学条件

课程应配有网络教学资源和实训室,不仅教师可以利用这些资源进行教学,学生也可以通过课程资源进行自主学习。课程网络教学资源应包括:课程标准、电子课件、电子教材、学习指南、在线测试、视频动画库、图片库、案例库等内容。丰富课程教学内容、教学方法和教学手段,方便学生开展自主学习。利用电子教案、教学课件、视频及网络教学软件等进行辅助教学,在线答疑等师生互动方式,能够提高教学效果;利用习题库、相关考试题库可进行教学知识和技能的自我测评。

(二)师资要求

为实现课程教学目标,教师应该熟悉Web前端工程师执业标准,具有较丰富的Web前端开发经验,熟练掌握HTML、CSS、JavaSCriPt及相关框架等技术,能够应用这些技术设计和制作一个完整的网页,同时,还要求主讲教师具备较丰富的教学经验及课堂组织能力。具备较强的语言表达能力及教学组织能力。担任本课程实践教学指导教师应具有一定的软件企业前端开发经验,具有一定的教学经验并且需要有较强的责任心。

(三)教学方法

本课程是专业主干课程,实践性较强,在教学方法上,采用课堂理实一体化教学,课后自学,课堂讨论等教学形式。

1

.课堂理实一体化

本课程属偏实践性课程,理论知识较易接受,在讲述的过程中教师应尽量联系实际,不要陷入知识的重复赘述之中,让学生尽量多地动手实践,在动手过程中加强记忆,逐步提高网页制作能力。

2 .课后自学

为了培养学生的自学动手能力,每章都安排一些拓展案例,课上教师只给出自学提纲,不作详

细讲解,课后学生自学完成。

3 .课堂讨论

课堂讨论的目的是活跃学习气氛,开拓思路。教师应认真组织,安排重点发言,充分调动每一名同学的学习积极性,做好总结。

4 .习题课

习题课以案例、项目练习为主,可适当安排分组完成,及时检查反馈。

5

.学习笔记

教学中要求学生记录学习笔记,在记录过程中加强对标记、属性的记忆,笔记每单元检查一次,可辅以提问补充。

(四)教学评价建议及标准

本课程的评价要坚持过程性评价和总结性评价相结合,教师评价和学生评价和学生自评、互评相结合。

在评价过程中,要重点考核学生的网页实际制作能力,重点关注学生学习态度、学习习惯、学习方法、职业能力的养成。

教师可以根据需要灵活选择考核方式。由于本课程的实践性较强,考核要重在平时课堂表现及作业完成情况,课程成绩由平时成绩和期末成绩构成,平时成绩不低于50%,期末成绩不高于50%o

(五)课程资源开发与利用建议

1

.学习包和教材,都是素材性的课程资源,但教材是知识的载体,而学习包是引导学生学习的载体。因此,要开发学习包,突出以学生为中心的学习过程,将本课程的教学内容与地区经济的发展密切结合,并体现学生职业生涯发展的需要。

2 .教学中学生的问题、困惑、见解、情感和体验等都是动态生成的课程资源,老师应重视这些教学过程中动态生成的课程资源,并主动性和创造性地运用,使以项目为主的教学充满生机与活力。

3

.本课程的实施必须依赖于一定的实训条件,如计算机机房,网络教学软件、Visal

StudioCode、HbUiIder等必备的软件平台。

4

.本课程的实施,不仅应充分开发校内的课程资源,还应利用校外的课程资源,如相关企业的岗位实习和实践,尽量做到校企结合、工学结合。

5

.网络教学资源。充分开发和利用网络教学资源,为学生提供多样化的学习资源和形式,了解最新的技术策略和实施方法,培养学生自主学习的能力。

七、选用教材标及推荐教材和参考用书(或课程网站)

(一)教材选取的原则

教材选取应遵循“适用、实用、够用”的原则。

1 .适用

教材要以Web前端技术为基础,符合网页制作员的能力要求和本课程的培养目标。

2 .实用

教材应为项目驱动的教材,强调理论与实践的结合,便于实现“教、学、做”三位一体。

3 .够用

教材的内容主要包括使用HTML、CSS和JaVaSCriPt设计和制作网页的知识和技能。

(二)推荐教材

网页设计与制作(HTML5+CSS3+JavaScript)

(三)教学参考资料

HTML5+CSS3网站设计基础教程


本文标签: 学生 课程 学习 教学 网页