使用HTML5标记有什么好处，例如< article>，< section>，< figure>，< header>，< footer>，< nav>？ [英] What is the benefit of using HTML5 tags like <article>, <section>, <figure>, <header>, <footer>, <nav>?

问题描述

有一些语义标签，例如< article>，< section>，< figure>，< header>，< footer>，< nav> 在HTML5中。
我为什么要使用它们，而不是< div> 或< span> ？有优化吗？

There are some semantic tags like <article>, <section>, <figure>, <header>, <footer>, <nav> in HTML5. Why should I use them, instead of <div> or <span>? Is there any optimization?

推荐答案

可读性

当人们使用你只是在争论语义！作为论证中的辩护，它意味着暗示他们试图用不同的方式说同样的话。虽然这里是一个 ok 参数，但它并不一定如此。

When people use "You're just arguing semantics!" as a defense in an argument, it's meant to imply they're trying to say the same thing in different ways. While it is an ok argument here, it's not as necessarily true.

使用更多语义的html标签将使您的HTML更具可读性和清晰度，同时还允许您具有与标签相关的特定CSS，并且不一定需要div的自定义类。现在有人可能会争辩说你需要在类或标签中使用css，但在某些时候，每个程序员都有偏好。有些人为（int i = 0; i< count;< i ++）{} 写了，有些人写了（int i = count; i > 0; i--;）{} 。

Using the more semantic html tags will make your HTML more readable and clear, while also allowing you to have specific CSS related to tags, and not necessarily require custom classes for divs. Now one could argue that you need that css in a class or a tag either way, but at some point, every programmer has preferences. Some write for (int i =0; i < count; < i++) {} and some write for (int i = count; i > 0; i--;) {}.

还值得一提的是那些标签，类似于 < p> 和< ul> 具有默认的CSS属性，具体取决于您的浏览器，因此您可以为新页面轻松设置一些样式使用这些标签而不是从头开始用div创建所有内容。

It's also worth mentioning that those tags, similar to <p> and <ul> have default CSS properties depending on your browser, so you can get away with some easy styling for newer pages using those tags as opposed to creating everything from scratch with divs.

在一天结束时，无论你帮助你编写最好的代码是什么都应该使用。但请注意其他选项，因为您可能需要与不同于您的偏好的人合作。

At the end of the day, whatever helps you write the best code is what you should use. But be aware of other options as you will likely have to work with someone who has different preferences than you.

这篇关于使用HTML5标记有什么好处，例如&lt; article&gt;，&lt; section&gt;，&lt; figure&gt;，&lt; header&gt;，&lt; footer&gt;，&lt; nav&gt;？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！