前端Web开发基础课程标准样本.doc

资源描述

资料内容仅供您学习参考，如有不当或者侵权，请联系改正或者删除。《前端 Web开发基础》课程标准表1 课程基本信息课程类别专业课课程代码 412 总学时 64 (理论: 32\实验: 32 ) 学分 3 开设学期第九学期适用专业 ”3+4”分段贯通应用型本科适用专业 ”3+4”分段培养计算机应用技术( 中职) 与软件工程( 本科) 专业授课方式理论+实验执笔人审核人制定时间 .01 ( 一) 课程性质与任务课程性质: 《Web开发基础》是软件工程专业培养课程体系中的一门专业必修课程, 其包含了软件行业Web开发领域的关键技术基础知识( HTML, CSS及JavaScript等) 。该课程的设置充分考虑了其在Web开发领域的关键性作用、当前市场广泛的应用需求和良好的就业前景, 注重学生对理论基础知识、专业技能的理解、掌握。课程任务: 经过本课程的学习, 使学生理解HTML、 CSS及JavaScript等基本的理论知识; 掌握应用上述理论知识, 制作基本网页、设计网页布局、实现多样化及良好客户体验的页面效果等应用技能; 培养学生的创新意识, 设计特色网页。 ( 二) 课程教学目标经过本课程的学习, 使学生掌握Web开发技术的基本理论知识, 具备一定的应用开发技能, 培养学生工程意识、创新能力和素质。 1. 知识目标 ( 1) 了解本课程内容在Web开发领域的定位与作用; ( 2) 了解HTML、 CSS及JavaScript技术的发展脉络、趋势及应用前景; ( 3) 掌握HTML中的基本元素、文字与段落元素、图像元素、列表元素、表格元素、超链接元素、多媒体元素、框架元素及表单元素的语法、属性和参数等基础知识; ( 4) 掌握CSS中元素的语法、属性和参数等基础知识; ( 5) 了解网页布局的几种方法, 掌握使用CSS进行网页布局、样式设计的基础知识; ( 6) 掌握JavaScript中的基本语法知识; ( 7) 掌握JavaScript进行提交内容校验、生成网页特效等方法。 2. 能力目标 ( 1) 具备使用HTML制作包含基本内容的网页的能力; ( 2) 具备使用HTML及CSS等技术来设计网页布局的能力; ( 3) 具备使用JavaScript技术来提高网页交互性、体验性的能力; ( 4) 具备综合使用HTML、 CSS与JavaScript的相关知识, 来丰富、渲染网页的能力; ( 5) 具备根据具体应用需求, 创新性地设计网页的能力。 3. 素质目标 ( 1) 培养学生具备克服困难解决问题的意志; ( 2) 培养学生养成严谨认真的科学态度, 耐心细致的工作作风; ( 3) 培养学生具备良好的交流沟通素养和创新精神。 ( 三) 参考学时 64 (理论: 32\ 实验: 32) ( 四) 课程学分 4学分 ( 五) 课程内容和要求( 理论48学时, 实验16学时) 本课程的主要内容有: HTML, 主要包括网页基本组成元素, 网页框架、超文本链接、表单、表格、层等。CSS, 产要包括修改网页元素, 主要包括修改文字颜色及背景、调整字符间距、单词间距、添加文字修饰、设置文本排列方式、设置段落缩进、调整行高、转换英文大小写、设置颜色、设置背景颜色、插入背景图片、设置背景图片位置、设计边框样式、调整边框宽度、设置边框颜色、设置边框属性等。JavaScript, 包括JavaScript基本语法、基本数据类型、运算符、函数、 JavaScript事件分析、图片和多媒体文件的使用、 JavaScript对象的应用、浏览器内部对象、内置对象和方法等。本课程要求学生了解web编程技术的产生和发展过程, 会使用HTML编写网页, 会用CSS对网页样式进行设计, 会使用JavaScript实现一些客户端的数据验证及网页特效, 达到一般企业用人标准。表2 课程内容与学时安排表序号教学项目教学内容与教学要求活动设计建议参考课时 ( 理论+实验) 1 第1章 HTML、 CSS、 JavaScript综述 1.1 这就是HTML、 CSS、 JavaScript的代码 1.2 HTML、 CSS、 JavaScript各自的角色 1.3 如何学习HTML、 CSS、 JavaScript 1.4 小实例——HTML、 CSS、 JavaScript的 1.4 综合应用 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 查找资料, 课堂讲授中, 穿插发言、讨论的形式, 来进行授课 2 2 第2章 HTML基础介绍 2.1 HTML文档的结构 2.2 HTML基本语法 2.3 HTML文件的命名 2.4 编写HTML文件的注意事项 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 编写一个HTML简单文件进行示例讲解 2 3 第3章 HTML文件的整体结构 3.1 文件头部内容 3.2 主体内容＜body＞ ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出关于<body>的程序示例进行讲解 2 4 实验1 制作简单的HTML页面使用网页基本组成元素, 编写一个简单的HTML页面, 运行查看效果 ( 1) 采用实验课形式 ( 2) 建议布置学生提前复习所学习的相关HTML元素的语法、属性及参数知识 2 5 第4章文字与段落 4.1 编辑内容 4.2 文字效果 4.3 文字修饰 4.4 段落＜p＞ 4.5 小实例——文字网页 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出关于文字与段落元素的的程序示例进行讲解 2 6 第5章建立和使用列表 5.1 列表类型 5.2 嵌套列表 5.3 小实例——列表在网页中的使用 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出关于列表的程序示例进行讲解 2 7 第6章超链接 6.1 超链接概述 6.2 超链接的路径 6.3 超链接的建立 6.4 设置图像映射 6.5 小实例——超链接的使用 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出超链接的程序示例进行讲解 2 8 第7章表格的应用 7.1 表格概述 7.2 插入表格＜table＞ 7.3 设置表格标记属性 7.4 设置表格行与单元格 7.5 表格嵌套 7.6 小实例——表格在网页中的应用 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出表格相关的程序示例进行讲解 4 9 实验2 练习使用表格和和列表要求使用表格、列表对数据进行格式化的显示 ( 1) 采用实验课形式 ( 2) 建议布置学生提前复习所学习的表格、列表等元素的语法、属性及参数知识 2 10 第8章层的应用 8.1 图层的创立——＜div＞ 8.2 创立嵌套图层 8.3 层的属性设置 8.4 小实例——图层的实际应用 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出图层相关的程序示例进行讲解 3 11 第9章框架的应用 9.1 框架概述 9.2 框架的基本结构 9.3 设置框架 9.4 设置框架集＜frameset＞ 9.5 浮动框架＜iframe＞ 9.6 在框架上建立链接 9.7 小实例——框架的实际应用 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出框架相关的程序示例进行讲解 3 12 实验3 练习使用框架练习使用框架, 来规划、设计页面内容, 包括使用<frameset>及<iframe>框架技术 ( 1) 采用实验课形式 ( 2) 建议布置学生提前复习所学习的框架元素的语法、属性及参数知识 2 13 第10章表单的应用 10.1 表单概述 10.2 表单标记＜form＞ 10.3 信息输入＜input＞ 10.4 小实例——表单的实际应用 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出表单相关的程序示例进行讲解 2 14 实验4 练习使用表单练习使用表单, 包括其action及method属性, 并练习使用表单中的元素, 包括文本框、列表框、文本域、单选框、复选框和按钮等内容 ( 1) 采用实验课形式 ( 2) 建议布置学生提前复习所学习的表单及表单内相关元素的语法、属性及参数知识 2 15 第11章 CSS样式表基础 11.1 CSS的概述 11.2 CSS的使用 11.3 插入CSS样式表 11.4 编写CSS文件 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出使用CSS、编写简单CSS的程序示例进行讲解 2 16 第12章字体的设置 12.1 设置字体——font-family 12.2 设置字号——font-size 12.3 设置字体样式——font-style 12.4 设置字体加粗——font-weight 12.5 设置字体变体——font-variant 12.6 组合设置字体属性——font 12.7 小实例——综合设置字体 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出经过CSS设置字体相关的程序示例进行讲解 2 17 实验5 练习使用CSS对字体进行设置练习使用CSS, 在HTML文件里进行调用, 对字体进行设置, 包括了对字体、字号、字体样式、加粗、字体变体、字体属性等的设置 ( 1) 采用实验课形式 ( 2) 建议布置学生提前复习所学习的表单及表单内相关元素的语法、属性及参数知识 2 18 第13章文本的精细排版 13.1 调整字符间距——letter-spacing 13.2 调整单词间距——word-spacing 13.3 添加文字修饰——text-decoration 13.4 设置文本排列方式——text-align 13.5 设置段落缩进——text-indent 13.6 调整行高——line-height 13.7 转换英文大小写——text-transform 13.8 小实例——综合应用文本属性 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出CSS对文本进行精密排版相关的程序示例进行讲解 2 19 实验6 使用CSS来对文本进行精细排版要求编写CSS文件, 在HTML文件里进行调用, 控制DIV显示效果, 练习调整字符间距、单词间距、文字修饰、文本排列方式、段落缩进、行高英文大小写等内容 ( 1) 采用实验课形式 ( 2) 建议布置学生提前复习所学习的CSS语法知识 2 20 第14章图片和多媒体文件的使用 14.1 图片 14.2 滚动文字 14.3 插入多媒体文件——＜embed＞ 14.4 添加背景音乐——＜bgsound＞ 14.5 小实例——综合设置图片和多媒体 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出图片和多媒体文件相关的程序示例进行讲解 2 21 第15章 CSS样式的高级应用 15.1 列表 15.2 定位 15.3 CSS层 15.4 鼠标指针——cursor 15.5 小实例——综合设置层样式 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出CSS样式相关高级应用的程序示例进行讲解 2 22 实验7 熟练使用CSS+DIV等元素进行网页布局设计理解网页布局的几种方法, 重点使用CSS+DIV进行网页布局设计 ( 1) 采用实验课形式 ( 2) 建议布置学生提前复习所学习的使用CSS+DIV的网页布局知识 2 23 第16章颜色和背景 16.1 设置颜色——color 16.2 设置背景颜色——background-color 16.3 插入背景图片——background-image 16.4 插入背景附件——background-attachment 16.5 设置重复背景图片——background-repeat 16.6 设置背景图片位置——background-position 16.7 小实例——综合设置颜色和背景 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出CSS设置颜色和背景相关的程序示例进行讲解 2 24 第17章边框和边距 17.1 设计边框样式——border-style 17.2 调整边框宽度——border-width 17.3 设置边框颜色——border-color 17.4 设置边框属性——border 17.5 边距——margin-top/margin-bottom/margin-left/ margin-right/margin 17.6 填充——padding-top/padding-bottom/padding-left/ padding- right/padding 17.7 小实例——综合设置边框和边距 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出CSS设置边框和边距相关的程序示例进行讲解 2 25 第18章 JavaScript基础 18.1 JavaScript语言概况 18.2 第一个JavaScript程序 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 设计一个简单的JavaScript程序进行讲解 2 26 第19章 JavaScript基本语法 19.1 基本数据类型 19.2 运算符 19.3 程序结构 19.4 函数 19.5 小实例——修改密码 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出相关的程序示例进行讲解 3 27 第20章 JavaScript事件分析 20.1 事件概述 20.2 主要事件分析 20.3 其它常见事件 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出事件相关的程序示例进行讲解 3 28 第21章 JavaScript对象的应用 21.1 对象概述 21.2 浏览器内部对象 21.3 内置对象和方法 ( 1) 采用理论课讲授形式 ( 2) 布置学生提前预习, 除讲授基本知识外, 给出JavaScript对象相关的程序示例进行讲解 2 29 实验8 编写JavaScript程序进行页面验证要求编写一个JS程序文件, 在另一个文件中对属性进行赋值, 对方法进行引用, 能够进行页面验证等功能 ( 1) 采用实验课形式 ( 2) 建议布置学生提前复习所学习的JavaScript语法知识 2 ( 六) 教学建议 1. 教学方法本门课程教学中应注意激发和保持学生的学习兴趣, 采用灵活的教学方法和先进的教学手段, 加强理论与实际的联系, 加强课前、课后的答疑辅导, 组织学生自我经验叙述、讨论、问题教学、阅读指导等。 ( 1) 借助范例教学, 以点带面, 突出重点在理论知识讲授过程中, 应适当选取基本点、重点内容, 对其设计相关范例, 进行教学, 来提高、巩固学生对该理论知识的认知水平, 让学生能够理论结合实践, 不但限于纸面, 更可深入到具体的范例场景, 加深理解。 ( 2) 分组讨论式教学方法。学生按照要求, 进行预习、查阅资料等, 在课堂上再根据教师的问题进行分组讨论, 并由各组选派一名同学发言回答老师所提问题, 并由本组的其它同学补充, 讲述完毕后, 由教师及其它各组的同学讨论、提问。 2. 评价方法本课程的教学环节包括课堂讲授, 课堂讨论和期末考试。经过加强基础、面向实际、引导思维、启发创新, 使学生获得理论知识, 培养理论联系实际的能力。总评成绩 = 过程性考核( 30%) +终结性考核( 70%) 3. 教学条件拥有多媒体教室、实验中心等设施, 能够确保教师课堂讲授、学生实践训练的需求。 4. 教材选编编选本教材根据教学标准编写活页教材, 课程实践中优化编著适应性教材 ( 1) 课程教材 [1] 刘西杰,柳林. HTML、 CSS、 JavaScript网页制作——从入门到精通[M]. 人民邮电出版社. ( 2) 参考教材 [1] 王津涛.网页设计与开发——HTML、 CSS、 JavaScript( 21世纪高等学校规划教材) [M].清华大学出版社. [2] 吕凤顺,王爱华,王轶凤.HTML+CSS+JavaScript网页制作实用教程( 新世纪高职高专课程与实践系列教材) [M].清华大学出版社.

展开阅读全文