My super duper page
 
  
  
  
     
  
  
  
  

 
 
 

  
  
  
 
  
  
  
 
  
  
  
  
 
  
  
  
    
My super duper page
 
  
  
  
     
  
  
  
   
  
  
  
   
  
  
  
     
  
  
  
   
  
  
  
   
  
  
  
     
  
  
  
   
  
  
  
  
  
  
  
     
  
  
  
   
  
  
  
 
 
 
 

 
 
 

  
  
  
 
  
  
  
  
 
  
  
  
    
My super duper page
 
  
  
  
     
  
  
  
   
  
  
  
   
  
  
  
     
  
  
  
  

如果你還是無法確定使用哪種元素，那么我建議你參考HTML5 sectioning content element flowchart

二、只在需要的時(shí)候使用header和hgroup

寫不需要寫的標(biāo)簽當(dāng)然是毫無意義的。不幸的是，我經(jīng)常看到header和hgroup被無意義的濫用。你可以閱讀一下關(guān)于header和hgroup元素的兩篇文章做一個(gè)詳細(xì)的了解，其中內(nèi)容我簡(jiǎn)單總結(jié)如下：

header元素表示的是一組介紹性或者導(dǎo)航性質(zhì)的輔助文字，經(jīng)常用作section的頭部
當(dāng)頭部有多層結(jié)構(gòu)時(shí)，比如有子頭部，副標(biāo)題，各種標(biāo)識(shí)文字等，使用hgroup將h1-h6元素組合起來作為section的頭部
header的濫用

由于header可以在一個(gè)文檔中使用多次，可能使得這樣代碼風(fēng)格受到歡迎：

 
 
 

  
  
  
 
  
  
  
 
  
  
  
  
 
  
  
  
    
My best blog post
 
  
  
  
   
  
  
  
   
  
  
  
 
 
 
 

如果你的header元素只包含一個(gè)頭部元素，那么丟棄header元素吧。既然article元素已經(jīng)保證了頭部會(huì)出現(xiàn)在文檔概要中，而header又不能包含多個(gè)元素（如上文所定義的），那么為什么要寫多余的代碼。簡(jiǎn)單點(diǎn)寫成這樣就行了：

 
 
 

  
  
  
 
  
  
  
  
My best blog post
 
  
  
  
   
  
  
  
 
 
 
 

 
 
 

  
  
  
 
  
  
  
 
  
  
  
  
 
  
  
  
    
My best blog post
 
  
  
  
  

此例中，直接拿掉hgroup，讓heading果奔吧。

 
 
 

  
  
  
 
  
  
  
  
My best blog post
 
  
  
  
  
by Rich Clark
 
  
  
  
 
 
 
 

第二個(gè)問題是另一個(gè)不必要的例子：

 
 
 

  
  
  
 
  
  
  
 
  
  
  
  
 
  
  
  
    
My company
 
  
  
  
    
Established 1893
 
  
  
  
   
  
  
  
 
 
 
 

如果header唯一的子元素是hgroup，那還要header干神馬？如果header中沒有其他的元素（比如多個(gè)hgroup），還是直接拿掉header吧

 
 
 

  
  
  
 
  
  
  
  
My company
 
  
  
  
  
Established 1893
 
  
  
  
 
 
 
 

關(guān)于