-1

语义 X/HTML 标记如何节省时间 -

  1. 我们什么时候为网站写 CSS
  2. 如果将来有任何设计更改来自客户。
  3. 以及为什么在这两种情况下，基于表格的布局总是需要更多时间

今天我要向学生解释这些事情。

我有一些例子，但我想要一些更好的例子和想法来很好地解释。

我想从开发人员的角度解释语义 X/HTML 标记的好处。

提前致谢

更新：

使用语义标记的好处：

  1. 在无法应用 CSS 的环境中查看文档的人可以很好地阅读它。
  2. Web 开发人员可以更轻松地维护代码，并将内容 (HTML) 与表示 (CSS) 分开。
  3. 在某些情况下，语义标记可以减少对 css 组选择器的需求。
4

3 回答 3

3

对于开发人员来说，除了更可靠和可控的代码外，主要优势是代码清晰。通过编写语义 XHTML，您可以避免编写其他开发人员或您将来难以破译的模糊代码。

IE。<address>列出地址比使用 a 更好<div>（这种情况经常发生......），同时具有相同的灵活性、样式和提高可读性。

于 2010-02-05T10:47:12.887 回答
2

根据我的工作经验：我现在有好几次从我的前任或完全其他人那里查看遗留标记（实际上我自己也是一两次）。有时我只有在浏览器中查看源代码的结果。到目前为止，我的发现是：

  • 如果作者尽可能使用语义标记，再加上清晰和逻辑的类名，那么找出页面的结构，例如编写新的小部件或重组列布局或其他东西，真的很容易和有趣

  • 如果作者使用基于表格的布局，而我也有 90 年代末的东西可以看，那就是一团糟。你必须弄清楚，哪个表格行做什么，哪个表格单元格属于哪里，如果你开始认为你会掌握，你之前忽略了rowspan="3"300 行标记。即使在 Firebug 中，你也会对这样的标签汤感到愤怒。

    在这里添加新东西可能会变得非常冒险。如果您向表格单元格添加内容，并且没有完全修复新内容的宽度和高度，您可能会发现自己在整个页面上都有令人不快的间隙，并且忘记在<td>某处打开或关闭 s （有 200 个验证错误您可能会在某处遗漏某些内容的原始页面）可能会导致完全错误的视图。

  • 如果作者到处使用div 和 span，但没有做语义标记（即写<div class="header1"/>而不是<h1/>），它仍然比表格布局好得多（最多是因为提到的 rowspan 和 colspan 并且因为如果某处有</div>遗漏，页面可能不会完全炸毁），但您仍然可以对标记发疯，例如

    </div></div>
</div>
   </div>
  </div>
</div></div>
  </div>

    此外，如果我有一个随附的样式表，那也基本上是一团糟。区分.header、.header1和迫使您在样式表div.header_level1和#middle .h1标记之间来回切换。

于 2010-02-05T11:14:12.463 回答
1
  1. 我们将第一次为网站编写 CSS

每个网站都有不同的外观/布局，你必须第一次为它编写 css，除非它们在你的布局之间有一些相似之处。

  1. 如果将来有任何设计更改来自客户。

您可以使用 MVC 设计模式制作您的网站，这将为您的网站设计带来很多变化。

  1. 以及为什么在这两种情况下，基于表格的布局总是需要更多时间

因为它们的标记设计为您必须编写更多内容，而在基于 div 的布局中，我们主要使用clear和float，它们在快速创建布局方面做得很好。

于 2010-02-05T10:27:02.740 回答