- cross-posted to:
- chapotraphouse@hexbear.net
- cross-posted to:
- chapotraphouse@hexbear.net
The internet has become 3 massive multi-user blogs, each largely consisting of screenshots taken of the other two. This kind of blows, and not just for the usual reasons that may spring to mind.
Images are a terrible medium for online communication! Not everyone online uses a monitor. Any messages contained in a picture is straight up unacceptable without alt-text. It also makes it harder to find and fact check sources, or to spread a thought or idea further than yet another image upload. Copy/pasting text is just plain easier than downloading and uploading.
If you’re going through the trouble of creating an image post, take an extra minuite to copy/past (or even transcribe) the source text into the alt-text submission. It’s not much, but it goes a ways to improving how we use this blasted network!
https://uxdesign.cc/how-to-write-an-image-description-2f30d3bf5546
You must log in or # to comment.
Alt text can also be added to inline images. Per the commonmark spec:
![alt] (/url "title")See also https://uxdesign.cc/how-to-write-an-image-description-2f30d3bf5546 from the disabled comm sidebar.
ⓘ This user is suspected of being a cat. Please report any suspicious behavior.
I appreciate this instructional post, thank you!
I’m guilty of not always providing alt text. But JSYK posting images doesn’t require downloading them and uploading them from my file system. Users can just paste an image from their clipboards into the upload box or comment box and it will automatically host it on Hexbear and insert the link.
I wish that alt text were easier to see. By default, there’s no indication that there’s alt text set for this image, and at least in the browser I’m currently using, there’s no easy way to copy the alt text.
I usually try to do this now due to accessibility concerns. As @Edie@hexbear.net said, when embedding an image in a comment, the alt text goes inside the
[].When I was testing it out, it seemed like it was actually the “title” that was getting applied as alt text.
E: ok, I switched to a computer to double-check the source. The title is actually the title and not the alt text, but that’s all I can easily see on mobile. The alt text is different, but even on the computer only the title is actually easy for me to see without looking at the page source.
You’re right that it appears to reverse title and alt-text from the commonmark spec. That might be a bug or unintended deviation.
I know @Edie@hexbear.net has tested post images through a screen reader, but I’m not sure if she has tested comment images. She might know more.
Edit: actually, it’s not reversed in the source. It’s just that browsers seem to like to show the title text rather than the alt text.
I took a look from a computer at the source. The fields are mapped properly, but:
- on the post the alt text is copied to both fields
- in my emoji example, each field has different content
And regardless of whether I’m looking from a computer or mobile, the alt text is hard or impossible to see, while the title text is potentially visible.
Use of the title attribute is highly problematic for:
- People using touch-only devices
Except I’m having the exact opposite experience
In some contexts it seems that orca will say both. First the alt, then it adds “image”, then the title.
Edit: But in others not, it will say just the alt.
ⓘ This user is suspected of being a cat. Please report any suspicious behavior.
I’ve been doing alt-text wrong the whole time?! :kiryu-slam:
It’s absolutely wild to see emoji codes instead of images. I always use the emoji picker to find stuff instead of just typing something out. The inline picker is loading faster though, so maybe I should use that more, but unless I fully type out an emoji it still gets replaced with an image code.
:wowee:I usually use the emoji code because it’s easier for me to read while I’m
shitpostingcomposing the comment with inline emojis. Compare the source of this comment to this comment to see why.Oh yeah, it was a ton easier to read than some UUID picture link, I was going to switch up how I use emojis until I checked how it federates
Emoji codes don’t translate as well when federated though:
Of course they don’t work federated…
Edit: No, you seem to be doing it correctly.
ⓘ This user is suspected of being a cat. Please report any suspicious behavior.
I should post/comment entirely with images as practice and as a bit.
What/how did you test?
In my post above, I put an image with:
On a computer, the only browser I tested was Firefox. The title text displayed on mouse hover. Both title and alt text were visible in the HTML page source.
On mobile, I was only testing with Safari. The title text displays on long press. The post source displays when I click the post source button.
Alt text aren’t supposed to be rendered.
Whether that’s a good thing? I don’t really think so, sure makes it a lot harder to get the average person to care about them.
Maybe a tooltip should be added, or the alt text should be copied to the title as well when there is no title text.
Copying the alt to the title may result in the same text being presented twice.
If you show it as a tooltip, people will use it as a tooltip.
I guess that’s why it’s hidden so we’ll. The average webdev only learning about alt texts through search engine optimization might be preferable outcome over them approaching it as a visual design feature.
You are completely correct, though I must admit to my own failings when it comes to alt text description.
I’m personally not dependent on alt-texts but I’m checking every single image you all post on here, quietly judging you for the absence of alt-texts and relishing their presence.
Image descriptions are useful to me, sometimes I don’t understand the context of the image being used in relation to the post. I write alt text for a multitude of reasons!
Is there a way to alt text when you post an image in a reply?
EDIT: Did it work?
Why does your void look like Tom Servo lol
He watches too many terrible B movies.
“AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAGH!”
I’ve always tried to use alt-text when possible, but for inline images I’ve been confused about whether to put the description between the brackets or in quotes in the parentheses. If this thread is anything to go off of, I guess I should do both, or?
There’s also the thing about how to write good descriptions. I’ll have to take a good look through the guide that Edie linked in this thread; I skimmed through it just now and it’s got some good advice.
In a sense it almost feels “easier” to write AD for a video than for a still image, because with video you generally have a hard limit for how long your description can be — just however long the space is between dialog — and you also oftentimes have less you have to describe if the sound design does it for you. But when you’re describing an image, you can just go on and on and on and on and on however long you find reasonable for the target audience. And so I often do.
![alt text goes here]()This doesn’t work on mobile for me! Check my comment on the OP. At least with Fennec mobile
It works the way it’s intended to work. If the text is for everyone just put it in the main text.
The correct thing to make alt text available for screen reader is between the brackets. In quotes in the parentheses is for the title, and while it can be used for screen readers it is usually only done as a last resort.
If you want to make the alt text available for non-accessibility reasons, adding it to the title will allow mouse users to hover over and see it, and for (at least some) mobile users to hold down on the image and get it (see example below), with caveats, e.g. the title gets cut off in my Android browser.Alt text can also be gotten through view source.
ⓘ This user is suspected of being a cat. Please report any suspicious behavior.
As I was saying, both is best, since I often put extra context in the alt-texts that people might want to know regardless of vision.
Extra context should go in the title, description should go in the the alt.
Getting the same text read twice isn’t great.
Using title in this way does not seem like a good idea to me. Either put context in the alt, or if its also useful for visually able people in the main text.
ⓘ This user is suspected of being a cat. Please report any suspicious behavior.
Sure. Probably best to avoid the titles.
didn’t even realize alt text was a thing on this site tbh, i have no idea how i would go about seeing it if i wanted to
On mobile, pressing and holding on an image shows me the title text, which matches the alt text set for an image post. On desktop, hovering my mouse over an image shows the title text. I can’t find an easy way to actually see the alt text if it’s not the same as the title.
on desktop the button between upvote and reply is “view source” and shows you all the markup including any alt and title text.
Haha, yeah, sorry, that wasn’t super clear, but I meant in cases where there isn’t a view source button, which on mobile is most images on the internet, and on desktop depends on whether you consider reading HTML an “easy” way to see alt text.
If we’re stickying this thread why don’t we just make it a mandatory field in submissions? Just remove the optional, maybe change “optional” to a link to a help thread showing best practices for image description in this field.
Also this actually seems like a real world use-case for AI, an app that uses AI to create descriptions for images for those with sight disabilities as and when required. The kind of genuinely positive use-case the technology ought to be implemented for. (disclaimer, i have not checked whether any of the AIs are actually good at this)
If it’s mandatory then it’ll get filled with low effort junk much of the time.
Better than no alt text, no?
Why would that be?
Making the change to mandatory would be a feature request for the toggle box and require coding. I’m happy to help anyone interested get in contact with the lemmy development team if this is something they are interested in.
Could a link to this guide be put next to the alt text box without too much extra work? Seems like the general sentiment is that people want to use the optional feature, but don’t feel like they know how.
https://uxdesign.cc/how-to-write-an-image-description-2f30d3bf5546
I think in that case it would still be some custom coding on the hexbear-ui end or submitting the code to upstream lemmy.
I didn’t know we could do this and will do it from now on
100% agree on this. This also strikes me as something that AI would actually be good at. I’d be shocked if there aren’t screen readers or other software that have an LLM built in to describe images and answer questions about them or software at least working towards that. Obviously it may not always be perfect and bespoke alt text is going to be better since the LLM might not get the gist of certain memes etc but yeah seems like a tailor made use case as opposed to the current shoehorning of AI into nearly everything without any real thought so that half the internet becomes pure slop…
I think one of the core problems of using AI is that it doesn’t know why the image is there, so even when talking about a relatively straightforward image (i.e. not some meme which requires a bunch of background knowledge) I have serious doubts that it would focus on the pertinent details even if we assume it makes no actual mistakes. Obviously, it’s nice for people to have something they can use when alt text isn’t present, but it should be a backup rather than the first line option.
Monkeys paw, every image gets “Pig with Poop on its Balls” as the alt text
Note: Why is is that this image has alt text (check the source), but when I long click it on mobile I only get the URL?
See my various posts about the title vs. alt behavior - a long press shows you the title text.
I keep forgetting to set the actual alt-text, so I appreciate the reminder—I’ll try to do better going forward. I always try to provide an image description inside a spoiler tag in the post/comment (example). This blog post (shared by @Edie@hexbear.net previously as well as in this thread) actually says
Most social media platforms these days offer an alt text option. From what I have heard from the community, it’s actually better to put the description in the caption instead. This way, it’s also visible to screen magnifier users and sighted people who might need or benefit from the description. (It’s actually unclear to me whether we should also add a full description or abbreviated version in the alt tag if we are adding to the caption. If you have thoughts or ideas about this, please reach out! Contact info at the bottom).
The secondary benefit of this approach is that it also allows for copy-pasting so that people can easily quote/re-share the content of a text post.
One thing I’m unsure about is how accessible spoiler tags are. Is it straightforward for someone using a screenreader to identify that the spoiler tag is there and expand it? I use spoiler tags just to take up less space, but if it’s an accessibility issue I’d much rather people have to scroll a bit more if the spoiler tag is a significant complication for the people who need the description the most.
