页面的DOM结构因人而异。从基础的层面来说，只要能够实现UI设计稿的意图，用什么DOM结构都是可行的。而从专业的层面来说，页面的DOM结构不仅要易于其他的开发者辨识和读取，方便协同开发，而且要有良好的可维护性和拓展性，方便后续的增减和更新。

　　语义化or非语义化

　　“语义化”的意思是说，在写html时，依照页面的内容，选取最合适的html标签，以体现html标签的本意。如<p>表示文本段落，那么如果一段文本确实是段落，那么就应该把它们放在<p>标签中，而不是使用没有语义的<div>。

语义化，不仅有利于SEO，而且更重要的是使网页内容层次和结构清晰，在可读性上十分友好。试想一下，如果一个页面的<em>标签中的内容，从上下文看确实就是emphasis（强调）的内容，会不会觉得这个页面很整洁很亲切呢？

但是，语义化也不是绝对的。微博的新的的站外组件（widget），并不遵从语义，仅使用限定的标签，如块元素只使用<div>，非链接行内元素只使用<cite>，图标只使用<u>。如下图所示最近的新版集体微博组件。