Можно ли использовать какой-либо разрыв строки в тексте alt для изображения, все еще придерживаясь стандарта XHTML 1.0 Strict?
Что-то вроде этого...
<img src="foo.jpg" alt="Line 1\nLine 2" />
Я прошу, потому что я хочу опубликовать следующий скриншот на моем сайте, но хочу включить текстовую версию в текст alt для целей SEO и для слабовидящих.
Я предпочитаю скриншот поверх текстовой версии, потому что он выглядит более привлекательно.
Просто используйте обычный разрыв строки.
<img src="foo.jpg" alt="Line 1
Line 2" />
Переполнение стека делает это в своих названиях:)
Затем добавьте этот CSS:
img{white-space:pre}
Лучше всего просто добавить код символа HTML для перевода строки или возврата каретки.
line feed is 

carriage return 
Я думаю, что вы, возможно, слишком стараетесь.
Предполагается, что альт-текст является заменой для изображения, а не каким-то буквальным его представлением.
Правильно помеченные и т.д., это будет означать неупорядоченный список с суб-списками, а экран-ридер получит информацию о связях от вложенности элементов HTML. Замена этого с некоторыми разрывами строк для получения приблизительного визуального приближения - это не одно и то же, например. как вы планируете также "показывать" экранное устройство, что кусок после первого прерывания строки "внутри" ошибок?
И я сомневаюсь, что поисковые системы будут делать что-либо с разрывами строк в тексте alt, кроме как отменить их. (По общему признанию, спекулятивный.)
То, что вы на самом деле после, каким-то образом включает в себя информацию о вложенности/отношениях, которую имеет изображение, но с текстом. Начните с чего-то вроде "Снимок экрана из [app], показывая две ошибки [подробно здесь, если хотите] и два информационных элемента [подробно]" и т.д.
Или вы можете стать действительно педантичным и фактически создать список в HTML, а затем использовать технику замены изображений для вставки изображения.
@Murch был тем, что я не знал. Однако становится и накладные расходы на разрыв пробелов в БР во всем приложении.
Как простейшее решение, вы можете просто предоставить
img.class { overflow:hidden }
и с этим справитесь быстро и грязно.