你应该避免的5个常见HTML错误。

你应该避免的5个常见HTML错误。

1. 语义化的页眉和页脚

div元素没有语义结构。不要使用div元素来创建页眉或页脚结构，而应该使用“header”和“footer”元素。

不要这样做

<div id="header">
...
</div>
<div id="footer">
...
</div>

这样做

<header>
...
</header>
<footer>
...
</footer>

如果需要为图片添加标题，请使用“figure”元素与“figcaption”元素结合使用。

不要这样做

<img src="image url" alt="image description" />
<p> Lorem Ipsum Description </p>

这样做

<figure>
<img src="image url" alt="image description" />
<figcaption>
         <p> Lorem Ipsum Description </p>
</figcaption>
</figure>

“b”和“i”标签是表现性标签，没有语义含义，请改用 CSS 中的字体粗细/字体样式，或使用“strong”或“em”元素。

不要这样做

<b>Bold</b>
<i>Italics</i>

这样做

<strong>Bold</strong>
<em>Italics</em>

链接的文本应该清晰明确，告诉用户它将用户重定向到哪里，这样用户和搜索引擎都能更容易地理解你的内容以及它与其他页面的关系。

不要这样做

<a href="url">
Check our pricing...
</a>

这样做

Check our <a href="url"> pricing </a>

内联样式违背了结构（HTML）与表现（CSS）分离的原则。正确的做法是将样式写在样式表中。

不要这样做

<h1 style="font-size: 24">
 Header
</h1>

这样做

h1 {
font-size: 24
}

订阅我的新闻简报，即可第一时间获取我的博客、科技新闻和热门产品发布信息。

下次再见，
阿比拉吉