無障礙網路空間服務網無障礙網路空間服務網

5.4:H205103 若表格只做為版面配置時,勿使用表格之結構標記(如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>
          
網頁內容結束分隔線