💾 Archived View for m0yng.uk › Image-descriptions-on-the-Fediverse captured on 2022-04-28 at 17:40:40. Gemini links have been rewritten to link to archived content

-=-=-=-=-=-=-

Image descriptions on the Fediverse - M0YNG.uk

Modified 2022-04-26

Do you use Mastodon or another bit of the Fediverse? Maybe someone asked you to "caption your image" or "add a text description" or "use alt text" and you're not sure what that is, or how.

This page is here to help!

! This is a work in progress in collaboration with with FediTips[1] !

1: https://mstdn.social/@feditips

[TOC]

What is a "Text Description"?

A text description or caption is exactly what it says it is, a description of an image written as text.

For example this image could be described as "Alex the mastodon.radio mascot. They are a light brown mastodon with floofy hair. They are holding a portable radio in one hoof and have a blue satchel bag over their shoulder"

It's alex, as described above [IMG]

It's also known as "alt text" or "alternative text" and you might see this term on Twitter, the official mastodon app, and more technical documents.

Why do I care?

Maybe you've never thought about this, but not everyone can see the images you share. That's ok, most people haven't thought about it!

But... not everyone can see the images you share.

Maybe they are blind, and use software (called a Screen Reader) to tell them what is on the screen. Maybe they are on a slow connection and have turned images off to make things load faster, or the images failed to download because they went in a tunnel. Some people even use mastodon from the command line, meaning they can only see text.

By describing the images you post you are ensuring everyone can enjoy them, even if they can't see them!

It can also help people understand the joke, or know what to look for in the image.

How to write a good one

This can be hard! But you can get better with practice and feedback.

Think about what the image is trying to convey. Using Alex as an example, I mention that they are a mastodon, what colour they are, and what they are holding. I don't mention the background, or exactly how tall they are.

If the image has text in it then you need to copy that out, otherwise people will have no idea what it says! Plus this makes it easier for people to translate the text if they need to.

You don't normally need to say it's an image, the software will tell the user that, and they can often guess! You might way to say what kind of image, for example if it's a paining, or an AI generated digital image, or a sculpture (but you don't need to say it's a photo of a sculpture.)

If you're still not sure, think about what made you want to share the image. Is it a golden sunset over rolling hills? Maybe the V of geese flying in front of the sun? Is there a funny scarecrow in the field?

Describing selfies and photos of people can be very hard.

For example, this photo from The Gender Spectrum Collection[2] comes with the description "A transmasculine person in a winter coat on the sidewalk".

2: https://genderphotos.vice.com/

The photo described above [IMG]

But we could add more detail if it's relevant. For example we could say "A black transmasculine person smiling at the camera. They are wearing round glasses with their hair tied back, and a shiny fur trimmed coat."

If you are describing someone else, it's always best to ask them how they would like to be identified and described!

Maybe you have heard that "One picture is worth ten thousand words" but you don't have to write that much to describe most images!

Website and alternative interfaces

Mastodon web

1. Add your image

2. Click "✏️ Edit" in the top right

mastodon web UI with the edit button [IMG]

3. Type in the box "Describe for the visually impaired"

mastodon web UI with an empty description box [IMG]

4. Click "Apply"

Viewing is harder - you need to hover your mouse over the image and wait for a tooltip to appear.

Pinafore

1. Add your image

2. Fill in the box that says "Description"

pinafore showing the image and a big description box [IMG]

Viewing is harder - you need to hover your mouse over the image and wait for a tooltip to appear.

Brutaldon

1. Find the "Complete toot form" option

Brutaldon has a small icon to find [IMG]

2. Fill in the "Describe attachment" field

Brutaldon with more options and a file uploaded with description filled in [IMG]

Viewing is harder - you need to hover your mouse over the image and wait for a tooltip to appear.

Halcyon

1. Add your image

2. Click on the ✏️ icon in the top left

Halcyon with a small pencil icon to find [IMG]

3. Fill in your description and click "✔️ Save"

Halcyon asking you to describe the picture [IMG]

Cuckoo+

I can't see how to add an image description using Cuckoo+

Android Apps

Tusky

1. Add your image

2. Tap the "A✔️" button in the bottom right of the image preview

Tusky with image attached [IMG]

3. Select "Set caption"

Tusky asking what to do with the image [IMG]

4. Fill in the box "Describe for visually impaired" and tap "OK"

Tusky showing the image and a description being written [IMG]

5. Notice the "A✔️" button is now blue!

Tusky with image attached and a blue button [IMG]

When viewing an image the description is shown at the bottom and can be pulled open to see it all.

Subway Tooter

1. Add your image

2. Tap the image

3. Select "set descriptions (Mastodon 2.0+)

Subway Tooter showing the image and options [IMG]

4. Fill in the box "attachment description" and tap "OK"

Subway Tooter description box being filled in [IMG]

When viewing a toot with a described image the description will be shown below the image.

Fedilab

1. Add your image

2. Tap on the image (note the red background)

Fedilab showing a red background on the image preview [IMG]

3. Fill in the description and tap "VALIDATE"

Fedilab showing a darkened version of the image and a box for the description [IMG]

4. Notice the image preview now has a green background

Fedilab showing a green background on the image preview [IMG]

When viewing an image the description is shown at the bottom.

Twidere

1. Add your image

2. Tap the pencil icon in the bottom right

Twidere showing the small pencil icon [IMG]

3. Tap "Edit description"

Twidere menu of one thing [IMG]

4. Type in your description and tap "OK"

Twidere with a description filled in [IMG]

It doesn't seem possible to view the description

Mastodon "Official"

1. Add your image

2. Tap "Add image description..."

Mastodon app prompting for a description [IMG]

3. Fill in the box and tap "Save"

Mastodon app with an edit box [IMG]

4. Notice the description now being shown under the image preview

Mastodon app showing the description and image preview [IMG]

It doesn't seem possible to view the description.

Apple Apps

TODO!

Desktop Apps

Hyperspace

1. Add your image

2. Fill in the description at the bottom of the image preview

Hyperspace asking for a description of Alex [IMG]

Sengi

1. Add your image

2. Hover over the preview

3. Type into the box that says "Describe for the visually impaired"

Sengi showing a box over an image preview [IMG]

Whalebird

1. Add your image

2. Fill in the "Describe for the visually impaired" bit

Whalebird showing placeholder text over an image preview [IMG]

Tootle

1. Add your image

2. Fill in the "Describe for the visually impaired" bit

Tootle showing placeholder text in a form field [IMG]

View descriptions by hovering over and waiting for the tooltip.

-+--+--+--+--+--+--+--+--+--+--+--+--+--+--+--+-

🖤 Black Lives Matter

💙🤍💜 Trans Rights are Human Rights

❤️🧡💛💚💙💜 Love is Love

Code snippets are licenced under the Hippocratic License 3.0 (or later.)

Page generated 2022-04-27 by Complex 19