JavaScript Data-Url Generator

Drag & Drop
Ziehen Sie die Bild- oder Mediendateien ins Fenster
oder Durchsuchen...

Was ist eine Data-Url?

wikipedia logo

Für Einsteiger

Wikipedia erklärt die Webbrowser-Unterstützung und Formate von Data-Urls sowie Vor- und Nachteile bei der Nutzung von der Data-Url.
Interessante Beispiele wie die einbettung in HTML, CSS und JavaScript, bis hin zum eigenen Data-Url Generator in PHP.

https://de.wikipedia.org/wiki/Data-URL
wikipedia logo

Was ist eine Data-Url für Webseiten-Entwickler

Syntax, Format, Spezifikationen und Browserkompatibilität, auf der Mozilla Developer Webseite finden Sie technische erklärung zu Data-Urls.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs

Tip und Tricks

Wie funktioniert der Generator und was passiert mit meinen Daten?

Mit Ihren Daten und Datein passiert nix! Die generierung der Data Url wird mit Standards von modernen WebBrowsern generiert. (https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL)
Das bedeutet Ihre Daten verlassen Ihren Computer nicht! Kontrollieren können Sie diese ganz einfach über die Dev-Tools z.B.: Chrome: https://developers.google.com/web/tools/chrome-devtools/network-performance/