如何理解 HTML 语义化？

先看下面两段代码

<div>标题</div>
<div>
    <div>一段文字</div>
    <div>
        <div>列表1</div>
        <div>列表2</div>
    </div>
</div>    

html语义化代码：

<h1>标题</h1>
<div>
    <p>一段文字</p>
    <ul>
        <li>列表1</li>
        <li>列表2</li>
    </ul>
</div>

HTML语义化的好处？

　　1.让人更容易读懂（增加代码可读性）

　　2.让搜索引擎更容易读懂（SEO）

　　　　搜索引擎根据第一段代码分不清重点，机器只认识标签