Gut gebettet
Mit Daten-URLs Bilder und andere Daten in Textdokumente integrieren
Mal eben schnell ein Bildchen in HTML oder Markdown einbauen? Am besten noch, ohne eine separate Datei verlinken zu müssen? Kein Problem, dafür gibt es Daten-URLs. Außerdem können Sie damit prima Programmabläufe verschleiern. Wir zeigen, wie das geht.
Angenommen, Sie verfassen ein Dokument in Markdown, das nicht nur Text, sondern auch Bilder enthalten soll. Typischerweise verlinken Sie Bilder in Markdown mit einer Anweisung wie . Falls Sie ein solches Dokument versenden wollen, müssen Sie sicherstellen, dass Sie auch alle darin erwähnten Bilder mitschicken. Hören Sie schon das genervte „Anhang vergessen?“ des Empfängers? Vielleicht pflegen Sie aber auch eine Webseite, die kleine Bildelemente wie Logos enthält. Wenn Sie die alle per <img src="..."> oder per CSS-Attribut (etwa background-image: url(...)) ins Dokument eingebaut haben, verlängert das die Ladezeit der Seite mitunter drastisch.
In beiden Fällen können Sie sich mit sogenannten „Data URLs“ behelfen. Statt den Dateinamen oder eine mit https:// beginnende URL als Bildquelle anzugeben, verwenden Sie einfach eine Daten-URL, zum Beispiel wie folgt in HTML:
