跳到主要內容
:::|

10.6:H310005 勿單以空白間隔分開相連之超連結

說明:為便利使用語音合成器來閱讀網頁資訊的身心障礙者,可以清楚的辨別緊鄰在一起的超連結,勿單以空白間隔分開相鄰的超連結,必須以清楚的機制來輔助語音合成器告知使用者有緊鄰在一起的超連結。

範例:超連結與超連結之間,使用空白鍵、使用表格的TD、使用&NBSP;(註:NBSP請用小寫)、使用< span >分開超連結,使用者不容易選取到正確的連結。

不良設計

不良設計:

< P > < A href="http://www.yam.com/" > 蕃薯藤 < /A > < A href="http://www.pchome.com.tw/" > PChome < /A > < A href="http://www.yahoo.com.tw/" > Yahoo!奇摩 < /A > < /P > < TABLE > < TR > < TD > < A href="http://www.ey.gov.tw/" > 行政院 < /A > < /TD > < TD > < A href="http://www.ly.gov.tw/index.jsp" > 立法院 < /A > < /TD > < TD > < A href="http://www.judicial.gov.tw/" > 司法院 < /A > < /TD > < /TR > < /TABLE > < P > < A href="http://www.president.gov.tw/" > 總統府 < /A > < A href="http://www.exam.gov.tw/" > 考試院 < /A > < A href="http://www.cy.gov.tw/" > 監察院 < /A > < /P > < P > < A href="http://www.ntu.edu.tw/" > 台灣大學 < /A > < span > < A href="http://www.nthu.edu.tw/" > 清華大學 < /A > < span > < A href="http://www.tku.edu.tw/" > 淡江大學 < /A > < /P >

正確示範

連結與連結之間加上[ ]、( )、{ }、|、-…等符號加以區隔。


正確範例:

[ < A href="http://www.yam.com/" > 蕃薯藤 < /A > ] [ < A href="http://www.pchome.com.tw/" > PChome < /A > ] [ < A href="http://www.yahoo.com.tw/" > Yahoo!奇摩 < /A > ] < TABLE > < TR > < TD > < A href="http://www.ey.gov.tw/" > 行政院 < /A > - < /TD > < TD > < A href="http://www.ly.gov.tw/index.jsp" > 立法院 < /A > - < /TD > < TD > < A href="http://www.judicial.gov.tw/" > 司法院 < /A > - < /TD > < /TR > < /TABLE > < P > { < A href="http://www.president.gov.tw/" > 總統府 < /A > } { < A href="http://www.exam.gov.tw/" > 考試院 < /A > } { < A href="http://www.cy.gov.tw/" > 監察院 < /A > } < /P > < P > < A href="http://www.ntu.edu.tw/" > 台灣大學 < /A > | < A href="http://www.nthu.edu.tw/" > 清華大學 < /A > | < A href="http://www.tku.edu.tw/" > 淡江大學 < /A > < /P >

上一頁| 回首頁