Hot answers tagged

2

Well there are many things you can do. aria-label and visually hidden text are the first to come to mind. Aria-label example: <button aria-label="primary (or other meaningful text)">Button text here</button>. Visually hidden text, only "visible" to screen readers: <button><span class="visually-hidden">Primary Action</span> ...


2

Yes, smartphones with touchscreens can be used by blind people. Just like with any other computing device with screen, a screen reader is needed, which outputs what is displayed on the screen in a different way (e.g., via text-to-speech or via a braille terminal). While input devices like physical keyboards or microphones are typically more suitable for ...


1

As you said the black rectangle is simply a visual indicator, so you need to give that screen reader something to see. The simplest way is to give an alternative text such as "redacted" or "this text has been redacted by person on date" whatever information it is you can give, then black out that text by changing the color visually using CSS. Like so: ...


1

Small capitals for most fonts aren't web-ready yet. This article from Design for Hackers has some detail about why you should use real small capitals instead of fake (or just don't use them at all). You could use text-transform: uppercase to make a swathe of text appear as all-caps, when it's actually normal-case in the markup; that should sidestep the ...


1

I was also looking for an answer to this, but the grid role didn’t feel right because in my case the basket widget contains controls other than the product list itself, for example: the title, the checkout button, the minimize button. So I googled some more and found this ALA article: “Accessibility: The Missing Ingredient”. It recommends the dialog role ...



Only top voted, non community-wiki answers of a minimum length are eligible