Total Validator не находит пропустить ссылку - PullRequest
Новая
       9

Total Validator не находит пропустить ссылку

0 голосов
/ 04 мая 2018

Total Validator не находит эту ссылку и напишите мне это предупреждение:

Добавление пропускаемой навигационной ссылки в качестве первой ссылки на странице.

Как мне написать эту ссылку лучше? 

<html>
<body>
<a href="#skip">Skip to Content</a>
navbar with menu 
<div id="skip">
</div>
</body>
</html>

Ответы [ 2 ]

0 голосов
/ 04 мая 2018

Из того, что я тестировал, они требуют, чтобы текстовая ссылка содержала слово "пропустить", а атрибут href начинался с #, независимо от того, существует ли этот элемент.

С кодом, который вы отправили, он работает с моей собственной установкой TotalValidator (я не говорю, что буду использовать этот инструмент).

Для информации на сайте TotalValidator используется следующий код 

<div id="skip"><a href="#content">Skip navigation</a></div>

[...]

<a id="content"></a>
0 голосов
/ 04 мая 2018

Несмотря на то, что говорится в первом комментарии, значение идентификатора «пропустить» технически прекрасно; его не нужно менять на «skiptocontent». Причина, по которой TotalValidator не обнаруживает пропущенную ссылку, возможно, в другом. Ссылка идет куда-то на странице, и это «где-то» явно не помечено как основное содержание. Вы можете сделать это, используя достопримечательности WAI-ARIA .

С такой разметкой, как показано ниже, для валидатора должно быть очевидно, что ваша первая ссылка является пропущенной ссылкой на основной контент: 

<body>
  <a href="#skip">Skip to Content</a>
  <!-- navigation menu goes here -->
  <div role="main" id="skip">
    <p>...</p>
  </div>
</body>

Вы также можете использовать «семантические» элементы, например, 

<body>
  <a href="#skip">Skip to Content</a>
  <header><h1>...</h1></header>
  <nav><!-- navigation menu goes here --></nav>
  <main id="skip"><!--role="main" is redundant on the main element-->
    <p>...</p>
  </main>
  <footer>
  </footer>
</body>

См. Спецификацию WAI-ARIA для документации по main (role) и спецификации HTML5.2 для main element .

...