课程名称：移动WEB开发(HTML5+CSS3)
学    分：5.5
计划学时：96
适用专业：计算机应用技术
1．前言
1.1课程性质
本课程是计算机应用技术专业的一门专业核心课。其功能在于向学生介绍移动WEB开发中的热门技术HTML5和CSS3，培养学生利用HTML5和CSS3进行跨平台移动WEB应用开发的能力。通过本课程的学习，使学生熟悉HTML5网页的基本结构，HTML5标签、CSS3样式的定义与样式表的应用等技术，从而能够熟练掌握形式多样的移动WEB应用设计方法，为将来从事WEB前端开发、WebApp开发及跨平台应用开发等相关工作奠定基础。
本课程的先修课程为网站前端设计，后续课程为网站后台开发(ASP.NET)、网页脚本技术(Jav
aScript+jQuery)。
1.2设计思路
本课程是以高职计算机类网站开发方向学生的就业为导向，在行业专家的指导下，对移动WEB开发开发过程中所涉及的岗位进行职业能力分析，以实际工作中移动WEB开发的设计任务为引领，通过项目组织教学，倡导学生在项目中学会利用HTML5和CSS3进行跨平台移动WEB应用开发的基本技能，培养学生初步具备移动WEB开发开发过程中需要的基本职业能力。
在教学内容的选择上，从跨平台移动WEB开发实际应用的角度出发，理论知识以“必需够用”为度，以学生为主体，注重学生实际操作能力与应用能力的培养。根据HTML5+CSS3的八大典型WEB应用，按项目构筑课程教学内容，通过项目引领和任务驱动，并配以案例分析进行教学，着重培养学生的实践应用技能，通过实践使学生能够将所学应用到实际的项目之中。
建议本课程课时为96学时，计算机类三年制安排在第3学期，计算机类五年一贯制安排在第7学期。
2．课程目标
2.1总体目标
通过本课程的学习，要求学生掌握HTML5和CSS3基础知识及最新技术， 具备扎实的HTML5和CSS3开发基础，能够独立使用HTML5和CSS3开发兼容各在平台的移动WEB应用，学会网页中复杂样式与网页特效的设计，也为日后学习跨平台移动WEB应用开发奠定基础。
2.2具体目标
2.2.1知识目标
(1)了解HTML5和CSS3的发展。
(2)熟练掌握HTML5网页的基本结构、CSS3样式的定义与样式表的插入。
(3)熟练掌握HTML5常用的文本标签、CSS文本属性。
(4)熟练掌握HTML5的图像标签、CSS的图像属性。
(5)熟练掌握HTML5的列表标签、CSS的属性、表格属性和定位属性。
(6)熟练掌握HTML5的表单及控件标签、form属性和input属性。
(7)熟练掌握HTML5的Audio/Vedio方法、Audio/Vedio事件、CSS媒介类型。
(8)熟练掌握HTML5的<canvas>标签、画布与画笔、坐标与路径、网页图形绘制。
(9)掌握CSS各种类型的选择器、CSS框模型、边框属性、内外边距属性、多列属性、动画属性和HTML5拖放的实现方法。
(10)了解HTML5地理定位、Web数据存储、应用程序缓存、Web Workers等高级应用。
2.2.2能力目标
(1)会应用HTML5结合CSS3设计移动平台网站首页。
(2)能设计并实现文本网页和导航网页。
(3)会在网页中合理地插入图像，能设计并实现图像网页。
(4)会应用列表、表格及CSS定位设计设计信息展示网页。
(5)会应用表单及标签控件设计注册登录录与留言网页。
(6)能应用<Audio>、<Vedio>标签及相关属性、方法和事件设计音乐视频网页。
(7)会应用<canvas>标签及相关属性和方法绘制图形、设计游戏。
(8)会设计复杂样式与网页特效。
2.2.3素质目标
(1)具有较强的专业学习、执行和创新能力。
(2)培养学生团队合作和与人交流、沟通的能力。
(3)提高学生运用所学专业知识进行独立思考和综合分析、解决实际问题的能力。
(4)促使学生学习和获取新知识，掌握自我学习的能力。
3．课程内容与要求
序号
教学任务
课程内容及教学要求
教学设计
参考学时
1
跨平台的网站首页设计
技能内容及要求：
(1)会应用HTML5结合CSS3设计移动平台网站首页。
知识内容及要求：
(1)了解HTML5和CSS3的发展。
(2)熟练掌握HTML5网页的基本结构。
(3)熟练掌握CSS3样式的定义与样式表的插入。
HTML5与CSS3简介
分析HTML5网站首页
HTML5网站首页设计项目
12
2
文本新闻浏览网页设计
技能内容及要求：
(1)能设计并实现文本网页和导航网页。
知识内容及要求：
(1)熟练掌握HTML5常用的文本标签
(2)熟练掌握CSS文本属性。
分析名站导航网页
设计站内导航网页
设计文本新闻网页
12
3
旅游景点推荐网页设计
技能内容及要求：
(1)会在网页中合理地插入图像
能设计并实现图像网页。
知识内容及要求：
(1)熟练掌握HTML5的图像标签。
(2)熟练掌握CSS的图像属性。
分析推荐旅游目的地网页
设计Touch版旅图网页
设计最佳旅游景区网页
10
4
商品信息展示网页设计
技能内容及要求：
(1)会应用列表、表格及CSS定位设计设计信息展示网页。
知识内容及要求：
(1)熟练掌握HTML5的列表标签。
(2)熟练掌握CSS的属性。
(3)熟练掌握表格属性。
(4)熟练掌握定位属性。
分析触屏版的热销商品网页
设计促销商品列表网页
设计选用商品列表网页
10
5
注册登录与留言网页设计
技能内容及要求：
(1)会应用表单及标签控件设计注册登录录与留言网页。
知识内容及要求：
(1)熟练掌握HTML5的表单及控件标签。
(2)熟练掌握HTML5新的form属性。
(3)熟练掌握HTML5新的input属性。
分析用户注册网页
设计用户登录网页
设计意见反馈网页
10
6
音乐视频网页播放设计
技能内容及要求：
(1)能应用<Audio>、<Vedio>标签及相关属性、方法和事件设计音乐视频网页。
知识内容及要求：
(1)熟练掌握HTML5的Audio/Vedio方法。
(2)熟练掌握HTML5的Audio/Vedio事件。
(3)熟练掌握CSS媒介类型。
分析网页音乐播放器
网页开发课程设计网页音乐播放器
分析网页视频播放器
设计网页视频播放器
10
7
网页图形绘制与游戏设计
技能内容及要求：
(1)会应用<canvas>标签及相关属性和方法绘制图形、设计游戏。
知识内容及要求：(1)熟练掌握HTML5的<canvas>标签。
(2)熟练掌握HTML5的画布与画笔。
(3)理解HTML5的坐标与路径。
(4)熟练掌握网页图形绘制。
分析网页中图形的绘制
在网页中绘制各种图形和文字
设计网页游戏
12
8
复杂样式与网页特效设计
技能内容及要求：
(1)会设计复杂样式与网页特效。
知识内容及要求：
(1)掌握CSS各种类型的选择器、CSS框模型、边框属性、内外边距属性、多列属性、动画属性的实现方法。
(2)掌握HTML5拖放的实现方法。
分析迷你音乐播放器面板制作
分析纯CSS3实现的焦点图切换效果
绘制阴阳图和五角星
绘制圆角按钮和圆角图片
绘制圆形导航按钮
实现图片拖动操作
12
9
HTML5高级应用
技能内容及要求：
(1)能实现HTML5+CSS3的简单高级应用。
知识内容及要求：
(1)了解HTML5地理定位应用。
(2)了解HTML5 Web数据存储应用。
(3)了解HTML5应用程序缓存应用。
了解HTML5 Web Workers多线程处理应用。
HTML5地理定位应用案例
HTML5 Web数据存储应用案例
HTML5应用程序缓存案例
HTML5 Web
Workers应用案例
8
合计
4．实施建议
4.1 教材选用和编写建议
教材选用：陈承欢.跨平台的移动Web开发实战(HTML5+CSS3).北京.人民邮电出版社.2015.2
参考资料：
1.杨东昱. HTML5+CSS3精致范例辞典.北京.清华大学出版社.2013
2.唐俊开. HTML5移动Web开发指南.北京.人民邮电出版社.2013
3.石川. HTML5移动Web开发实战.北京.人民邮电出版社.2013
4.2教学建议
本课程教学既要重视知识的系统性，为后续课程的学习乃至学习者职业发展打好基础，也要重视专业技能的实用性，以项目和工作任务组织教学内容，将理论与实践的内容进行整合。教师在讲解知识点的基础上，要重视学生的操作练习，应当教、学、做三位一体化，理论与
实践并重, 注重教学的有效性。最后已以3-4人为一组，完成小项目，深化对课程学习内容的掌握。培养学生团队协作能力、交往与合作能力、沟通能力、抗挫折能力、创新实践能力、获取新知识与新技能的能力。
教学中要充分发挥学生的主体作用和教师的主导作用，从学生的实际和企业岗位的需求出发，遵照学生的学习特点和认识规律，突出培养学生解决实际问题的能力和应变能力，强化情感态度价值观的教育，注意移动WEB应用开发的规范性。
本课程总学时96，其中理论教学32学时，实践教学64学时。
4.3教学考核评价建议
本课程操作性强，鉴于平时学习过程、实训操作的重要性，为全面考核学生的学习情况、职业技能掌握情况，注重评价的多元性，结合课堂提问、提交作品、报告等大作业形式、以及学生个人的动手能力、实践中分析问题、解决问题的能力、团队协作能力综合评价学生。
平时成绩40%：考勤(5%)、课堂提问(5%)、课内课外完成的作品质量和数量(10%)、期中大作业提交(20%)。
期末成绩60%：理论加上机相结合的形式。
4.4课程资源的开发与利用
学习包和教材都是素材性资源。教材是知识的载体，学习包是引导学生学习的载体。因此，要开发学习包，突出以学生为中心的学习过程；将本课程的教学内容与地区经济及当地软件开发窗口程序实际工作情况紧密结合，并体现学生职业生涯发展的需要；要充分利用当前丰富的网络资源。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。