跳到主要內容
:::|

13.9:H313208 能辨別出意義上有群組相關的超連結

說明: 為便利使用語音合成器來閱讀網頁資訊的身心障礙者,能清楚辨別出意義上有群組相關的超連結,必須以清楚的機制輔助語音合成器來閱讀告知使用者有相關群組的超連結存在,以利其瀏覽閱讀他們所欲連結傳達的網頁資訊。

範例: 當網站中有一些相關的連結時,應該使用DIV,SPAN,P,或是FRAME標籤配合id或class屬性的使用,將這些相關的連結群組標記起來。下面是未將相關連結群組起來的設計:

不良設計

未使用任何標籤將相關的連結加以標記起來。

不良設計:

[< A href="linkto/ex01.jsp" >資訊< /A >] [< A href="linkto/ex02.jsp" >社群< /A >] [< A href="linkto/ex03.jsp" >商務< /A >] [< A href="linkto/ex04.jsp" >娛樂< /A >] [< A href="linkto/ex05.jsp" >服務< /A >]

正確示範

下面兩組範例是使用DIV標籤配合id屬性將相關的連結加以標記起來。


正確範例:

< DIV id="navigation" > < P > [< A href="linkto/ex01.jsp" class="style1" >資訊< /A >] [< A href="linkto/ex02.jsp" class="style1" >社群< /A >] [< A href="linkto/ex03.jsp" class="style1" >商務< /A >] [< A href="linkto/ex04.jsp" class="style1" >娛樂< /A >] [< A href="linkto/ex05.jsp" class="style1" >服務< /A >] < /P > < /DIV > < DIV id="service" > < P > [< A href="linkto/ex06.jsp" class="style2" >影音< /A >] [< A href="linkto/ex07.jsp" class="style2" >電影< /A >] [< A href="linkto/ex08.jsp" class="style2" >音樂< /A >] [< A href="linkto/ex09.jsp" class="style2" >卡通< /A >] [< A href="linkto/ex10.jsp" class="style2" >遊戲< /A >] [< A href="linkto/ex11.jsp" class="style2" >星座< /A >] [< A href="linkto/ex12.jsp" class="style2" >算命< /A >] < /P > < /DIV >< /pre>

上一頁| 回首頁