HTML設計規範[5] 資料結構、語義化,避免多餘的標籤及內容

101 月

HTML設計規範[5] 資料結構、語義化,避免多餘的標籤及內容

HTML設計規範[3] 所講到的tag是一些很常用的tag,大部份的版型幾乎都會用到,所以需要徹底瞭解tag的語義結構代表什麼,當你瞭解之後就能自然而然的避免成為「戀div癖」、「戀id癖」、「戀class癖」。

何謂上述三癖呢?就是不知善用正確的語義結構,而一直大量而反覆的錯誤使用div、id、class來組合結構。「戀div癖」、「戀id癖」就像HTML設計規範[3] 一開始舉的例子一樣,Layout全都由div加id所組成。

雖然這樣的方式也能呈現出你所想要的版面,但是如果在純文字或語音瀏覽器下,就會變成字級或語調都一樣的頁面,這會讓人分辨不出來標題、內容、語氣、重要性…等等這些原本可由正確結構所自然呈現的語義。

此外,當你對XHTML的標籤和CSS的樣式有所瞭解之後,你會發覺以前常用來格式化呈現的一些標籤是沒有意義或是應該捨棄的,例如font、center、u…這些都是應該被淘汏捨棄不用的。其他像是<hr>這樣的標籤,也可以用區塊的border樣式來呈現。

  • 錯誤範例:<h3><font color=”red”>文章標題</font></h3>
  • 正確範例:<h3>文章標題</h3>

這個例子應該把font這個標籤捨棄掉,而把顏色寫在h3這個結構的CSS裡。
 

Posted by admin  Posted on 10 1 月 
  • HTML
  • Post Comments 0