Export translations

Settings

Group

Language

Format

Export for off-line translation

Export in native format

Export in CSV format

Unlike microblogging-centric {{Internal link |target=Fediverse |link-name=Fediverse}} {{Internal link |target=Fediverse projects |link-name=projects}}, <languages/>
<div lang="en" dir="ltr" class="mw-content-ltr">
{{Internal link |target=Friendica |link-name=Friendica}}, {{Internal link |target=Hubzilla}}, {{Internal link |target=What is (streams)? |link-name=(streams)}} and {{Internal link |target=Forte |link-name=Forte}} don't have dedicated entry fields for {{Internal link |target=Draft:Captions |link-name=alt-text for images}} in their post entry masks.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
It's still possible to add alt-text to images on all four. But since they're deeply rooted in long-form blogging, this requires manually touching markup code on Friendica and Hubzilla, and it may require touching markup code on (streams) and Forte.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
What all four have in common is that they embed images within the post text just like a blogging engine. Some projects like {{Internal link |target=Mastodon |link-name=Mastodon}} don't support this, so all four make copies of embedded images as file attachments for Fediverse projects that don't support inline images. The images keep their alt-texts in the process.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
In any case, it is strongly recommended to write the alt-text ''before'' uploading and embedding an image.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
== Limitation in length ==
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
All four don't have defined character limits for their posts. Since they embed alt-text into the post text code, the length of alt-text is unlimited, too, technically speaking.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
However, Mastodon, {{Internal link |target=What is Misskey? |link-name=Misskey}} and their respective forks have hard limits of 1,500 characters for alt-texts which, unlike their character limits for posts, are enforced on alt-texts from outside as well. Alt-texts that exceed 1,500 characters are truncated at the 1,500-character mark, and everything that goes beyond is discarded. This won't affect your original post, only the way it's displayed on instances of these projects.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
But even if you're on Hubzilla or (streams), and you've got ActivityPub off so that neither of these projects can connect to your channel, your alt-texts shouldn't be significantly longer than this. This is because the Web interfaces of Hubzilla and (streams) can only show so much alt-text at once in the pop-up window, depending on device, browser, screen resolution, font size etc. And the alt-text in the pop-up window cannot be scrolled; trying to do so will close the pop-up window.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
Generally speaking, alt-text shouldn't grow too long. That's simply because a screen reader can read alt-text, but it can't navigate alt-text. It isn't possible to jump back to a certain point within an alt-text and have part of it re-read. It is only possible to jump back to the beginning of the alt-text and have all of it re-read. The longer an alt-text is, the more tedious this becomes.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
=== Adding alt-text on Friendica ===
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
The standard way of adding images to a new post on Friendica is by using the post editor to upload the image to the file space built into your account. Friendica will automatically generate image-embedding code at the end of the post draft.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
Alternatively, the image can be uploaded to the file space manually which give you control over where exactly it is stored. In this case, however, the image-embedding code will have to be written manually.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
This is what the image-embedding code normally looks like and how it's automatically generated when uploading an image using the post editor:
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
<code>
[img]https://<Image file URL>[/img]
</code>
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
Alt-text must be put between the <code>[img][/img]</code> tags. However, this is where the image file URL is.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
So the first step is to cut the image file URL from its usual place between <code>[img]</code> and <code>[/img]</code> and paste it into the <code>[img]</code> tag. If there is already a size specified in the <code>[img]</code> tag at which the image is to be shown, e.g. <code>[img=480x320]</code>, the size must be overwritten.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
After the first step, the image-embedding code must look like this:
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
<code>
[img=https://<Image file URL>][/img]
</code>
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
The second and final step is to put the alt-text between the <code>[img]</code> tag and the <code>[/img]</code> tags.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
<code>
[img=https://<Image file URL>]<Alt-text>[/img]
</code>
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
=== Adding alt-text on Hubzilla ===
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
On Hubzilla, the handling of alt-text in code is similar to Friendica, but the handling of images before that is different.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
Images can be attached to Hubzilla posts, just like on Mastodon. But then they won't be embedded into the post, just like on Mastodon. And unlike on Mastodon, you won't have any means to add alt-text to them. The alt-text will be the file name.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
If you want to add alt-text to images on Hubzilla, you'll first have to upload them to the file space built into your channel using the Photos app so that Hubzilla recognises them as image files and handles them accordingly. Like on Friendica, this comes with the advantage of being able to choose an album which to add the image to. Afterwards, you can embed the image into the post draft.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
This gives you image-embedding code like this:
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
<code>
[zrl=https://<Image page URL>][zmg=<Max. image size>]https://<Image file URL>[/zmg][/zrl]
</code>
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
From here on, there aren't many differences to how alt-text is handled on Friendica, only that Hubzilla adds a link to a page within the channel where the image can be viewed, and Hubzilla uses special tags that support its access and permission control system.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
Now there are two ways of handling alt-text in Hubzilla. One is to move the image file URL into the <code>[zmg]</code> tag, replace the maximum image size with it and put the alt-text between the <code>[zmg]</code> tag and the <code>[/zmg]</code> tag where the image file URL used to be.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
An easier and more flexible way is to make the alt-text an extra parameter in the <code>[zmg]</code> tag that starts with <code>title=</code>. The maximum image size can be defined in various ways or omitted.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
<code>
[zrl=https://<Image page URL>][zmg=https://<Image file URL>]<Alt-text>[/zmg][/zrl]
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
[zrl=https://<Image page URL>][zmg=<Max. image size> title="<Alt-text>]https://<Image file URL>[/zmg][/zrl]
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
[zrl=https://<Image page URL>][zmg="<Max. image size>" title="<Alt-text>]https://<Image file URL>[/zmg][/zrl]
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
[zrl=https://<Image page URL>][zmg width="<Max. image width>" title="<Alt-text>]https://<Image file URL>[/zmg][/zrl]
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
[zrl=https://<Image page URL>][zmg height="<Max. image height>" title="<Alt-text>]https://<Image file URL>[/zmg][/zrl]
</code>
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
If no image size, width or height is specified, the maximum image size is defined by the additional digit at the end of the image file URL. No digit and <code>-0</code> allow for the original image size to be shown if there is enough space. <code>-1</code> limits the width to 1024 pixels, <code>-2</code> limits it to 640 pixels, <code>-2</code> limits it to 320 pixels. And if both width and height are specified as parameters, Hubzilla changes the aspect ratio and distorts the image.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
=== Adding alt-text on (streams) and Forte ===
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
Similarly to Hubzilla, adding alt-text to an image on (streams) or Forte starts with uploading it using the Photos app. Again, this allows you to choose into which album you want to upload an image.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
The big difference to Hubzilla is that what is put into the description field will be used as alt-text when embedding the image. So unlike Friendica and Hubzilla, (streams) and Forte ''do'' have an alt-text entry field, just not as part of the post editor.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
So before uploading the image, the first step is to add the alt-text for the image to the description field. Then you can upload the image.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
The next step is to go to your channel page or your stream page and use the file attachment button to embed the image into your post draft.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
Regardless of whether or not your channel supports decentralised IDs, the image-embedding code will look like this:
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
<code>
[zrl=https://<Image page URL>][zmg alt="<Alt-text>"]https://<Image file URL>[/zmg][/zrl]
</code>
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
The most important difference is that (streams) and Forte have an <code>alt=</code> parameter for alt-text whereas Hubzilla has a <code>title=</code> parameter.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
If you have accidentally uploaded an image without adding an alt-ext first, it is embedded with its original file name as its alt-text.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
<code>
[zrl=https://<Image page URL>][zmg alt="<Original image file name>"]https://<Image file URL>[/zmg][/zrl]
</code>
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
You can safely edit the file name out and replace it with an actual alt-text as shown above.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
Other than the <code>alt=</code> parameter instead of the <code>title=</code> parameter, image size handling is slightly different: (streams) and Forte completely ignore the defined image height, also to keep the aspect ratio intact. It can be specified, but it won't have any effect.
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
<code>
[zrl=https://<Image page URL>][zmg=<Defined image size> alt="<Alt-text>"]https://<Image file URL>[/zmg][/zrl]
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
[zrl=https://<Image page URL>][zmg="<Defined image size>" alt="<Alt-text>"]https://<Image file URL>[/zmg][/zrl]
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
[zrl=https://<Image page URL>][zmg width="<Defined image width>" alt="<Alt-text>"]https://<Image file URL>[/zmg][/zrl]
</code>
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
==== Markdown and HTML ====
</div>

<div lang="en" dir="ltr" class="mw-content-ltr">
(streams) and Forte also support Markdown and HTML in their posts and comments next to BBcode. But while it's theoretically possible to embed images using Markdown or HTML, neither supports the permissions and identity system like the special BBcode tags <code>[zrl][zmg][/zmg][/zrl]</code>; thus, embedding images using Markdown or HTML is not recommended.
</div>

{{Navbar}}
{{Category |category=Friendica}}
{{Category |category=Hubzilla}}
{{Category |category=(streams)}}
{{Category |category=Forte}}
{{category |category=Usage}}