Должен ли я размечать примеры кода с помощью ‹code› или только для чтения ‹textarea› для программ чтения с экрана?

У меня есть страница с несколькими примерами кода HTML. Выиграют ли пользователи программ чтения с экрана, если увидят их такими:

<textarea readonly="true">CODE EXAMPLE HERE</textarea>

или я должен просто пойти на это:

<code>CODE EXAMPLE HERE</code>

Я думаю, что <textarea> может упростить копирование и вставку, чем <code>, но я хотел бы услышать о вашем опыте.


html accessibility screen-readers semantic-markup
person Tobias Christian Jensen    schedule 31.07.2019    source источник

Ответы (2)


arrow_upward
3
arrow_downward

Элементы <textarea> предназначены для ввода пользователем. readonly предназначен для временного состояния чего-то, что используется для пользовательского ввода, но по какой-то причине может быть заморожено.

Используйте <code> (возможно, в сочетании с <pre>).

person Quentin    schedule 31.07.2019
comment
Вы приводите хороший аргумент. Я думаю, что часто разработчики пытаются творчески манипулировать компонентами, чтобы сделать то, для чего они не предназначены, и особенно со вспомогательными технологиями мы должны просто полагаться на семантически правильные элементы. - person Tobias Christian Jensen; 01.08.2019

arrow_upward
1
arrow_downward

Использование <code> является правильным решением. Если когда-либо существует подходящий HTML-тег, просто используйте его. Браузер и программа чтения с экрана преобразуют это в полезную информацию для пользователя. ARIA, как указано W3C, следует использовать только в том случае, если нет доступного HTML-решения. ARIA заставит вас вести себя определенным образом. Это часто используется для тегов div, которые сами по себе не имеют семантики, и оснащение их ролями и атрибутами ARIA может заставить их вести себя так, как подразумевается визуально.

person Heiko Folkerts home    schedule 31.07.2019