*Wie kann man auf Steemit oder Busy.org die Bilder verlinken, damit die Leser mit einem Klick zu der größeren Ausgabe des Bildes oder zu einer anderen Quelle gelangen können?*

------

[![Platzhalter-Bild](https://res.cloudinary.com/hpiynhbhq/image/upload/v1516885903/oootm9ifl1e8rrrt5jel.png)](https://steemitimages.com/0x0/https://res.cloudinary.com/hpiynhbhq/image/upload/v1516885903/oootm9ifl1e8rrrt5jel.png)

Der Editor auf Steemit unterstützt zwei Modi. Zum einen kann man auf den Editors mit den Buttons zurückgreifen, dann ist man im HTML-Modus und kann auf einige HTML-Tags zurückgreifen oder man kann alternativ im Markdown-Modus Inhalte einpflegen, was aber nicht sonderlich komfortabel ist, da die Editor-Buttons fehlen. Das ist auch einer der Gründe warum viele Nutzer die Inhalte via Busy.org einfügen.

## Bilder via HTML einfügen

Nach folgendem Muster bzw. "Formel" werden die Bilder in [HTML](https://de.wikipedia.org/wiki/Hypertext_Markup_Language) verlinkt:

`<a href="[Adresse des Verweises]"><img src="[Adresse des Bildes]" width="xyz" height="xyz" alt="alt-Text"></a>` 

Das `a`-Element ist zuständig für die Verlinkung und dort kommt die Adresse (url) der Quelle au die verwiesen werden soll. Innerhalb von `img` wird die Adresse des Bildes, der Inhalt des `alt`-Attributs und duch die Maße des Bildes ausgegeben. 

### Das `alt`-Attribut

Der Inhalt des `alt`-Attributs also der Alternativ-Text ist aus zwei Gründen wichtig. Er wird dann ausgegeben, wenn aus welchen Gründen auch immer das Bild nicht geladen wird und es ist relevant für Suchmaschinen und die Vorlese-Software. Daher empfiehlt es sich, dass der `alt`-Text ein kurze Beschreibung des Bildes beinhaltet. Dienst das Bild lediglich dem Design, dann bleibt der Inhalt des `alt`-Attributs leer: `alt=""`

Die Maße bei den Bildern sind nicht zwingend notwendig, so dass man es auch in etwas kürzerer Form eingeben kann:

`<a href="[Adresse des Verweises]"><img src="[Adresse des Bildes]" alt="alt-Text"></a>`

Und so schaut es im Beispiel des oberen Platzhalterbildes im Quelltext aus:

`<a href="https://steemitimages.com/0x0/[...].png"><img src="https://steemitimages.com/0x0/[...].png" alt="Platzhalter-Bild"></a>`
[*Quelltext-Beispiel auf das notwendige gekürzt `[...]`*]

## Bilder via Markdown einfügen

Nun kommen wir zu [Markdown](https://de.wikipedia.org/wiki/Markdown), welches vor allem für Anfänger doch etwas einfacher sein sollte, was auch eine der Absichten dahinter ist. Markodown ist wie HTML eine Auszeichnungssprache. Hierbei werden allerdings im Hintergrund deine Markdown-Eingaben in HTML "übersetzt".

Die Bilder in Markdown, werden nach dem folgenden Muster eingegeben:

`[![alt-Text](Adresse des Bildes)](Adresse des Ziels)`

Und so schaut es im Beispiel des oberen Platzhalterbildes im Editor aus:

`[![Platzhalter-Bild](https://res.cloudinary.com/[...].png)](https://steemitimages.com/0x0/[...].png)`
[*Beispiel auf das notwendige gekürzt `[...]`*]

Alles klar? Wenn nicht, einfach einen Kommentar abgeben.

Einige Kommentare gab es bereits [im ursprünglichen Artikel](https://steemit.com/deutsch/@vladimir-simovic/bilder-verlinken-in-html-oder-markdown#comments).