2013-10-26 4 views
2

Недавно я реализовал ARIA в веб-приложении, и я нашел this question, чтобы быть очень полезным в улучшении частей навигации.Состояние ARIA для текущей страницы в навигации

После реализации этого во всех модулях, я обнаружил эту ошибку проверки HTML:

Attribute aria-selected not allowed on element a at this point.

Глядя на спецификации ARIA, я вижу, что aria-selected используется только в роли GridCell, опции, строки и вкладки. В моем случае роль ссылки - menuitem.

Это репрезентативная выборка HTML код:

<nav role=navigation> 
    <ul role=menubar> 
     <li role=presentation><a href='page1.php' role=menuitem>Page 1</a></li> 
     <li role=presentation><a href='page2.php' role=menuitem>Page 2</a></li> 
     <li role=presentation><a href='page3.php' role=menuitem aria-selected=true>Page 3</a></li> 
     <li role=presentation><a href='page4.php' role=menuitem>Page 4</a></li> 
    </ul> 
</nav> 

Как вы можете видеть, это принято на «странице 3».

Какая роль ARIA используется здесь?

ответ

2

Я считаю, что выбранная ария предназначена для «виджетов», которые представляют собой одну вкладку, как набор вкладок, которые вы затем стрелка для выбора. Выбранный аспект составляет около , который находится в фокусе, не, на какой странице вы находитесь.

Я хотел бы проверить это, как хорошо испытанной например: http://whatsock.com/tsg/Coding%20Arena/ARIA%20Menus/Horizontal%20(Internal%20Content)/demo.htm

От: http://whatsock.com/tsg/

Для показывать текущую страницу, я бы, вероятно, использовать более традиционный метод: Сделать это не ссылку. Например:

<li><a href='page2.php'>Page 2</a></li> 
<li><strong>Page 3</strong></li> 

Это также мешает людям нажав на ссылку же страницах случайно (который я вижу довольно часто в юзабилити-тестировании). Вы можете применить тот же CSS к nav ul a и nav ul strong, а затем переопределить стиль для сильного.

+0

Это отвечает на вопрос о том, для чего «ария-выбрана», но не «как определить, на какой странице я нахожусь». Интересная демонстрация тем не менее. –

+0

А, ок, я добавил что-то о текущей странице, это помогает? – AlastairC

1

вы также можете использовать aria-current="page" для описания текущей отображаемой страницы среди навигационных элементов.

+0

См. Дополнительные пояснения: https://tink.uk/using-the-aria-current-attribute/ – murb

 Смежные вопросы

  • Нет связанных вопросов^_^