本课程是软件工程专业的一门专业选修课程,其前导课程为《程序设计基础》,后续课程为基于Web的软件系统设计与开发、软件测试等相关课程。为了顺应信息时代的发展以及贴近企业对人才的需求,课程以Web前端核心技术HTML5、CSS3与 JavaScript为知识主线,以“立德树人”为思政主线,鉴于大二学生拥有较强的自主学习能力和一定的问题解决能力,实施线上自主学习、线下教师引导及小组协作完成项目任务,即基于项目驱动的翻转课堂教学模式。在传递前端技术系统性与前沿性知识的同时,通过自主探究、协作学习等模式,培养学生求真务实的品格与科学观;网站开发与集成的项目实践中,将优化处理后的信息资源以恰当的媒体形式、严谨的逻辑方式与精准的前端技术表现在网站中,提升将多学科融合解决问题的能力;培养学生具有正确的职业道德和规范、社会责任感和国际视野;培养学生具有团队协作精神、批判性思维能力、开拓进取和追求创新的能力,形成较强的工程实践能力,以适应社会和企业对人才培养的需求。
课程以Web前端核心技术HTML5、CSS3与 JavaScript为知识主线,以“立德树人”为思政主线,实施基于项目驱动的翻转课堂教学模式。在传递前端技术系统性与前沿性知识的同时,通过自主探究、协作学习等模式,培养学生勤奋刻苦、不懈探究、求真务实的品格与科学观;在网站开发与集成的项目实践中,培养学生理解并遵守web前端开发职业道德和规范,具有一定的文献检索及信息甄别能力;培养学生具备良好的人文素质、艺术修养和审美能力,具有正确的理想信念、价值取向、政治素养、社会责任感和国际视野;培养学生具有团队协作精神、批判性思维能力、开拓进取和追求创新的能力,能不断自主学习,适应社会和企业对人才培养的需求。
针对本课程操作性强的特点,获取证书的要求为:本课程60分及以上以上即可获得证书。60分以下为不及格,60-69为及格,70-79为中等,80-89为良好,90-100为优秀;模块项目作业40%,最终考试占50%,课程参与讨论及交流占10%。课程讨论限定在讨论区【课堂交流区】板块,发帖(或回帖)3个及以上为满分。
课程导学
课程概述
在线学习如何学?
期中理论考查
模块一 Web前端开发基本认识(一)
项目开发-《走进Web前端开发》网站“欢迎页”设计视频讲解
项目描述与知识点分解
1-1 HTML5基本结构
1-2 CSS基本选择器
项目作业
单元测验
模块一 Web前端开发基本认识(二)
项目任务和知识点分解
1-3 HTML5语义化标签
1-4 CSS引入方法
项目作业
模块二 纯文本类网页(一)
项目描述与知识点分解
2-1 HTML5中的文本标签
2-2 CSS的字体样式
2-3 CSS的文本外观属性
2-4 列表
2-5 多列布局
项目作业
单元测验
模块二 纯文本类网页(二)
项目描述与知识点分解
2-5 Web字体图标
2-6 超链接
2-7 CSS的继承、层叠和优先级
项目作业
单元测验
模块三 图文展示网页(一)
项目描述与知识点分解
3-1 HTML5中的图像标签
3-2 CSS背景设置
3-3 CSS过渡
3-4 复合选择器
3-5 圆角边框
项目作业
项目3.1单元测验
模块三 图文展示网页(二)
项目描述与知识点分解
3-6 CSS的动画
3-7 CSS的变形
3-8 CSS阴影和渐变
项目作业
单元测验
模块五 表单网页
5-1 表单及其属性
5-2 表单的标签及其属性
5-3 HTML5表单的验证
项目作业
单元测验
模块四 网页布局与美化
项目作业
项目描述与知识点分解
4-1 标准文档流
4-2 盒子模型
4-3 div与span
4-4 position定位方式
4-5 float浮动方式
单元测验
模块六 音视频网页
6-5 HTML DOM Video标签
6-4 HTML5 Video标签
项目作业
6-3 JavaScript事件
项目描述与知识点分解
6-1 JavaScript语法基础及引用方法
6-2 JavaScript函数
单元检测
模块七 响应式页面设计
8-2 响应式页面设计
8-3 CSS中的em与rem
项目任务
项目任务和知识点分解
8-1 媒体查询
PhotoShop图像处理、程序设计等
参考教材:
1.Web前端开发技术-HTML、CSS、JavaScript(第二版),储久良编著 清华大学出版,2016.8
2.响应式Web开发项目教程(HTML5+CSS3+Bootstrap),黑马程序员,人民邮电出版社,2017.1
3.响应式Web设计 HTML5和CSS3实战 第2版,本·弗莱恩,人民邮电出版社,2017.1
4.HTML5+CSS3从入门到精通,李东博,清华大学出版社,2013.6
5.HTML5+CSS3网站设计基础教程,传智播客高教产品研发部,人民邮电出版社,2016.3
6.CSS 3实战,成林,机械工业出版社,2011.5
7.CSS高效开发实战—CSS 3、LESS、SASS、Bootstrap、Foundation,谢郁,电子工业出版社,2014.9