语义化(Semantic)

路线前端HTML

语义学（源自古希腊）可定义为对语言意义的研究。

语义元素是拥有语义的元素。

非语义元素的例子：<div> 和 <span> - 无法提供关于其内容的信息。

语义元素的例子：<main> <form> <table> <h1> <header> <footer> 以及 <img> - 清晰地定义其内容。

📝示例

👍 Good

<div class="container">
    <header class="header"></header>
    <aside class="sidebar"></aside>
    <aside class="aside"></aside>
    <main class="content"></main>
    <footer class="footer"></footer>
</div>

👎 Bad

<div class="container">
    <div class="header"></div>
    <div class="sidebar"></div>
    <div class="aside"></div>
    <div class="content"></div>
    <div class="footer"></div>
</div>

💻推荐网站

w3school 语义

MDN 语义