《Web前端基础》课程标准

《Web前端基础》课程标准课程代码： 课程名称：Web前端基础适用专业：大数据技术 总学时：48 学分：31．课程定位和设计思路1-1课程定位《Web前端基础》是面向计算机相关专业的一门专业基础课，涉及网页基础、HTML标记、CSS样式、网页布局、HTML5和CSS3新技术内容，通过本课程的学习，学生能够了解网页Web发展历史及其未来方向，熟悉网页设计流程、掌握网络中常见的网页布局效果及变形和动画效果，学会静态网页的制作方法，为前端技术的基础课程，同时为后端编程类课程了解页面内容如何在浏览器中呈现打下基础。1-2设计思路《Web前端基础》这门课程共48学时，3学分。主要以HTML5语言为主，利用CSS3为静态页面制作样式，学习新的HTML5+CSS3技术进一步更好的呈现静态网页。使用软件由Dreamweaver网页编辑器软件。课堂上以实际案例为主，在案例选择选用一些积极向上的素材或结合学校开展的各项活动为主题来制作网页，树立学生正确价值观。第一阶段学习HTML语言，能掌握常用HTML标记符；第二阶段学习CSS技术，能为静态页面添加样式效果；第三阶段学习DIV+CSS布局，综合运用HTML和CSS布局静态网页；第四阶段项目实战综合应用，能够完成项目文档、静态页面制作、项目展示整个静态网页开发过程。在整个教学过程中培养学生关心身边事，从资料收集整理到制作、从独立完成到团队协作、从埋头苦做到上台演示，提高学生的综合素质。1-3课程思政教育从课程教学内容设计上结合计算机学科、专业和本课程的特色，让学生去探究本专业的沿革、现状与前沿，引导学生不断提升专业素养，积极寻找实现个人价值，激发学生的求知欲，教育学生扎实掌握专业知识。增强学生综合素养的培养，一方面在课堂传授专业知识，让学生掌握静态网页的制作的知识与技能；另一方面也要培养学生的解决问题、分析问题、整理问题的能力。把知识传授与解决问题、书本知识与实践问题结合起来，让学生既有理论知识、又有动手能力、还具备网站开发人员的综合素养。学生通过配套理论题测试检测学生对网页知识相关内容的掌握，通过阶段测评检测学生对网页制作技术的掌握，通过项目实战检测学生的综合素养的能力。2．工作任务和课程目标2-1工作任务学习HTM5L文档、结构、语法，HTML5标记与属性，能够使用HTML制作静态网页；学习CSS核心基础，文本样式属性、CSS高级特性，能够使用CSS设计页面样式；学习表单、表格、多媒体技术；能够在静态网页中插入表单信息、表格和多媒体元素。硬件条件：多媒体机房、投影软件条件：64位操作系统、PhotoshopCC、DreamweaverCC、录屏软件、多种主流浏览器2-2课程目标围绕WEB前端开发技术技能人才的需求，培养具有良好职业道德和人文素养，课程重点讲述了使用HTML5、CSS3及其他前端技术进行网页制作的技巧。通过本课程的学习，学生能够熟悉网页设计流程、掌握网络中常见的网页布局效果，掌握一定的Web前端开发知识，具备静态网页设计、开发、调试、维护等能力，培养学生正确的思想道德、价值取向和社会责任，为后续深入学习夯实基础。职业能力目标能使用HTML制作静态网页能使用CSS设计页面样式能使用HTML5新标签美化页面能使用CSS3新特性开发页面样式素质养成目标培养学生在学习过程中发现问题、分析问题、解决问题的能力培养学生在网页开发过程中以用户为中心，强调用户体验贯彻始终培养学生对网页素材收集、内容整合、网页制作、文档撰写、项目演示的能力培养学生在项目开发过程中的集体主义观念、团队协作精神课程思政教育目标树立学生正确的思想道德、价值取向、社会责任培养学生遵纪守法、培养良好的时间观念并且诚实守信提高学生自身的文化修养的同时，提高对自己专业、学校和祖国的热爱3．课程内容和要求根据专业课程目标和涵盖的工作任务要求，确定课程内容和要求，说明学生应获得的知识、技能与态度。典型工作任务指经过筛选后需要纳入课程内容的工作任务。注意典型工作任务要与企业专家分析的工作任务相对接。知识内容、技能内容、素质内容、思政育人内容的分析要准确，并充分体现高职特色。表式：课程内容和要求序号典型工作任务知识内容及要求技能内容及要求素质内容及要求思政育人内容及要求学时分配11．HTML了解网页概念和组成。熟练掌握HTML文档、结构、语法掌握并应用HTML5文本标签、图像标签、列表标签、超链接标签熟悉Dreamweaver工具的基本操作新建站点、新建HTML5网页文件能熟练使用HTML文本标签、图像标签、列表标签、超链接标签制作静态页面认真仔细，代码编写正确规范对页面中各个元素合理使用HTML5标签培养文档整理能力深入了解HTML5的发展过程，将来的发展趋势培养学生自学能力抓紧学生考勤、课堂纪律、课后作业提交的时间观念921．CSS掌握CSS样式规则掌握CSS的文本样式、选择器、CSS伪类熟练掌握CSS中的盒子模型原理，浮动和定位关系新建CSS文件能熟练使用CSS设计网页样式能够熟练使用CSS美化网页样式使用DIV+CSS的布局方式，对网页内容合理布局能够书写规范的CSS样式代码能够合理使用CSS选择器美化页面，同时优化CSS文档站在用户角度设计美化页面文档处理从用户角度，提升学生对页面对美感培养学生大胆创新，反复实践的工匠精神抓紧学生考勤、课堂纪律、课后作业提交的时间观念1531．插入表格表单多媒体熟练掌握表格标记熟练掌握表单相关标记熟练掌握HTML5中有关多媒体的标记能够制作表格并添加合适的表格样式能够制作静态页面表单并添加合适的样式效果为静态页添加多媒体能制作符合规范和良好用户体验的表格掌握在web前端对表单的检测应用培养学生注重用户体验培养学生的审美能力抓紧学生考勤、课堂纪律、课后作业提交的时间观念64综合项目实训综合项目实战撰写网站整体规划网站效果图制作网站首页制作网站列表页制作网站详情页制作项目报告撰写项目演示熟悉整个网站制作项目流程撰写文档能力演示项目时的讲解能力培养学生团队协作能力文档撰写与整理的能力培养学生演示项目的演讲能力65阶段测试阶段测试HTML5语言部分CSS3基础部分DIV+CSS布局综合应用大作业根据要求将自己所学知识灵活应用培养学生的学习能力培养学生独立解决问题能力培养学生团队协作能力124．实施建议4-1教材选用《HTML5+CSS3网页设计与制作》，人民邮电出版社，黑马程序员编著，2020年04月出版，2021年6月山东第9次印刷工业和信息化“十三五”人才培养规划教材ISBN978-7-115-52324-24-2教学建议教学建议：通过“动手”、“动脑”、“动口”、“动笔”的教学设计，将项目拆解为小的相关案例，并结合知识点的递进，由小到大、由简入繁，让学生“做中学、学中做”，并全程注重培养学生的职业素养、职业技能和获取知识的能力。硬件条件：多媒体机房、投影、网络软件条件：64位操作系统、PhotoshopCC、DreamweaverCC、录屏软件、多种主流浏览器、office软件4-3教学评价考核分项考核内容分值比例分值比例课堂活动出勤情