跳到主要內容
:::|

5.4:H205103 若表格只做為版面配置時,勿使用表格之結構標記(如th標籤)作為網頁格式視覺效果

說明:表格中一些結構的標籤可以產生視覺上的效果。例如:TH標籤,可以讓儲存格中文字的對齊和字型產生變化。但是對於視覺障礙者所使用的瀏覽器而言,TH標籤是一種結構標籤,可以輔助視覺障礙者解讀表格中的資訊。為避免視覺障礙者混淆表格中的資訊,勿以表格中的結構標籤作為呈現網頁文字格式的視覺效果。

範例: 當表格只是為了網頁版面的配置時,使用TH標籤來達到粗體文字的網頁效果,會造成視障者對 於表格內文字內容從屬性的誤解,誤以為是表格中的標題欄。

不良設計

不良設計:

< TABLE border= " 1 " > 
< TR align= " left " > 
< TH > 即時新聞快訊:北二高中和路段今天下午發生連環大車禍 < /TH > 
< TH > 台灣天氣資訊:台北午後雷陣雨;高雄高溫炎熱 < /TH > 
< /TR > 
< TR > 
< TD > 中山北路等部分路段 今起機車不得停放騎樓 (中央社) < /TD > 
< TD > 大考成績單寄發 預估錄取率86% (民視) < /TD > 
< /TR > 
< /TABLE >

正確示範

這個例子因為上下兩列的資料並無標題與資料的從屬關係,所以正確設計是使用STRONG標籤來顯示粗體的文字效果。

正確範例:

< TABLE border= " 1 " > 
< TR align= " left " > 
< TD > < STRONG > 即時新聞快訊:北二高中和路段今天下午發生連環大車禍 < /STRONG > < /TD > 
< TD > < STRONG > 台灣天氣資訊:台北午後雷陣雨;高雄高溫炎熱 < /STRONG > < /TD > 
< /TR > 
< TR > 
< TD > 中山北路等部分路段 今起機車不得停放騎樓 (中央社) < /TD > 
< TD > 大考成績單寄發 預估錄取率86% (民視) < /TD > 
< /TR > 
< /TABLE >

上一頁| 回首頁