Opera中国的WEB标准课程

在这篇文章里，我要向大家介绍我和其他很多人花费数月时间开发的一个课程——Web标准课程，该课程旨在向大家提供Web设计和开发的坚实基础，无论读者是谁，此教程完全免费、可访问，并且不需要预备知识。当然，我主要还是希望在大学里推广本课程，因为我发现很多大学都缺
序言
长久以来，我一直有一个梦想。在过去的8、9年间，我主要从事教育工作，包括委托和编辑技术书籍，来帮助人们使用技术建立酷炫的东西，为我所工作过的多家公司培训新员工，以及编辑和撰写指南性的文章，帮助人们使用Opera的软件。我也很着迷于Web，并且是开放的Web标准的坚定信徒。我希望通过我所从事的教育和培训工作，教会人们如何合作，如何相互尊重，教会他们如何制作可跨平台、跨浏览器、跨设备访问的Web站点（甚至残疾人也能无障碍地访问），为改造Web世界尽我的一点绵薄之力。要实现这个目标，Web标准是关键 。因此我决定将我的时间和精力集中用于推广Web标准的应用，这是我长久以来一直有的想法，但终于在Opera公司里实现了，为此我要感谢我的上司聘用我专职从事这项工作，我的一个梦想终于成为了现实。
在这篇文章里，我要向大家介绍我和其他很多人花费数月时间开发的一个课程——Web标准课程，该课程旨在向大家提供Web设计和开发的坚实基础，无论读者是谁，此教程完全免费、可访问，并且不需要预备知识。当然，我主要还是希望在大学里推广本课程，因为我发现很多大学都缺乏好的关于Web标准的课程。我听说很多大学生不愿意花时间去学习关于Web标准的课程，因为评分办法已很过时了。我还听说一些公司在面试申请Web相关职位的大学毕业生时，发现这些大学毕业生根本不了解实际的Web开发是如何进行的，而感到非常失望。而如果你以一种理性的风格，在一所先进的大学里教Web标准的话，那我要向你致敬，请与我联系！
这篇文章的主要内容包括： 为什么要使用Web标准？在这一部分，我要简单论述使用Web标准的优点，为什么很多时候Web标准未得到采用，以及如何通过学习我们的课程来解决这些问题。 本课程的组织结构。这一部分概述课程内容的结构，并讨论授课老师如何有效地使用和讲述课程材料。 本课程的适用人群。当我说“任何人”都可以学习本课程时，这里的“任何人”其确切意义是什么？ 课程的目录。如果你想直接就开始学习的话，可以跳过这部分。 致谢 与我联系
为什么要使用Web标准？
为什么你一定要在进行Web设计和开发时使用Web标准，这将在第4篇文章中详细阐述。但我在这儿先大概讲一下，让大家有个基本的了解。使用Web标准，有以下优点：

1. 提高代码的利用效率：当你学习完本课程后，你会发现Web标准使用的最佳习惯主要是关于代码重用的。通过重用代码，你可以将HTML内容和样式信息（CSS）及行为信息（JavaScript）相分离，减小网页体积，而且只需要写一次代码，以后在需要的地方再重用即可。 易于维护：这一点与上面所说的最后一点密切相关。如果你可以只写一次HTML代码，然后在需要应用样式和行为的地方，使用类和函数。而以后，在你需要做出改动的时候，你可以只在一个地方修改，然后此修改就会自动应用到整个Web站点，而不再需要一处一处地修改。 提高可访问性：以下的两点密切相关。Web上的一个大问题就是，让Web站点可以被每个人访问，而不论他们身处何种环境。这包括要能让残疾人，包括盲人、视觉受损的人、和运动功能有障碍的人（如运动受限制，不能自如地用双手或根本不能用双手的人）等）也能访问网站。通过使用Web标准和最佳的习惯，你可以使你的Web站点能被尽可能多的人访问。 设备兼容性：此处的兼容性，指的是不仅要确保你的Web站点可以跨平台（如Windows、Mac、Linux），而且要能在其它的浏览设备上工作，比如现在用的手机、电视、游戏控制台等。这些装置在屏幕大小、处理能力、控制机制等方面都有一些局限性。不过你放心，通过使用Web标准和最佳的习惯，可以让你的Web站点能在绝大多数装置上显示。要知道全球手机的数量多于个人电脑的数量，而且很多手机都是可以上网的，你或你的客户怎能不去占领这个大市场呢。要想了解更多有关移动Web开发的信息，请访问 dev.opera.com 。 网络爬虫/搜索引擎：在这里，我指的是所谓的“搜索引擎优化”，即让你的Web站点能尽可能多地被网络爬虫爬到，并且被索引，从而提高你的Web站点在 Google 等搜索引擎上的排名。这是一项专门的学问（参考关于搜索引擎优化的文章，如《更适用于搜索引擎优化的智能站点结构》、《HTML语义和搜索引擎优化》等）。同样地，通过使用Web标准，你就可以让你的站点在Google、Yahoo! 等搜索引擎上尽量靠前地显示，这必将大大地促进你的业务。

尽管使用Web标准有以上诸多优点，但多数Web站点至今还尚未遵循Web标准，而且时至今日很多Web开发人员都还在使用过时的、不好的习惯。你会问“为什么会出现这种情况呢？”。原因当然有很多，这包括缺乏教育和培训、公司政策、不用学习标准也能领到薪水、学习太难、浏览器所支持的标准等。以下我将逐一详细分析这些原因，并批驳那些不采用或学习Web标准的借口。

1. 缺乏培训：这确实是一个问题，这也是我们开发本课程的主要原因之一。很多大学在它们的Web相关课程中都不教授Web标准，而且很多课程讲述的内容也已经过时，这种情况还很难改变。培训课程和书籍确实也花费昂贵，但现在我们已开发出这个免费的课程，并在大学里推广。“缺乏教育和培训”再也不成其为不学习Web标准的借口了。 公司政策：无可否认，至今一些公司/机构依然维持其老式过时的Web站点，也许还制定有政策强迫其员工使用过时的浏览器。但现在有了我们这个免费提供的课程，情况应该能得到改观了。将Web站点进行升级，以达到当前的标准，这将促进公司升级它们所使用的浏览器，这是因为用过时的浏览器浏览升级后的Web站点效果不佳（尽管还是可以浏览）。公司还应该鼓励它们的客户也升级浏览器。这样做是有充分理有的，如上所述，使用了Web标准的站点，将有更靠前的搜索引擎排名，并能为更多的人，包括残疾人和使用电脑以外装置上网的人所访问，公司怎能忽视这么大的一个潜在客户群呢？ “我不需要学习Web标准”：我知道一些Web开发人员会这样说：“我是在使用过时的方法开发Web站点，但我照样领到工资，那我为什么还要去费时费力地学习这个新东西呢？”我在以上部分已经讲过，使用Web标准可以提高代码的效率，使得写代码变得更为容易，并使Web站点更易于维护。此外，还可以使你能写出可以在电脑以外的设备上显示的代码，这不很好吗？学习Web标准，可以提升你的专业技能，并使你能挣到更多的钱。目前很多公司都需要懂Web标准的专业人员。 “它太难学了”：废话。在学习完本课程后，不论你是Web开发/设计方面的新手，还是需要进修的Web从业人员，都会发现要掌握使用Web标准的基本知识，其实是非常容易的。学习使用Web标准并不比使用老式过时的Web开发/设计方法更难，而且还能带来那么多益处。 浏览器所支持的标准：过去有很多不同的浏览器支持标准，这使得让Web站点在不同的浏览器下都能正常显示，变成了一场恶梦。但那已是过去的事了，当今的浏览器都支持应有的Web标准。一些老式浏览器有时仍需要特别的支持标准，但通过使用当今最好的习惯，你可以确保那些老式浏览器的用户仍然可以获得不错的用户体验。

因此像你们已经了解到的一样，真没有任何借口在从事Web开发工作时不采用Web标准。从一个初学者的观点来看，学习本课程至少可以让你一开始就学习最好的习惯，而不需要还要费力地去抛弃那些过去不好的习惯。

我们一直以不屑的口吻谈论那些过去不好的习惯，仿佛它们已是毫无用处的老古董了。的确，在本课程中我们不会教授这些不好的习惯，因为我们认为没这个必要。我们认为学员一开始就应选择正确的出发点。也许你们想知道这些过去不好的习惯究竟是怎么样的，下面我就简要介绍一下。
在过去，人们在制作Web站点时，习惯于这样做：把整个页面通过一些巨大的表格进行布局，使用不同的表格单元格来定位图像、文本等（不是真正的表格，而是向页面添加冗余的标记）。他们习惯于使用不可见的空白GIF来调整页面元素的定位（不是真正的GIF图像，而是向页面添加冗余的标记）。他们习惯于用JavaScript来生成那些飞舞的菜单（这对于那些已经在浏览器中禁用JavaScript的人来说，一点好处也没有，而对那些因视觉障碍而使用屏幕阅读器的人来说，也会被这些JavaScript搞晕）。或者，写一些仅能运行在一种浏览器上的JavaScript（但对于那些使用其他浏览器的人，该怎么办呢？）。他们习惯于在HTML的<font>元素中，直接插.入样式信息（但这将增加维护的难度，并且会使页面中凭添多余的标记）。此外还有很多不好的习惯，最糟糕的是，虽然我上面说的是“过去的作法”，但现在有很多人还像以前一样做。
Web开发本身就是一件杂乱无章的工作，而如果再没有好的开发习惯，它就难上加难了。本课程所描述的Web标准和最佳习惯，将是你从事Web开发的最佳途径。
#p#
在这篇文章里，我要向大家介绍我和其他很多人花费数月时间开发的一个课程——Web标准课程，该课程旨在向大家提供Web设计和开发的坚实基础，无论读者是谁，此教程完全免费、可访问，并且不需要预备知识。当然，我主要还是希望在大学里推广本课程，因为我发现很多大学都缺
课程结构
本课程由很多文章构成。在基础课程完成时，将有50多篇文章，每篇文章的长度都为几千个单词。每篇文章的内容都集中在一个具体的主题上，一般将包括以下内容：该主题的背景知识、基本理论、实际例子、漫游教程，以及练习题。
此外，我们在未来还将推出全套教程，内容将覆盖构建Web站点的全过程。
教授本课程适当的方式为：先确定你有多少堂课可以用于将本课程教完，然后除以文章的数量。在每堂课开始前，要求学员先通读与该堂课相对应的文章，然后在课堂上讨论实际的例子，并要求学员在课后做练习题。我认为只要让学员在课前通读了文章，讲述每篇文章所包含的基本理念只需要1个小时就足够了。大致说来，本课程需要50小时的授课时间，另需要50个小时的背景阅读时间。
很显然，你需要仔细想想教授完本课程需要多长时间，每堂课又需要具体讲述些什么。可以通过试讲摸索出路子。
授课对象
这是一个有关Web标准的课程，由多篇文章组成，其主要授课对象为任何想从零开始学习基于Web标准的Web（网页）设计的人。本课程的目标为：使一开始仅懂如何浏览网页的人，通过本课程的学习，熟练掌握CSS样式和HTML语言，并了解JavaScript的基本知识及实际应用。通过学习，将可以使学员获得进入工作市场所需要的足够知识（当然工作经验是无法教授的，需要自己积累）。
在我看来，授课对象是希望以“正确的方式”学习Web设计的任何人，包括：

1. 大学/学院学生和老师：正如我已经指出的那样，老师既可以利用本课程的全套文章创建自己的课程，并向学生讲授；也可以将其中部分文章作为你自己课程的补充。而任何已经学过一些Web相关课程的学生，应当使用本课程的材料补充自己的知识，并劝说自己的老师也这样做。我建议老师也把这些材料通读一遍，以确保所教授的课程中含盖的技术是当前的最佳规范。 大学预科/大学年龄的学生：尽管本课程主要是面向成人的，但中学生也还是可以从学习本课程中受益，可以尝试学习本课程。 在职的Web设计者和开发者：有很多在职的Web设计者和开发者，尚未在工作中使用Web标准和最佳习惯，或是不能很容易就找到可用的参考资料，或不习惯更新自己的知识。我力劝前一类人一定学习一下本课程，以了解在工作中采用Web标准是多么有价值且又是多么容易。而对后一类人来说，我确信你们学习本课程也会有很大收获，可以更新自己的知识和技能，温习容易遗忘的知识，并使你获得足够的知识储备，可用于说服你的雇主和客户像Web站点的可访问性这类要素有多么重要。 公司内部的培训人员：本课程是以低成本对员工进行培训的理想方式。 其他个人：如果你是想学习Web设计和开发的个人，本课程也是你以低成本接受教育和培训的理想方式。

本课程是依据知识共享许可协议而发行的，任何想使用的人都可以免费使用，只要承认本课程归属于我们即可。
目录
请注意，迄今为止本课程下的39篇文章已经发布，还有10多篇文章也将尽快发布，组成完整的课程。
开始篇

1. 序言，作者Chris Mills，就是您现在正读的这篇。

Web标准导论

2. 互联网和Web的历史，以及Web标准的演化，作者Mark Norman Francis 互联网是如何运转的？作者Jonathan Lane Web 标准所包括的模块——HTML、CSS 和 JavaScript，作者 Jonathan Lane 梦想虽然很美，但实际上到底怎么样？作者Jonathan Lane

Web设计概念
这部分并不涉及代码或标记的细节知识，而是在你开始创建任何图形或代码前，帮助你了解Web设计过程，以及Web设计的一些基本概念，如信息架构、导航、可用性等。

6. 信息架构——规划一个Web站点，作者Jonathan Lane 一个好的网页需要什么？作者Mark Norman Francis 色彩理论，作者Linda Goin 建立站点的线框图，作者Linda Goin 配色方案和设计样板，作者Linda Goin 网页排版，作者Paul Haine

HTML基础

12. HTML 基础知识，作者Mark Norman Francis HTML 的 <head> 元素，作者Christian Heilmann 为你的 HTML 文档选择适当的文档类型，作者Roger Johansson

HTML正文

15. 在 HTML 中标记文本内容，作者Mark Norman Francis HTML 列表，作者Ben Buchanan HTML中的图像，作者Christian Heilmann HTML链接——让我们建一张网吧！作者Christian Heilmann HTML表格，作者Jen Hanen HTML表单基础知识，作者Jen Hanen 罕为人知的语义元素，作者Mark Norman Francis 通用容器－－div 和span元素，作者Mark Norman Francis 使用导航菜单创建多页面，作者Christian Heilmann 检验你的HTML，作者Mark Norman Francis

可访问性

25. 可访问性基础知识，作者Tom Hughes-Croucher 可访问性测试，作者Benjamin Hawkes-Lewis

CSS样式

27. CSS 基础知识，作者Christian Heilmann 继承和层叠，作者Tommy Olsson 使用CSS设置文本样式，作者Ben Henick CSS布局模型——boxes、borderes、margins、padding，作者Ben Henick CSS背景图片，作者Nicole Sullivan 样式列表和链接，作者Ben Buchanan 样式表格，作者Ben Buchanan 样式表单，作者Ben Henick 浮动及清除，作者Tommy Olsson CSS的静态和相对定位，作者Tommy Olsson CSS 的绝对和固定定位，作者Tommy Olsson

JavaScript 的文章
即将发布...
补充文章 将你的内容发布到网上，作者Craig Grannell. 有关文档中 <head> 元素的更多知识，作者Chris Heilmann. 补充材料：用于排版的通用HTML实体，作者Ben Henick. Opera公司Web标准课程词汇表，由多人撰写。本目录尚不完整，将随时添加。
致谢
在开发本课程的过程中，有非常多的人曾给予我帮助，也许无法一一列出他们的名字，但我希望在这里能已列出他们每个人的名字。他们都是一些杰出的人，我建议你们去听他们的讲座、买他们写的书、阅读他们的博客，或者以其他方式给予他们支持。我向你们致以感谢和敬意。我要感谢：

1. 文章的作者：非常感谢Ben Buchanan, Tom Hughes–Croucher, Mark Norman “Norm” Francis, Linda Goin, Paul Haine, Jen Hanen, Benjamin Hawkes–Lewis, Ben Henick, Christian Heilmann, Roger Johansson, Peter–Paul Koch, Jonathan Lane, Tommy Olsson, Nicole Sullivan, Mike West。没有你们的帮助，本课程是不可能被编写出来的。 Opera的同事：包括Jan Standal, David Storey，我手下团队的其他成员，以及其他所有帮助我开发本课程的同事。 机构：感谢Yahoo 公司的每一位员工（文章作者，以及Sophie Major，她在组织和推广方面给了我很大帮助）。感谢 WaSP公司（特别是 Gareth Rushgrove, Stephanie Troeth 和Aarron Walter）, Britpack网站，Geekup 网页设计师联盟，以及关注本课程的所有大学。 个人：衷心感谢以下人士——Craig Saila, Sara Dodd, John Allsopp, Roan Lavery, Bruce Lawson, Alan White。如果我遗漏了谁，请原谅我。 读者：感谢你们对以正确的方式创建Web站点感兴趣，并抽出时间阅读本课程的材料。

与我联系
我始终希望更可能多的人能给我提供意见和建议，以让我能改进本课程。如果你对如何改进本课程有任何建议，或是有任何评论，或是希望某个地方推广本课程，都请与我联系。我的E-mail是：cmills[at]opera.com 。 你也可以点击每篇文章页首的链接（“讨论本篇文章”），发表你对文章的评论。为参与讨论，你需要一个 my.opera 账户。