Wie wandle ich ein Bild ins HTML-Format um? Ganz einfach per ASCII-Art

Ein Bild ins HTML - Format umwandeln, so dass man es nicht umständlich auf einen Image - Hoster wie imageshack.com oder ABload.de uploaden muss.
Klingt jetzt erst mal nicht einfach :)

Und seien Sie gewarnt: Im folgenden Artikel kommt ihr Browser durchaus ein wenig ins Schwitzen.

Die Lösung liegt in der Umwandlung des Bildes. Normalerweise werden Bilder auf einen File- oder Imagehoster hochgeladen und dann per

<img height="...." src="........ .png" /></img>

oder so ähnlich in den HTML - Code eingebunden. Das Problem ist der Hoster: Mal ist er offline, mal dauert das Laden ewig lange, und manchmal funktioniert's einwandfrei (hoffentlich trifft der letzte Fall am häufigsten ein ^^).

Dieses .jpg-Bild liegt auf dem Hoster Blogspot.

Es gibt jedoch eine Möglichkeit, dieses Problem zu umgehen: Es gibt Onlinetools und Software, die das Bild in Schriftzeichen umwandelt. Diese können - dank HTML - auch farbig sein. Man wandelt das Bild dann in sog. "ASCII Zeichen" um. Die Kunst, Bilder in soche Schriftzeichen umzuwandeln, nennt sich "ASCII-Art" und ist im Internet durchaus weit verbreitet.
Ein solches Tool findet sich beispielsweise auf www.picascii.com, alternativ sucht man in einer Suchmaschine nach "Picture to Ascii", um solche Software oder Onlinedienste zu finden.

Hier mal ein Beispiel, wie aus dem rechten JPEG - Bild ein HTML - Code werden kann:

#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################

Man sieht noch deutlich, dass es sich um farbige # (Rauten) handelt. Wird dieser HTMLCode jedoch verkleinert wiedergegeben, entsteht schon ein wesentlich besseres "Bild":

#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################

Schließlich noch kleiner: Bis auf die farblichen Unterschiede an manchen Stellen, welche wohl aufgrund der Blogspot Design-Vorlage bzw. dem Template auftreten, erkennt man fast nicht, dass es sich um reinen HTML-Code handelt:

#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################
#################################################################################################

Nun ja, bleibt noch zu erwähnen, dass hierbei auf den Internet - Browser bzw. den Computer eine ganze Menge Rechenarbeit zukommt. Immerhin will der html-code erstmal eingelesen und dargestellt werden.
Bei Blogspot dauert es beispielsweise ca. eine Minute bis der Post nach dem Klicken von "Post veröffentlichen" online ist. Normale Posts dauern wenn überhaupt nur ein paar Sekunden, da Bilder ja ausgelagert sind auf einem Server und im Html-Code nur wenige Zeichen zur Einbindung benötigen.