Инструмент доступности WAVE: очень маленький текст - возможно ли избежать этого предупреждения, но оставить размер шрифта без изменений? - PullRequest
0 голосов
/ 12 ноября 2018

Существует фрагмент кода, который отображает крошечный «8px текст» на странице вместо иконки начальной загрузки.

<a href="someurl"><span class="small-text-as-an-image">8px text</span></a>

Этот текст не следует рассматривать как текст для глаз, но, пожалуйста, рассматривайте его как изображение.

Как избежать предупреждения о доступности WAVE, что этот текст очень маленький?

  1. Первый вариант - сделать этот текст в виде изображения. JPEG или любое другое изображение. Это хорошо? Я так не думаю.
  2. Второй вариант - использовать preudoclass css + apply

    .small-text-as-an-image: after { содержание: "8px текст"; }

Похоже, что вторым вариантом будет путь (также протестированный с JAWS, похоже, что JAWS также уважает это решение и произносит его).

Однако это решение также не является идеальным, поскольку перевод веб-сайта на 2+ языка вызовет проблемы: следует по возможности избегать текста в css.

Любое хорошее решение, что инструмент доступности WAVE позволит избежать этого предупреждения, а также читатели прочитают его как "текст 8px"?

Спасибо.

1 Ответ

0 голосов
/ 15 ноября 2018
<a href="someurl"><span class="small-text-as-an-image">8px text</span></a>

Этот текст не следует рассматривать как текст для глаз, но, пожалуйста, рассматривайте его как изображение.

Этот текст является единственным содержимым внутри ссылки.Поэтому его нельзя рассматривать как декоративное изображение

  • ему не хватает какой-либо альтернативы (например, aria-label),
  • оно должно восприниматься
  • этоможет быть достаточно большим, чтобы на него можно было кликать (используя CSS) (см. целевой размер )
...