Das Lorem Ipsum ist wohl der ständige Begleiter eines jeden Webworkers. Wenn es allerdings um Bilder geht, greifen so manche Webworker zur Google Bildersuche und bekommen innerhalb kürzester Zeit eine Abmahnung durch findige Anwälte. Besser vorsorgen und direkt auf Platzhalter-Bilder setzen. Wir zeigen verschiedene Alternativen und erläutern warum es nicht nur um schöne Fotos geht sondern auch um Kundenkommunikation.

Placehold.it: Simple Boxen für den Rohbau

Placehold.it ist ein Dienst für Platzhalter-Bilder. Die Sache ist ziemlich einfach. Über den Link zur Bildquelle kann man mitgeben, welches Format das Bild haben soll, welche Farbe, usw. Das war es auch schon.

Eigene Maße mit wenigen Handgriffen

Setzt man als Bildquelle „http://placehold.it/500×100“ ein, erscheint prompt folgendes Platzhalter-Bild:

Bringen wir Farbe ins Spiel

Gut, das ist ein wenig „Plattenbau-Style“. Mit einer Anpassung der Bildquelle bringen wir aber rasch Farbe ins Spiel. Ergänzen wir den Pfad zum Bild mit „http://placehold.it/500×100/ff9000/ffffff“ wird aus dem grauen Klotz ein bunter Platzhalter:

Während die ersten Werte wieder die Maße der Box wiederspiegeln, wird der Pfad einmal um einen Hexawert für die Hintergrundfarbe (1.Wert) und einmal um einen Wert für die Schriftfarbe (2.Wert) ergänzt. Diese Farbvarianz sorgt bei näherer Betrachtung für neue Anwendungsmöglichkeiten. So könnte man in einer ersten Konzept-Phase einen „Farbcode“ mit dem Kunden ausmachen und so ganz gezielt die Farben einsetzen: Rote Boxen bitte mit Porträt-Aufnahmen ersetzen und höchster Priorität, orange Boxen bitte mit Stimmungsbildern ersetzen, ist aber weniger wichtig, usw.

Eigener Text für besseres Verständnis

Die im Bild notierten Maße und die individuellen Farben sind schon sehr praktisch. Nun ist es obendrein möglich, die Boxen mit eigenem Text auszustatten. Möchten wir unsere farbige Box also nun um einen eigenen Platzhalter-Text anreichern, ist auch das problemlos möglich:

Es reicht der Bildquelle nun einen Parameter anzuhängen: http://placehold.it/500×100/ff9000/ffffff&text=Bitte+Foto+ersetzen!

Zu beachten ist, dass erstens der Text wirklich ganz zum Schluss eingefügt werden muss, diesem zweitens „&text=“ vorangestellt wird und drittens Leerzeichen im Text mit einem Pluszeichen ersetzt werden. Damit hat der motivierte Webworker noch eine Möglichkeit mehr, direkt im Bild dem Kunden Dinge mitzuteilen. So könnte man auch im Bild direkt notieren, welches Foto genau nach einem geplanten Shooting den Platzhalter ersetzen soll.

 GIF-Hasser aufgepasst: Es geht auch anders!

Wer sich übrigens am GIF-Format stört, welches standardmäßig genutzt wird für die Platzhalter-Bilder, kann auch andere Formate wählen (warum auch immer). Neben dem GIF-Format kann man auch PNG- oder JPG-Platzhalter generieren lassen, indem man einfach die passende Dateiendung hinter die Maße notiert:

http://placehold.it/500×100.jpg/ff9000/ffffff&text=JPG+ist+nicht+optimal

Lorem Pixel: Richtige Platzhalter-Fotos für jeden Anlass

Zugegeben. Placehold.it ist einerseits simpel und genial. Mit wenigen Handgriffen lassen sich Boxen bauen, die mit individuellen Texten und Farben ausgestattet werden können. Das hat den Vorteil, dass Platzhalter auch wie Platzhalter aussehen. Dennoch ist es für viele Kunden einfacher, wenn direkt richtige Fotos zum Einsatz kommen. Das gilt besonders für Design-Websites, die sehr stark auf vernünftiges Fotomaterial ausgerichtet sind. Nehmen wir als Beispiel eine Restaurant-Website. Da kann noch soviel Farbe ins Spiel kommen. Ohne richtige Fotos, wirkt das Fullscreen-Material einfach nicht.

Lorem Pixel ist ein Online-Dienst, der genau hier ansetzt. Über die Website lorempixel.com lassen sich nach einem ähnlichen Schema Platzhalter-Bilder bauen wie bei placehold.it. Der Clou ist allerdings, dass man Themenbereiche wählen kann. Am einfachsten ist die Anwendung mit dem Placehold-Generator.

Dieser erlaubt nicht nur die Einstellung der richtigen Maße und die Auswahl des gewünschten Themengebietes. Als „Schmankerl“ obendrauf kann man zudem auswählen, ob der Platzhalter in Schwarz-Weiss oder in Farbe ausgegeben wird. Hat man einmal den Bogen raus direkt mit der Bildquelle zu arbeiten, ist man damit jedoch deutlich schneller.

Mit folgender Bildquelle wählen wir ein Bild von 400×200 Pixeln in Farbe aus dem Themenbereich „food“ für unsere Restaurant-Website aus: http://lorempixel.com/400/200/food/

Interessant ist, dass mit dieser Schreibweise die Platzhalter per Zufallsgenerator ausgegeben werden. Was in manchen Fällen interessant sein kann, könnte manche Kunden allerdings verwirren. Hängt man nun aber eine Zahl zwischen 1 und 10 an den Pfad dran, wählt man genau das gewünschte Bild: http://lorempixel.com/400/200/food/3/

Auch „Lorem Pixel“ erlaubt das Hinzufügen eines eigenen Textes (auch wenn der Text lange nicht so auffällig platziert wird wie im Falle von placehold.it). Dafür reicht es den entsprechenden Text mit Bindestrichen hinten anzuhängen: http://lorempixel.com/400/200/food/3/Bitte-ersetzen

Wer farbiges Fotomaterial nicht wünscht und die Fotos in Schwarz-Weiss ausgeben möchte, kann einfach den Pfad um einen weiteren Parameter ergänzen und /g/ notieren, allerdings bevor die Maße, Themengebiet und Fotonummer notiert werden: http://lorempixel.com/g/400/200/food/3/Bitte-ersetzen

Wer Katzen liebt, liebt Placekitten.com

Wer auf Cat-Content und Katzen im Allgemeinen steht (oder wer tatsächlich niedliche Kätzchen für einen Kunden einsetzen soll), kann auf den Dienst placekitten.com zurückgreifen. Der von placehold.it inspirierte Dienst liefert paßgenaue Katzenfotos aus. Auch hier lassen sich wie bei den eingang vorgestellten Diensten die Maße über die Bildquelle steuern.

Fazit: Platzhalter-Generatoren sind ungemein praktisch und flexibel

Startet man ein Webprojekt liegen einem die definitiven Fotos oftmals noch gar nicht vor. Dennoch ist es praktisch schnellstmöglich mit der Umsetzung einer Website beginnen zu können ohne via Google Bildersuche Fotos zu nutzen, die einem später Ärger einbringen könnten. Gerade wenn zur Entwicklung im modernen Kontext zügig in den Browser gewechselt wird, können Platzhalter-Dienste Gold wert sein. Neben der simplen Foto-Darstellung lassen sich über Farben und Texte zudem wichtige Informationen direkt in den Platzhaltern notieren, um die Kommunikation zwischen Webworker und Kunde deutlich zu vereinfachen.