placeholder.com – Platzhalterbilder für jede Situation

In der frühen Entwicklungsphase einer Website stehen die finalen Bilder selten bereit. Trotzdem soll das Layout stimmen. placeholder.com liefert Platzhalterbilder in exakt der gewünschten Größe – einfach per URL, kein Download nötig.

Funktionsweise

Die Größe wird direkt in der URL angegeben:

<img src="https://via.placeholder.com/800x400" alt="Platzhalter">

Das erzeugt ein graues Bild mit 800×400 Pixeln, auf dem die Größe als Text eingeblendet ist.

Farben und Text anpassen

Hintergrund- und Textfarbe lassen sich als Hex-Wert anhängen:

<!-- Orangefarbener Hintergrund, weißer Text -->
<img src="https://via.placeholder.com/400x300/f49a00/ffffff" alt="">

<!-- Mit eigenem Text -->
<img src="https://via.placeholder.com/400x300?text=Titelbild+fehlt" alt="">

Quadratische und spezielle Formate

<!-- Quadrat -->
<img src="https://via.placeholder.com/300" alt="">

<!-- Typisches Teaser-Format 16:9 -->
<img src="https://via.placeholder.com/1280x720" alt="">

Im Entwickleralltag

Besonders praktisch ist der Ansatz, Platzhalter direkt im Template zu hinterlegen und sie mit einer Bedingung zu steuern:

<img src="{{ image.url ?: 'https://via.placeholder.com/800x400' }}" alt="{{ image.alt }}">

So hat man immer ein sauber proportioniertes Bild im Layout – auch wenn die echten Assets noch fehlen. Und beim Go-live wird einfach die Platzhalter-URL durch die finale Bild-URL ersetzt.

Alternativen

picsum.photos liefert echte (zufällige) Fotos als Platzhalter – schöner im Gesamteindruck, aber weniger kontrollierbar. Für technische Layouts bleibt placeholder.com die klarere Wahl.

→ placeholder.com aufrufen