前言


网页设计与制作课程是计算机类及相关专业的重要专业基础课程，不论是计算机相关专业的学生，还是网站爱好者，都应该掌握一定的网页设计与制作技术和网站建设技术。本书遵循Web标准，采用HTML+CSS+JavaScript将网页内容与外观样式彻底分离并增加网页交互功能，从而减少页面代码行数，提高运行速度，便于分工设计与代码重用，让网页更加炫酷，这也是Web标准的最大特点。
为有效落实《国家职业教育改革实施方案》中的1+X证书制度试点，根据Web前端开发职业技能等级标准，针对“三教”改革的需要，以“一懂三会”为主线，对Web前端开发技能知识进行合理组织和编排，突出网页设计与制作的实用性，充分体现职业教育的理念，提高学生实践动手能力。“一懂三会”就是以懂的网页设计与制作基础为中心； 会使用Notepad++、HBuilder、Dreamweaver等工具设计和制作网页； 会设计和制作规范化的网页； 会简单开发中小型网站系统。HTML+HTML5部分以网页设计与制作必需的技术基础为重点，理论知识按照“必须、适度、够用”的原则进行系统性介绍，技能操作以任务案例的形式进行细化分解，逐步分析解决，突出实践技能操作； CSS是网页格式化的基石，注重网页设计与制作的高端和美化，强调实践操作和网页效果的和谐统一，通过案例任务积累网页制作经验。JavaScript+jQuery部分以JavaScript基本语法、jQuery基础和DOM对象为重点，实现页面交互，通过轮播图、标签操作等加强页面交互效果。本书编者站在初学者的角度，以任务实例和通俗易懂的语言详细介绍了网页制作的基础知识、HTML基础、HTML5新特性、CSS、JavaScript基础和jQuery基础，使用HBuilderX、Notepad++、Dreamweaver等工具设计和制作炫酷、交互式网页及综合案例。
本书重点突出网页设计与制作操作技能实用性，以任务实例为驱动，理论结合实际，使读者逐步提高设计与制作网页的职业能力，逐步获得设计与制作网页的方法与技巧。本书各单元内容以完成网页设计与制作任务为主线，以“项目导向、任务驱动、理论实践一体化”为主要教学方法与手段，融“教、学、练”于一体，在“学中做、做中学”中学习网页设计与制作的技能知识，体现职业教育理念及特色。本书的编写具有以下4个特点。
(1) 实用至上，体现工学结合的人才培养目标。理论知识以“必须、适度、够用”的职业教育理念为主导，以“典型任务案例巩固理论知识，淡化技术原理，强调实际应用”为原则，合理地编排教材内容结构，教材内容突出理论与实践的紧密结合，避免生硬的技术理论，突出实践技能操作。
(2) 以职业活动为导向，以解决实际工作中的问题为目标，以典型项目和真实任务为载体，设计教学单元与重构教学内容，强调学习任务与实际工作任务的一致性。
(3) 按照“案例宏观展示引入→学习任务→任务描述→同步练习→单元实践操作”进行单元知识体系设计，将知识内容以案例导入形式宏观展现在初学者的面前，以案例实现为单元主线，通过单元的学习，将案例分解细化，逐步解决； 最后通过“同步练习”和“单元实践操作”进行知识及操作的巩固与提高。
(4) 本书是开拓基础理论教学、应用案例教学和实践教学“三合一”模式的新教材，是一本集网页设计与制作的基础知识、应用案例和实践技能操作于一体的网页设计与制作实用教材，将“学中做”与“做中学”的思想贯穿于本书整个过程中，实现知识讲解和技能训练的有机结合。
本书由郑阳平、李晓辉担任主编，李广莉担任副主编，景妮担任主审，全书由郑阳平和李晓辉统稿。本书单元1由苏建华编写，单元2由郑阳平编写，单元3和单元4由李广莉编写，单元5和单元8由李晓辉编写，单元6和单元7由许莫编写。本书因篇幅所限，未列示“综合案例”的内容，读者可扫描本页二维码获取相关资料。资料中详细讲述了某学校门户网站首页设计与制作的过程，给出了相关参考代码，并介绍了课程设计的相关内容。
本书在编写过程中得到了学校领导和同事们的大力支持与帮助，并提出了许多宝贵的建议和意见，也借鉴了大批优秀教材和有关资料，吸取了许多专家和同仁的宝贵经验，在此向他们深表谢意。
由于编者水平有限，书中难免会存在一些不足与缺陷，敬请广大读者、同行专家和教师提出宝贵意见，以便再版时加以改进。
编者2021年7月



综合案例