前沿视频教室————最好的CSS和Web设计与开发的视频教程

据我们的了解，目前大中专院校关于Web设计方面的课程，大致上还都是在以Dreawmeaver为线索的三剑客软件的介绍这个阶段。

实际上，无论是从技术发展的角度，还是以实际应用角度考虑，这都是有点滞后了。目前已经有一些对Web标准和CSS等新技术比较有兴趣的院校和老师，已经开始把目光移向了符合Web标准的教学内容。我觉得这无论是对教师，还是对于学生，都是是一件大大的好事。

前几天收到一位教师朋友的来信：

我们以前写过各种各样的内容的计算机图书，对于实用技术而言，如您所说的“案例教学”是一个非常好的方法，这是肯定的。但是对于编写教材，希望用“一个大案例”贯穿全书，是比较困难的。也可能有更好的处理方法。

关于基于Web标准的教学课程，我个人有以下几点考虑：

1：在CSS中，最重要的四大核心基础是： 盒子模型、标准流、浮动、定位，如果把这4个基础真正搞懂了，那么所有的案例实际上都是在在这4个基础之上的应用。而讲清这四个基础，最好是使用非常干净的，小巧但是非常能够体现原理本质的小案例来说明。实际制作的案例往往为了要出一些效果，加入很多非本质的东西，最好作为理解了基础以后的操作实践，否则我担心教学很容易陷入泥潭。我建议一定要先把这4个核心基础扎扎实实地讲清楚，否则想要做出一些效果会非常困难。

2：从写书的角度，我们会希望各个章节之间的独立性要强一些，而如果后面的章节都是依赖于前面的章节的案例，那么读者在学习的时候，会比较麻烦，他必须严格从前往后看，稍微跳一点，就很麻烦。 对于教学而言，同样，如果把案例限制的太死，对于教师使用也会带来麻烦，书上的案例最好还是作为启发性的，可能对于学生和教师，都更灵活一些。

3：相对于一个大案例贯穿的模式，我更倾向于这样一种模式：每节有几个小案例，每章有一、两个中案例，最后放几个大案例。在方便的情况下，后面的案例可以使用前面的案例作为“零件”。实际上，教学案例的设计，对于教学的效果，至少占70%的影响。

4：我不知道您现在手里有哪本书，如果有《CSS网页设计标准教程》或者《CSS网页设计彻底研究》的话，我觉得那个顺序是非常清晰合理的一个教学过程，您说的用一个大案例作为贯穿的想法，虽然教材不一定容易实现，但是在您的实际教学中是完全可以实现的，用的例子不一定是书上的，我们可以额外制作一些，这个其实非常简单。

5：上面一点中提到的两本书的教学顺序，比《精通CSS+DIV网页样式与布局》一书更合理一些，更注重对核心原理的分析和讲解。

6：我有时间以后，可以准备一些考虑比较全面的案例，作为教学用例，提供给大家，大家在教学时，如果觉得合适可以用在课堂上，或者留作作业。手头有几个经过时间考验的案例，就可以用好多届学生了，每年只要做一些改进即可。老师可能教学的负担现在都很重，我个人建议，对于每一门课，真正关键是搭建一套适合自己思路的教学计划和配合的案例，这件事一定要真正花大力气做一次，以后就好办了。

7：“CSS禅意花园” 这个网站的思路非常非常好，在世界范围内对于CSS的普及都有着巨大的影响，非常值得借鉴，我在视频教程里对此有详细的介绍，我觉得完全可以把它用在您的教学中，对您所说的“调动学生的学习热情”，绝对是可以大有帮助的。对于爱学习的学生，肯定会喜欢；而对于不爱学习，只是想糊弄的学生，你无论使用什么办法，他也不会感兴趣的，我觉得这类学生还是很多的，您只要对那些想学习的学生认真负责就可以了。 不知您是否看过 http://learning.artech.cn/category/css-research 这套视频教程，这是我自己简单制作的，里面有关于“CSS禅意花园”的介绍，供您参考。

8：此外，不知道您面对的学生大致是什么基础。CSS的教学比传统的Dreamweaver为主的方式，我估计难度还是大不少，需要真正理解CSS的核心思想才可以。Dreamwever和HTML基本上不存在逻辑问题，也不需要调试，而CSS虽然不是编程语言，但是还是多多少少有一些逻辑在里面，另外，调试也是很多非计算机专业学生难于理解和掌握的事情，而CSS要真正做好，需要一些简单的调试能力。

9：CSS是非常重要的技术，现在用的越来越普及，我觉得应用在教学中还是值得尝试的。

10：如果您是大专院校的相关课程的任课教师，可以到人民邮电出版社的教学资源服务网站，免费申请《CSS网页设计标准教程》和《网页制作综合技术教程》的样书，他们的工作人员会与您核实身份后给您免费邮寄这两本书。请注意要用真实身份申请，他们只能提供给大专院校的教师，需要验证申请者的真实性。

这篇文章发表于 2009年07月06日 星期一 9:54 am，并被分类于随心随笔。 您可以通过订阅 RSS 2.0 跟踪对这篇文章的评论。 您可以对这篇文章发表一条评论，或者在您自己的网站中引用 (Trackback) 它。