Hintergrundbilder für die eigene Homepage

Css Editor Css Editor Css Editor

In Zeiten der Röhrenfernseher und -monitore war das Standard-Bildschirmformat für PCs 4:3 – und damit nahezu quadratisch. Mit dem Erscheinen von Flachbildschirmen und Formaten wie Full HD änderte sich das Seitenverhältnis zu 16:9. Die neuen Bildschirme sind damit annähernd doppelt so breit wie hoch. Dazu kommt, dass sich auch bei den Programmiersprachen für Webseiten in den vergangenen Jahren einiges getan hat.


Beide Entwicklungen sorgten dafür, dass Hintergrundbilder bei Homepages ein extrem beliebtes Design-Element wurden. Dies ist unter anderem darauf zurückzuführen, dass der eigentliche Inhaltsbereich vieler Homepages (also dort wo sich Text und Bilder befinden) nach wie vor dem Format 4:3 ähnelt. Grund dafür wiederum ist, dass sich Texte auf einem 16:9 Bildschirm über die gesamte Bildschirmbreite hinweg nur mühsam lesen lassen. Dazu kommt, dass Homepages mit einem Inhaltsbereich im Format 4:3 auch auf alten Monitoren gut funktionieren.


Hintergrundbilder haben demnach vor allem bei sehr breiten Bildschirmen die Aufgabe, die Streifen zwischen dem eigentlichen Inhaltsbereich der Homepage und den linken und rechten Bildschirm-Rändern abzudecken. Je breiter ein Bildschirm ist, desto mehr sieht man von den Hintergrundbildern, je quadratischer der Monitor ist, desto weniger. Entscheidend ist, dass der Inhaltsbereich im Vordergrund auf jedem Monitor-Typ gut sichtbar ist. Hintergrundbilder nehmen demnach oft die Funktion eines „Lückenfüllers“ ein.


Welche Bilder eignen sich dafür?

Ein Hintergrundbild kann ein großes Foto, zum Beispiel im Format 16:9 sein. Da für das Element „Hintergrundbild“ aber etliche Anpassungsmöglichkeiten vorhanden sind, muss es weder genau in diesem Format vorliegen, noch ein Foto im eigentlichen Sinne sein.


So kann man für das Hintergrundbild zum Beispiel festlegen, ob es im Monitor statisch unverändert immer an derselben Stelle steht, oder ob es sich zusammen mit dem Inhaltsbereich auf und ab bewegt – also ob es mitscrollt. Bei der zweiten Variante kann ein Hintergrundbild also weitaus höher sein, zum Beispiel quadratisch oder ein Bild im Hochkant-Format, ganz abhängig davon, wie weit der Rest der Homepage nach unten zu scrollen ist.


Eine weitere Steuermöglichkeit für Hintergrundbilder ist die sogenannte Kachelung. Hierbei können kleine Bilder wie die Fliesen im Bad horizontal und vertikal wiederholt abgebildet werden. Bei speziellen Bildern wird hier ein optischer Trick angewandt, bei dem die rechte Kante des Bilds einen nahtlosen Übergang zu seiner linken, die untere zur oberen Kante und so weiter… bildet. Kachelt man nun solch ein Bild, entsteht eine regelmäßige Fläche ohne Kantenbildung. Dieser optische Trick lässt sich mit abstrakten Mustern genauso erreichen wie mit natürlichen, also einer Holzmaserung beispielsweise. Die Bilder müssen nur in Bildbearbeitungsprogrammen, wie zum Beispiel Adobes Photoshop, entsprechend präpariert werden. Alternativ stehen sie auch als vorgefertigtes Produkt in jedem Online Portal für Bilder zum Verkauf.


Das ideale Hintergrundbild

Bei der Frage nach dem idealen Hintergrundbild muss man zwischen zwei Anwendungsfällen unterscheiden. Einerseits gibt es Homepages, deren Textanteil sehr hoch ist. Hier ist es die Aufgabe des Hintergrundbildes, die „Textwüste“ ein wenig attraktiver zu gestalten, dabei jedoch immer so unauffällig wie möglich zu sein. Das Hintergrundbild darf auf keinen Fall beim Lesen stören. Dazu sollte es vom Motiv her möglichst ruhig und farblich so abgestimmt sein, dass die Schrift darauf gut lesbar ist.


Andererseits gibt es textlich sehr reduzierte Homepages, welche Hintergrundbilder als zusätzlichen Kommunikationskanal nutzen. Sie sind von der Gestaltung her vergleichbar mit einem Werbeplakat, bei dem die wenigen Worte des Slogans, des Firmennamens und des Firmenlogos vom Bild getragen werden. Hierzu können auch unruhige, bunte Bilder verwendet werden.


Allgemein sollte aus technischer Sicht die Dateigröße und damit die Auflösung des Bildes beachtet werden. Nicht überall ist eine gute Internet Verbindung mit hoher Bandbreite gewährleistet. Bilder in einer so hohen Auflösung zu wählen, wie sie ein 4:3-Monitor oder Smartphone-Display nur sehr begrenzt darstellen kann, ist sinnlos. Es verursacht nur unfreiwillige Komik, wenn das Hintergrundbild auf Grund seiner Größe und geringer Bandbreite erst deutlich später als der restliche Inhalt der Homepage nachgeladen und sichtbar wird. Für die Monitor-Darstellung ist die Full HD Auflösung ausreichend. Bei Homepage-Baukästen übernimmt der Baukasten die Optimierung für sämtliche Monitore, so dass man sich als Anwender darüber keine Sorgen zu machen braucht.


Bezugsquellen für Hintergrundbilder

Das Internet ist voller Bilder, es klingt also erst einmal verlockend, sich einfach selbst zu bedienen. Da kann man nur sagen: Finger weg! Das Urheberrecht gilt natürlich auch im Internet. Es gibt genügend Online Portale, bei denen man kostenlos oder kostenpflichtig Hintergrundbilder herunterladen kann. Als Suchbegriff für Google empfiehlt sich „stock photo“ – und schon wird man mit einer langen Liste an solchen Portalen versorgt. Zu den bekanntesten zählen unter anderem Fotolia, Shutterstock oder Getty Images.


Die Preise sind nach dem Anwendungsbereich der Bilder gestaffelt, denn jedes Bild ist in mehreren verschiedenen Auflösungen erhältlich. Es gibt auch mit Wasserzeichen gekennzeichnete Vorschau-Bilder, die man herunterladen und testweise in seine Homepage einbinden kann, um noch vor dem Kauf zu entscheiden, ob man mit dem Ergebnis zufrieden ist. Full HD Bilder sind bereits für ca. 2 Euro erhältlich. Allerdings haben die meisten dieser Portale eine eigene Shop Währung. Man kann als Kunde nur feste Beträge wie 5, 10 oder 20 Euro in der Hauswährung kaufen. Die entspricht dann beispielsweise 100 Credits. Ein Bild wiederum kostet vielleicht 54 Credits. Das heißt, man hat immer einen Betrag, der ungenutzt auf dem Portal Konto brachliegt. Oder es fehlen einem wieder 5 Credits, so dass man gleich 50 neue kaufen muss.


Kostenfreie Alternativen gibt es auch. So bietet etwa Pixabay Bilder, die unter der sogenannten Creative Commons Lizenz veröffentlicht wurden, auf Spendenbasis an. Wer möchte, kann bequem via Paypal dem Fotografen und dem Portal einen kleinen Obolus in die Kaffekasse werfen.


Eigene Hintergrundbilder einbinden

Nachdem man ein Hintergrundbild gekauft und auf den heimischen PC heruntergeladen hat, ist es mit einem Homepage-Baukasten ein Leichtes, dieses auch in die eigene Homepage einzufügen. Programmier-Kenntnisse sind absolut keine erforderlich.


Die Herangehensweise unterscheidet sich von Anbieter zu Anbieter nur im Detail. Die Einstellungen für das Hintergrundbild sind global, das heißt sie betreffen das Erscheinungsbild der gesamten Homepage mit all ihren Unterseiten. Deshalb findet man diese Einstellung auch an einer zentralen Stelle, die meist als „Design“, „Style“ oder ähnlich gekennzeichnet ist. Hier findet sich auch der Eintrag „Hintergrund“, in dem man das eigene Bild aus dem Baukasten heraus hochladen und anschließend verwenden kann. Das alles geht einfach und komfortabel mit der Maus.


Lorenz Graubner Erstellt von:
Lorenz Graubner
Homepage Experte
Erstellt am:
Zuletzt aktualisiert am: