4 ms·
Remember, when embedding ASCII art in HTML, hide it from screenreaders and provide alt text. Otherwise it's an incomprehensible mess of seemingly random charact
by stevenpetryk 5y ago
Remember, when embedding ASCII art in HTML, hide it from screenreaders and provide alt text. Otherwise it's an incomprehensible mess of seemingly random characters.
- dividedbyzero 5y agoGood point, any pointers to how I'd best do that?
- rablackburn 5y agoNot the OP, but I'd just wrap it up like this: <div aria-role="img" aria-label="{your alt-text here}"> <pre>...</pre> </div> A simple approach is best. I don't have a screenreader on my current machine (as far as I know) so I can't verify actual behaviour right now, but according to MDN: > ...most screenreaders will consider the element with role="img" set on it to be to be like a black box, and not access the individual elements inside it. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Role_Img https://developer.mozilla.org/en-US/docs/Web/Accessibility/A...)
- dividedbyzero 5y agoNeat! I'll make sure to do it this way. That makes me wonder, what else on the websites I (not a web dev) maintain might need special treatment for accessibility. Pity the Chrome dev tools don't seem to help with that.