Web前端开发（HTML5+CSS3+JavaScript） 教学大纲

XXX学院《Web前端基础技术》课程教学大纲一、课程基本信息课程名称Web前端基础技术WebFront-EndBasicTechnology课程代码适用专业/开课学期软件工程/第学期学分/学时学分/48学时学时分配48理论学时32实验（实践）学时16实训（含上机）/实习/其他/课程类别大类通识课程专业教育课程实践教育课程公共基础课大类平台课通识通选课专业基础课专业主干课专业拓展课实验课集中实践课√课程性质必修()选修()考核方式考试()考查()开课院（部）信通学院课程负责人课程团队授课语言中文对先修的要求《程序设计基础》对后续的支撑《Web前端框架技术》大纲撰写与审定撰写人审核人审定人修订时间课程简介及课程目标本课程是一门软件工程专业的专业必修课，具有较强的实践性。通过本课程的学习，使学生系统性掌握HTML、CSS和JavaScript等前端开发的相关知识，并最终可以开发出具有良好交互性的前端页面；同时在本阶段培养学生具备独立的Web开发能力，掌握Web开发的基本流程和方法，熟悉标记语言、样式语言以及脚本语言的基本语法、语句，建立面向对象思维方式和方法，熟练使用软件开发工具，高效完成定制任务。Thiscourseisaprofessionalessentialcourseforsoftwareengineeringmajors,whichisstrong.Throughthestudyofthiscourse,studentscansystematicallygrasptherelevantknowledgeoffront-enddevelopmentofHTML,CSS,andJavaScript,andfinallydevelopthefront-endpageswithgoodinteraction;Thebasicprocessesandmethodsofwebdevelopmentarefamiliarwiththebasicgrammarandsentencesoflabellanguage,stylelanguage,andscriptlanguage,establishobject-orientedthinkingmethodsandmethods,proficientinsoftwaredevelopmenttools,andefficientlycompletecustomizedtasks.课程目标：1.了解Web前端开发的基本概念和开发流程，掌握Web前端开发的核心内容，包括HTML、CSS和JavaScript，能按照需求完成开发任务。2.具备综合运用Web前端核心技术能力，能使用前端技术用于解决实际项目开发问题。三、课程目标及对毕业要求观测点的支撑序号毕业要求支撑毕业要求观测点课程目标11.掌握软件生命周期中涉及的工程基础和专业知识，以及相关的数学、自然科学知识，并能够将其应用到软件实践中，解决复杂软件工程问题。2.问题分析：能应用数学、自然科学和与软件工程相关的基本原理，识别、表达、并通过文献研究和借助仿真软件等手段，分析软件系统及其相关领域的复杂工程问题，进行识别、表达和分析，以获取有效结论。5.能够针对软件工程及其相关领域的复杂工程问题，开发、选择与使用恰当的技术、资源、现代工程工具和信息技术工具，包括对复杂工程问题的预测与模拟，并能够理解其局限性。观测点1.2了解软件工程专业知识、方法和技术在该领域的应用背景、发展现状和趋势；能选择恰当的模型用于表述复杂软件工程问题；且能将其应用于复杂软件工程问题的建模和求解。观测点2.3能够针对具体的软件工程领域复杂工程的多种可选方案，运用基本原理，借助文献研究，分析过程的影响因素，并获得有效结论。观测点5.3能够针对具体的对象，开发或选用满足特定需求的现代工具，模拟和预测专业问题，并能够分析其局限性。目标123.设计/开发解决方案：能够针对软件工程及其相关领域复杂工程问题设计提出设计方法或解决方案，并针对特定系统需求设计满足用户需求的解决方案，包括软硬件功能设计、系统架构设计、组件设计和数据库设计等，并能够在设计环节中体现创新意识，考虑社会、健康、安全、法律、文化以及环境等因素。4.研究：能够基于软件工程的基本原理并采用科学方法对复杂工程问题进行研究，包括搜集与整理资料、系统设计、设计实验、分析与解释数据、并通过信息综合得到合理有效的结论。观测点3.1掌握软件工程设计和产品开发全周期、全流程的基本设计/开发方法和技术，了解影响设计目标和技术方案的各种因素；掌握软件需求分析、设计、实现、测试、维护以及过程与管理的方法和技术。观测点4.1能够基于科学原理，通过文献研究或相关方法，调研和分析复杂软件工程问题的解决方案。目标2

四、教学内容及进度安排序号教学内容（包含重点、难点和思政点）课程目标达成途径（应写清楚运用何种教学模式实现）课内学时支撑课程目标理论实践1内容：Web开发前端综述与HTML基础了解相关的Web前端开发技术；Web页面执行流程；开发工具介绍；第1个HTML文档；文档结构分析；文档编写规范重点：HTML文档结构难点：理解Web执行流程思政点：分析Web开发的技术栈，明确学习目标和职业规划。通过课堂讲授，使学生：1）了解Web前端开发技术2）静态和动态页面执行流程3）熟悉HTML基本语法，创建HTML页面20目标12内容：HTML基础格式化文本标记；段落与排版标记；分行、水平线标记；超链接和图像；列表和表格、表单重点：HTML标记的含义和使用。难点：使用HTML实现排版思政点：以“J20”研发为例，引出对技术基础积累的重要性。通过课堂讲授，使学生：1）掌握字体标记和属性2）掌握段落标记和属性3）区分段落和换行4）超链接与图片使用5）掌握列表布局、表格定位与表单元素作用通过作业练习，使学生：创建HTML文档及实现基本排版样式；掌握创建使用列表和表单实现排版的页面；掌握表单制作，熟悉各类表单元素的标记84目标13内容：CSS基础CSS选择器；CSS语法；盒子模型；div和span标记；CSS样式属性；单位、字体、颜色和列表样式重点：选择器；格式化文本样式难点：盒子模型思政点：以HTML不足而引入CSS为例，培养创新精神。通过课堂讲授，使学生：1）掌握5种选择器的使用2）使用CSS进行格式化对象通过作业练习，使学生：创建基于CSS排版的的HTML页面42目标14内容：CSS布局与CSS3页面布局的方法；导航列表菜单设计；CSS3新特性。重点：页面布局；导航列表菜单设计；转换和过渡；难点：页面布局；导航列表菜单设计思政点：以CSS炫酷网站为例，弘扬“大国工匠“精神。通过课堂讲授，使学生：1）掌握三列横线和纵向布局的设计方法2）掌握水平和垂直导航列表菜单的设计方法通过作业练习，使学生：创建基于CSS的页面布局的页面，并能添加导航菜单84目标15内容：JavaScript基础JavaScript基础语法；变量、表达式、函数、程序结构重点：基本语法难点：函数定义与使用思政点：以语法规则为例，做个遵纪守法的好公民。课堂讲授，使学生：掌握JavaScript基础语法通过作业练习，使学生：使用JavaScript基础语法解决一般数学问题22目标16内容：JavaScript应用事件分类、响应与处理；HTML元素查询、添加、移除、修改；动态改变样式重点：事件响应编程难点：事件响应编程思政点：以华为5G技术为例，引出“掌握核心技术，掌控未来“的理念。通过课堂讲授，使学生：1）掌握常用事件的捕获与响应2）掌握查询元素的各种方法3）熟悉元素的编辑操作及动态样式的实现通过作业练习，使学生：结合CSS，能够制作包含轮播图、进度条的HTML页面42目标17内容：JavaScript综合运用DOM与BOM；数据存储WebStorage的使用；购物车实现。重点：基于DOM节点的操作难点：数据储存和获取思政点：三者融合，弘扬协作精神。通过课堂讲授，使学生：1）理解DOM和BOM概念2）掌握基于DOM操作的方法3）页面数据传递的方法42目标1，目标2

课程考核及评价序号课程目标考核内容评价方式及成绩比例(%)成绩比例(%)平时成绩（体现过程性考核）30%-60%期末考核平时考勤课堂实验课堂互动...1了解Web前端开发的基本概念和开发流程，掌握Web前端开发的核心内容，包括HTML、CSS和JavaScript，能按照需求完成开发任务。（支撑毕业要求观测点1.2；2.3；5.3）掌握HTML基本标记使用，包括文字、段落格式化、图片、表格和表单等元素；掌握使用CSS进行文本、段落格式设置、界面布局；掌握使用JavaScript基本语法、元素查询和属性设置并能设计出具有简单交互页面的页面。316160802具备综合运用Web前端核心技术能力，能使用前端技术用于解决实际项目开发问题。（支撑毕业要求观测点3.1；4.1）能综合运用前端技术解决实际项目开发问题。3611020比例3070100课程目标达成度计算方法：1.课程分目标达成度=课程分目标下各评价方式：“学生实际平均成绩*权重之和”/“分目标分值*权重之和”。2.整体课程目标达成度：各课程分目标达成度的最小值。六、教材及参考资料1.教材《Web前端开发基础（HTML+CSS+JavaScript）》鲍小忠著中国铁道出版社2021.062.主要参考书《Web前端开发技术-HTML5、CSS3、JavaScript(第3版)》储久良编著清华大学出版社2018.7七、课程考核评分标准课程目标平时考勤评分标准权重（%）90-10080-8970-7960-690-59优秀良好中等及格不及格目标1课堂考勤：全勤，不迟到，不早退。课堂考勤：正常全勤，1次请假，无早退或迟到。课堂考勤：正常全勤，1次请假或有早退或迟到现象。课堂考勤：多次请假、早退或迟到现象。课堂缺勤超过3次，或多次有早退或迟到现象。3目标2课堂考勤：全勤，不迟到，不早退。课堂考勤：正常全勤，1次请假，无早退或迟到。课堂考勤：正常全勤，1次请假或有早退或迟到现象。课堂考勤：多次请假、早退或迟到现象。课堂缺勤超过3次，或多次早退或迟到现象。3课程目标实验报告评分标准权重（%）90-10080-8970-7960-690-59优秀良好中等及格不及格目标1课程实验能在规定时间完成，实验结果完全满足要求；无抄袭；实验报告撰写认真、格式良好。课程实验能在规定时间完成，结果很好满足要求；无抄袭；提交报告格式较好。课程实验能在规定时间完成，结果较好满足要求；提交报告格式较好。课程实验不能在规定时间完成，质量一般。不提交实验报告或抄袭他人实验报告。16目标2课程实验能在规定时间完成，实验结果完全满足要求；无抄袭；实验报告撰写认真、格式良好。课程实验能在规定时间完成，结果很好满足要求；无抄袭；提交报告格式较好。课程实验能在规定时间完成，结果较好满足要求；提交报告格式较好。课程实验不能在规定时间完成，或质量一般。不提交实验报告或抄袭他人实验报告。6

课程目标课堂互动评分标准权重（%）90-10080-8970-7960-690-59优秀良好中等及格不及格目标1非常积极参与课堂互动、并能准确回答老师在课堂提出的问题。能积极参与课堂互动；较为准确回到老师在课堂提出的问题。不怎么参与课堂互动，但回答问题正确。不参与课堂互动，回答问题需要提示才能勉强完成。不参与课堂互动，不能正确回答课堂提问。1目标2非常积极参与课堂互动、并能准确回答老师在课堂提出的问题。能积极参与课堂互动；较为准确回到老师在课堂提出的问题。不怎么参与课堂互动，但回答正确。不参与课堂互动，回答问题需要提示才能勉强完成。不参与课堂互动，不能正确回答。1课程目标期末考核评分标准权重（%）90-10080-8970-7960-690-59优秀良好中等及格不及格目标1对Web前端开发的相关概念清楚；熟悉开发工具使用和代码调试技巧；完全掌握Web前端开发基础的核心内容。对Web前端开发的相关概念清楚；熟悉开发工具使用和代码调试技能；很好掌握Web前端开发的核心内容。对Web前端开发的相关概念基本清楚；对开发工具的使用和代码调试有一定的掌握；对Web前端开发的核心内容掌握程度一般。对Web前端开发的相关概念基本清楚；不能很好的掌握Web前端开发的核心内容。对Web前端开发的相关概念不清楚；没有掌握Web前端开发的核心