Web前端开发案例教程（HTML5+CSS3+JavaScript）_[中国]杨蓓;李林_9787113275549

书面向 Web 前端开发的实际应用，以案例为驱动，呈现了新颖的教学内容组织结构，HTML 和CSS 紧密耦合的巧妙分解、案例和内容的艺术性结合，使学生更易于理解和掌握学习内容，快速达到学习目标。本书全面系统地讲解了 Web 前端开发的核心内容 HTML、CSS 和 JavaScript，包括 Web 前端设计概述、单列图文网页设计、层叠样式表 CSS、网页的布局设计、JavaScript 语言基础、BOM 与 DOM、HTML 5 进阶、应用 CSS3 渲染效果，共 8 章内容。本书适合作为应用型高校和普通高校计算机类本科专业的教材，也可供 Web 前端开发职业培训使用，亦适合 Web 前端开发爱好者自学使用。

近年来，随着物联网、云计算、大数据和人工智能等新技术的崛起，互联网发生了深刻的变化，各行各业对互联网的依赖程度越来越高，Web应用与Web服务越来越广泛，Web前端开发的需求日益增多，用户体验的要求不断提高。Web前端技术经历了从HTML 4到HTML 5、从CSS 2到CSS 3的重大变化，CSS 3和HTML 5增加了许多新特性，新的框架技术不断涌现出来，Web前端开发这门课程承载的内容越来越丰富，承担的任务越来越重。因此，如何高效地教好、学好这门课程成为一个十分紧迫的重要问题。其次，近些年来我国为提高本科教育的人才培养质量，教育部推出了一系列举措，例如国家精品课程建设、具有高阶性创新性和挑战度的金课建设、一流专业建设、一流课程建设等，极大地推动了教材的质量建设。后，Web前端开发是计算机类各专业都要开设的课程，是一些专业课程的重要基础。因此，鉴于上述原因，编写一本具有先进教学理念、切合应用型高校本科教学和Web前端开发实际的高质量教材，具有十分重要的意义。
本书主要涉及HTML、CSS和JavaScript三个基本、核心的内容，为进一步学习Web前端开发技术的高级内容打下基础。
本书编写的思路和特色如下：
（1）新颖的教材内容组织结构
在传统教材中，HTML和CSS是按先后顺序分开讲述的，其结果是在讲HTML内容时，没有CSS的支撑，所列举的案例平淡无奇，仅仅是为举例而举例，吸引不了学生，学生印象不深刻，学习效果不好；在讲CSS内容时，没有复杂的HTML结构，所列举的案例反映不出CSS的复杂规律，学习效果亦不好。终HTML和CSS的内容需要花费很多时间才能真正掌握。在Web标准中，HTML和CSS代码是分离的，但并不意味着两者在渲染表现时也是分离的。因此，在本书的第1章中，诗歌网页设计案例一步到位，应用小结构原理直接表达出具有紧密耦合关系的HTML和CSS整体结构，提高了学生的认知水平（难度）和认知完整性。在随后的章节内容中，化整为零、变奏式地重复，不断扩展HTML和CSS的内容，当正式讲解CSS章节时，学生已对CSS内容很熟悉了，水到渠成，因而对CSS复杂规律的理解问题自然迎刃而解了。
本书面向Web前端开发的实际情况，将Web网页划分为单列布局网页（简单）、多列布局网页（比较复杂）和平面布局网页（复杂）三种类型，同时又将单列布局网页划分为文本网页、图册网页、图文网页和表单网页四类，从案例设计需求来选用HTML标签，这样，四类单列布局的网页案例基本上覆盖了常用的标签，实现案例和HTML标签巧妙的艺术性结合。有了单列布局网页的基础，后两种类型网页学起来就更快了。
此外，本书对内容进行重新组织，并没有将HTML 5、CSS 3和旧的HTML、CSS分开讲述，而是按照Web前端开发的实际需求进行取舍，体现了面向应用、面向实践的设计思想。
（2）作品级教学案例
本书在大多数章节开始都布置有一个作品级的完整教学案例，增强了教材的实用性和趣味性。完整的、实用的教学案例具有强烈的驱动力，使得学生跃跃欲试，在学习完随后的相关知识后，通过实验完成类似教学案例的网页设计，成就感会跃然面上，课程学习兴趣会越发浓厚。作品级教学案例达到了以优秀的作品鼓舞人的目的。
（3）模式化布局方法
本书在网页布局设计这一章节中，为突出整体布局的清晰性和正确性，对网页效果图中的各个板块，按照合适大小粒度进行切图处理，将每一个切图图片作为一个div框进行整体布局设计，测试正确后再进行div框的详细代码设计。这种模式化设计方法保证了作品级案例的完美渲染效果，同时也避免了引入大量代码后看不清div框相互之间结构的困境。
（4）严谨的编写体例
本书为保证正文内容的完整性和逻辑性，配有延伸阅读、讨论和小提示几个部分。延伸阅读从多视角对正文内容进行补充描述，加深学生的理解，同时解决了内容之间的紧密衔接问题。在正文描述过程中，以问题为导向，自然地提出一些开放性的讨论题，培养学生独立的创新思维能力。小提示的编程经验、注意事项，更能提高学习效果。此外，采用精美排版，将案例代码与其行号分隔，不会被误解。
（5）鲜明的思政特色
本书选用中国古代诗词等素材作为案例，弘扬中国优秀的传统文化和爱国主义情怀，弘扬优秀的社会、企业和校园文化精神。此外，通过网站设计训练，培养学生善于沟通、合作共事的团队精神。
本书由武昌理工学院数据科学与大数据技术、计算机科学与技术、软件工程和智能科学与技术的专业教师，以及上海睿亚训软件技术服务有限公司的资深教师共同编写，这些教师教学理论水平好、教学经验和项目开发经验丰富，指导过学生获得多项全国性竞赛的特等奖和一等奖。本书由杨蓓、李林老师统编全稿。具体的章节编写情况如下：
章??节章?节?名?称编?写?者
第1章 Web前端设计概述李林、曾辉
第2章单列图文网页设计杨蓓
第3章层叠样式表CSS 李林、杨蓓
第4章网页的布局设计杨蓓
第5章 JavaScript语言基础钱程
第6章 BOM与DOM 孙鸣雷
第7章 HTML 5进阶阳小兰
第8章应用CSS 3渲染效果阳小兰、李林

本书适合作为应用型高校和普通高校计算机类专业的教材，也可供Web前端开发职业培训使用，具体教学建议如下：
总学时理论学时实验学时教学方式
32 0 32 线下线上
32 16 16 线下线上
48 16 32 线下、线下线上
48 24 24 线下、线下线上
64 32 32 线下

本书是全国高等院校计算机基础教育研究会2020年度基于HTML 5 CSS 3 JavaScript的Web前端开发技术的教学研究项目（项目批准号：2020-AFCEC-472）的成果，同时还得到了教育部高等教育司2020年产学合作协同育人项目（基于工程教育认证的Web前端设计课程建设，项目编号：202002240012，上海睿亚训软件技术服务有限公司）的大力资助。
本书提供全部的案例和例题代码、课程大纲、教学课件PPT等资源。
由于编者水平和能力有限，书中难免有疏漏和不足之处。恳请各位同仁和广大读者，给予批评指正。

编者
2021年4月

你还可能感兴趣

我要评论