XHTML结构化之一

1、xhtml结构化之一:使用xhtml重构网站 xhtml总结 xhtml结构化2我们曾经为本节撰写的标题是：“xhtml:简单的规则，容易的方针。”原因之 一是，木节讨论的规则和方针是简单和容易的。原因之二是，一木简单和容易的 web设汁图书，就像超级市场的新式的免费商品一样，虽然常见却可以冇效地 吸引人的眼球，这样的东西可以刺激人的兴趣，并且鼓励人们尝试。我确实希望本节的内容可以激发你的兴趣，并鼓励你去尝试。为什么这么说呢？ 因为一旦你掌握了本章包含的简单容易的理念，你就会重新思考网页运作的方 式，并开始改变建造它们的方法。然而我并不希望你只是将代码重新改写一遍。 我希望你可以实实在在地以另

2、一种方式思考和工作。男一方而，重构才是xhtml真正的意义。在本章，我们将研究结构化标记的机制和涵义。如果你止在将网站标准融入你的 开发项目，你或许会觉得本章的内容有些熟悉。不过即便是这方面的老手，也会 从本章发现意外的收获。xhtml规则概要将传统的html转换为xhtml 1.0是快捷且无痛的，只要你遵守一些简单的 规则和容易的方针。不管是否使用过html,都不会妨碍你使用xhtmlo使用恰当的文档类型声明和命名空间。使川meta元素声明你的内容类型。使用小写字母书写所有的元素和属性。为所有的属性值加引号。为所有的属性分配值。关闭所有的标签。使川空格和斜线关闭空标签。不要在注释中写双下划线

3、。确保小于号及和号为 < 和&unicode和其他字符集xml、xhtml、和html4.0文档的默认字符集是unicode, 一个由unicode 联盟定义的标准。unicode是一套全面的字符集，它为每个字符提供了一个特定 的唯一的数字，不论平台、程序和语言。unicode也是我们拥有的最接近通用字 母表的事物，尽管它并不是一个字母表，而是一套数字映射方案。以管unicode是web文档默认的字符集，开发人员依然可以自由地选择更适合 他们的其他字符集。比方说，美国和西欧的网站常常使用iso-8859-1 （latin-1） 编码，而中华人民共和w的w家标准是gb2312o为表

4、达语义而标记文档，而不是为了样式记住：请最大限度地使用css来进行布局。在web标准的世界甲.，xhtml标 记与表现无关，它只与文档结构有关。结构良好的文档可以向浏览器传达尽可能多的语义，不论是浏览器位于掌上电脑 还是时髦的桌面图形浏览器。结构良好的文档都能向用户传达可视化的语义，即 使是在老的浏览器，或是在被用户关闭了 css的现代浏览器中。不是每个站点都能立即抛弃html表格布局。css的发明者，w3c，直到2002 年11月冰将官方网站转换为css布局。然而，即使是顽岡的唯标准主义者也 不总是将表现从结构中完全分离处理，至少在xhtml 1中是做不到的。但是 现在，我们可以向这个理想迈

5、出重大的一步，通过将表现从结构中分离（或者说 将数据从设计中），即使是混合的传统的布局也可从中受益。下而有一些提示，可以帮助你通过更结构化的方式进行思维：提纲内的色彩在语法学校，我们中的大部分人都被迫使用标准的提纲格式来写文章。现在，我 们成为了设计师，可以多么自由地摆脱提纲的限制，然后人胆地投身于独特的个 人表达的自由领域（也许我们的宣传册和商业站点还不是那么独特和个人化）。 但是至少我们不会再受到提纲的困扰了。实际上，依照html,我们应该将内容结构化为有组织的层级。在浏览器不支 持css的时期，我们无法在交付可供销售的布局的同时做到这一点。但是今天， 在将我们的设计不折不扣地实现的同时，

6、我们有能力交付内在结构良好的文档。当你将供网络使用的文本进行标记，或者当你将已有的文本文档转换为网页时， 请使用传统提纲的这些条目进行思考。hl我的主题/hlp介绍性文字/ph2补充性的观点/h2p相关文字/p同时，避免使用已被废弃的html元素比如font，或者无语义的元素比如 br/,来模拟其实不存在的逻辑结构。比如，不要像这样做：font size=7我的主题/fontbr /介绍性文字br /xbr /font size=6补充性的观点/fontbr /相关文字br /根据它们的意义使用元素，而不是根据它们的外观我们中一些人已经陷在了一个坏习惯中，当我们仅仅需要一个大号字的文本时使 用

7、hl，或者在我们需要在前面加一个圆点符号时使用li。就像我们在前面的章 节讨论过的，浏览器一直都：惯于将设计属性强加于html元素之上。我们都 一直习惯于认为，hl意味着大号字，而li意味着闢点，或者blockquote意味着 文本缩进。我们中的大多数人还在使用结构化元素模拟表现效果的方式来胡乱地 写作html。同样地，假如设计师希望所有的标题使用相同的字号，她会将所有的标题设置为 hl,即使这么做毫无结构化语义可言。hl这是主标题，在我将文本按照提纲格式组织的情况下。/hlhl这不是主标题，但是我希望它与上而的标题使用一样的字体，但是我不知该 如何使用css。/hlhl这根木不是一个标题。但

8、是我非常希望页面中的文字使用相同的字体，以达 到我希望的，如果我了解css，就可以在不打乱文档结构的情况下达到这个设计。/hl我们必须把我们的小把戏放到一边，然后开始根据元素的语义来使用它们，而不 是根据它们看上去的样子。实际上，hl可以成为你希望的任何样子。通过css, hl可以成为非粗体的小号的罗马字体，而p文木可以成为粗体的大号字，li也 可以没冇圆点（你或者可以使用小猫小狗或者公司标志的png,gif或者jpeg 图片取而代之）等等。从今天开始，我们将要使用css来决定元素的外观。我们甚至可以根据元素在 页面中或者在站点中所在的位罝来改变它们的外观。css可以将表现从结构中 彻底抽离，

9、并且允许你按照你喜欢的样式来格式化任何元素。hl, h2, h3, h4, h5, h6 font-family: georgia, palatino, "new century schoolbook",times, serif; font-weight: normal; font-size: 2em; margin-top: lcm; margin-bottom: 0;你为什么要这么做呢？这么做的目的是为了在图形浏览器中获得品牌化的外观 和感觉的同吋，在文本浏览器、无线设备、html格式的电子邮件中，文档的 结构得到保留。我们并不想在关于xhtml的章节讲述更多css方面

10、的技术。我们只是希望 展示文档结构和可视表达是两个完全不同的事物，并且结构化元素应被用来转换 文本，而不是强加显示效果。使用结构化元素，而不是无意义的垃圾由于我们已经忘记或者根本不知道html和xhtml的用途是传达结构化的 意义，许多html争论者这样使用标签来插入列表：项目<br />项目二<br /项目三<br />考虑一下使用有序或者无序列表取而代之： <ul><li项目一 </li <li>项目二 </li> <li>项目三</li> </ul>”但是li给我一个圆点，而

11、我不需耍圆点！ ”你也许会这么说。根据上面的章节， css不对元素被期望的外观做任何假定。它等待你来告诉它你所期待的元素外 观。关闭圆点是css的最基木的能力。它有能力使列表看起来和普通文木没有 两样，也可以使列表看起来像图形导航栏，具有完整的反转效果。所以，请使用列表元素来标记列表。相似地，使用strong来代替b，使用em代 替i,等等。在大多数桌面浏览器缺哲状态下，strong的显示效果和b相同，而em和i和同，同时也可以在不破坏文档结构的情况下创建你期待的视觉效 果。尽管css不会为任何元素的显示作假设，浏览器却作了很多假设，并且我们还 没有碰到一个将strong显示为其他效果而不是粗体字的浏览器（除非是被设计 师创建的css指示以其他方式显示）。假如你担心某个陌生的浏览器不会将 strong显示为粗体字，你可以编写这么一条css规则： strong font-weight: bold; font-style: normal;视觉元素和结构web标准不仅要求我们使用何种科技，而xl还要遵守使用这