unsplash.it – Placeholder für die Webentwicklung

Quelle: Unsplash.it: Use Placeholder Photos From Unsplash.com

Unsplash.it: Platzhalterbilder einfach eingebunden

Wer in den letzten ein bis zwei Jahren nicht hinter dem Mond gelebt hat, kennt Unsplash.com – dort gibt es alle zehn Tage zehn neue, frei nutzbare Fotos. Der Zusatzdienst Unsplash.it erlaubt nun, diese Bilder als Platzhalter in Webprojekten einzubinden – einfach, bequem und mit frei wählbarer Auflösung. Weitere Funktionen machen den Dienst noch interessanter. Ein Überblick.

Einfache Syntax für individuelle Einbindung

Mehr als 700 Fotos stehen derzeit zur Auswahl. Um eines davon zu nutzen, reicht eine einfache URL. Ohne Zusatzparameter wird das Bild automatisch skaliert:

https://unsplash.it/640/425

Dieses Beispiel zeigt ein beliebiges Bild in der Größe 640 × 425 Pixel. Das Seitenverhältnis wird angepasst, das Bild bei Bedarf automatisch beschnitten. Für quadratische Formate genügt eine Angabe:

https://unsplash.it/640

Mit dem Parameter gravity lässt sich steuern, an welchen Rändern das Bild beschnitten wird. Der Wert east sorgt etwa dafür, dass der rechte Bildrand erhalten bleibt. Möglich sind alle vier Himmelsrichtungen – hilfreich, wenn der Fokus des Bildes nicht in der Mitte liegt.

Zufällige Bilder anzeigen

Wer wechselnde Bilder bevorzugt, hängt einfach den Parameter random an:

https://unsplash.it/640/425?random

Gezielt ein bestimmtes Bild wählen

Nicht immer sind Zufallsbilder gewünscht. Mit Hilfe der Bild-ID kann gezielt ein bestimmtes Foto eingebunden werden. Diese ID findet sich in einer Liste aller verfügbaren Bilder. Die Syntax:

https://unsplash.it/640/425?image=40

Die Auswahl ist vielfältig: Architektur, Natur, Alltag, Geschäftswelt. Die Motive sind allgemein gehalten und eignen sich gut als Platzhalter.

Grau und weichgezeichnet

Zwei Effekte lassen sich automatisch anwenden: Graustufen und Unschärfe.

Graustufen aktiviert man mit einem g/ vor den Maßen:

https://unsplash.it/g/640/425

Unschärfe wird durch den Parameter blur erreicht:

https://unsplash.it/640/425?blur

Beide Effekte lassen sich kombinieren.

Bilder als JSON-Liste

Alle verfügbaren Fotos stehen auch als JSON-Objekt bereit – inklusive Fotografenname, Auflösung und URL. Damit lässt sich ein eigenes Skript zur Bildauswahl schreiben.

Fazit

Unsplash.com stellt seine Bilder kostenlos und ohne Einschränkungen zur Verfügung – auch als Platzhalter. Dank der klaren Lizenzierung ist die Einbindung über Unsplash.it nicht nur technisch, sondern auch rechtlich unkompliziert.