New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Ability to add alt text to images/media #117
Comments
How does Twitter let you add alt text to images? I have never encountered it. |
Twitter's implementation on the API side is kind of a rat's nest, for reference:
|
Could potentially make |
Since images are specified using This also might provide an alternate means for including content warnings for images as in #239 – instead of just “Sensitive content: click to view” the alt text for the image could be displayed instead. |
I would suggest to use |
@MichielBijl Current implementation is for using |
Here's a minimal alternate implementation that should allow you to use HTML: <a class="image-container" href="imgsrc.png">
<img class="post-image" src="imgsrc.png" alt="Example Image">
</a> CSS: *.image-container {
display: flex;
align-items: center;
justify-content: center;
max-height: 110px;
width: 100%;
overflow: hidden;
}
*.post-image {
display: block;
width: 100%;
flex: none;
} The flexbox centers the image within the container and then EDIT: Using just |
Hey all, since Mastodon has gotten way more popular lately, it'd be cool to see this become a thing so we aren't excluding blind/visually impaired people. |
Hello, I support accessibility for disabled folks. |
@Gargron I would be willing to take this on, if you are interested in the feature. |
If this was done well, it would be a huuuge bonus for Mastodon imo, especially since most sites don't have this. |
Ok, I haven't heard from @Gargron about this, but I think I'm just going to work on it anyway |
BoothWidgetのメモリリークを修正
Bumping this; it would be great to do this! Simply adding the description in the toot content itself isn't always ideal, because when there are multiple images it's harder to describe them than simply adding alt text. |
I'm interested in getting this implemented in theory, but implementing it with a bad UX would make the accessibility worse then if we hadn't implemented it all, since users wouldn't know whether to write image descriptions in the body of the toot or in the alt text. The best UX here is one that had a clear, blank form for each image you upload (with a call to action explaining that it's for a description of the image). For sure each full view should show the description, and there should also be a way to view the descriptions on an image or set of images without going into fullview, or at least an indication that descriptions exist. Maybe a little "..." superimposed over the image, or a button below the image gallery that expands to show the descriptions? @pwoolcoc are you still interested in working on this? otherwise would someone else be interested in taking this on? |
@nightpool I've got the API side of this pretty much done, but I haven't touched the UI yet. I'm getting some tests together for the API addition and then I'll probably be opening a PR for that. After that is merged I will start prototyping some UI/UX stuff. |
* Add data- attributes to statuses for userstyle selectors * use const and template string, replace reblog->boosted and favourite->favourited * more template strings because sorin-sama said so
Hello @pwoolcoc! Did you make any progress on this? |
@Sylvhem hello! sorry for the super-late reply. I've made progress but nothing to open a PR for yet. It's been summer vacation time around here so I haven't had many spare cycles for this. I have a bit of a crunch at work next week but I will try to get at least the API endpoint ready to PR this weekend. |
@pwoolcoc if you want any help with HTML/CSS let me know, can spare some time for this. |
…position Fix favourite tags lock icon position
I'd like to emphasize @nightpool's suggestion about indicating there is a description not only when adding it but when it's already posted. One of the things I really disliked on Twitter was how there is no way you could know if there is a description or not without turning the screen reader on or viewing the image info. It was a major complaint between some of my blind friends, mainly because this is a feature that was released opted out and Twitter didn't seem to publicize it as much as necessary — they even forget to use it on official accounts sometimes. So, in addition to help improve the tool's visibility for those who are not familiar, this also helps folks that are used to write descriptions to every image they boost but can't verify for sure if there's alt text or not. Another thing I noticed is how there's no way to describe images on mobile.twitter.com (that personally I like more than the desktop version and even the official app because I'm visually impaired — navigation is way better). Making this tool accessible in every way possible is a must. |
Just commenting to emphasize that a quick way to read image descriptions visually (not only check if they exists) would be great. Preferably also a setting to always display them without the need to click anything. For folks who need them despite using Mastodon visually, as I've seen some people say that this is a big issue for them with birbsite's way of doing this, the assumption that anyone who needs image descriptions for some reason will be using a screen reader anyway. |
- POST /api/v1/media accepts `description` straight away - PUT /api/v1/media/:id to update `description` (only for unattached ones) - Serialized as `name` of Document object in ActivityPub - Uploads form adjusted for better performance and description input
* Fix #117 - Add ability to specify alternative text for media attachments - POST /api/v1/media accepts `description` straight away - PUT /api/v1/media/:id to update `description` (only for unattached ones) - Serialized as `name` of Document object in ActivityPub - Uploads form adjusted for better performance and description input * Add tests * Change undo button blend mode to difference
…on#5123) * Fix mastodon#117 - Add ability to specify alternative text for media attachments - POST /api/v1/media accepts `description` straight away - PUT /api/v1/media/:id to update `description` (only for unattached ones) - Serialized as `name` of Document object in ActivityPub - Uploads form adjusted for better performance and description input * Add tests * Change undo button blend mode to difference
…on#5123) * Fix #117 - Add ability to specify alternative text for media attachments - POST /api/v1/media accepts `description` straight away - PUT /api/v1/media/:id to update `description` (only for unattached ones) - Serialized as `name` of Document object in ActivityPub - Uploads form adjusted for better performance and description input * Add tests * Change undo button blend mode to difference
fix Toot box scss
…rror ignore network error
Images must have text alternatives that describe the information or function represented by the images. This ensures that images can be used by people with various disabilities. The main technique to add alt text is via the
alt
attribute.Twitter added the ability to add alt text to images earlier this year. Something in Mastodon would be great!
Some more information on alt text:
The text was updated successfully, but these errors were encountered: