Bring your karma
Join the waitlist today
HUMBLECAT.ORG

Blind and Visually Impaired Community

Full History - 2017 - 04 - 05 - ID#63nz4a
5
How can I do screen reader announcements? (self.Blind)
submitted by rkingett
On $1 I would like to add extra link information that only screen readers can see. I know that this can't be done using Markdown but if anybody can point me to an HTML resource that would be great!
Vaelian 2 points 6y ago
If you add a title property to the anchor tag you will get a tooltip which will be read by screen-readers and displayed visually when the user hovers with the mouse over the link. If you really want to hide this tooltip from the sighted you can code two links, one with the title attribute and one without, and then use a screen CSS to hide the link with title and an aural CSS to hide the link without title. I'm not sure if there's a more efficient way of doing this with HTML5 since I haven't done any web development in the last 10 years.
kaall 1 points 6y ago
You're in luck. It can be done in markdown. You can add the title property anyway. Add it after the URL, still within the paranthesis, enclosed in quotes, seperated from the URL by a space. Here is an example:

$1

The title is likely the best solution. Whats the particular information you want to give to screenreaders? Extra description or some easter eggs for the blind readers? I don't see any visual stuff in your links that would need extra description.
rkingett [OP] 1 points 6y ago
I just want to say things like, opens in a new tab. Goes to mobile website. stuff like that.
narfarnst 1 points 6y ago
Perhaps the `role` attribute?

$1
This nonprofit website is run by volunteers.
Please contribute if you can. Thank you!
Our mission is to provide everyone with access to large-
scale community websites for the good of humanity.
Without ads, without tracking, without greed.
©2023 HumbleCat Inc   •   HumbleCat is a 501(c)3 nonprofit based in Michigan, USA.