So gibt das Hintergrundbild eurer Seite den richtigen Pep

Habt ihr schon mal überlegt, was den ersten Eindruck von eurer Website am stärksten prägt? Tatsächlich ist es nicht der Inhalt, sondern das Hintergrundbild. Es zieht sofort alle Blicke auf sich und entscheidet so maßgeblich darüber, ob jemand auf eurer Webseite bleibt oder gleich weiterzieht. Grund genug, ihm ein wenig Aufmerksamkeit zu schenken.

Einen Hintergrund zu gestalten, der Lust auf mehr macht, ist gar nicht schwer. Die wichtigsten Punkte und ein paar Extra-Tipps haben wir euch in diesem Artikel zusammengestellt. Schaut rein und klickt euch durch – denn wie heißt es so schön: „Für den ersten Eindruck gibt es keine zweite Chance“ ;)


Mit Gefühl: Eine Verbindung zum Besucher aufbauen

Bevor wir uns wie versprochen dem Hintergrund zuwenden, machen wir einen kurzen Ausflug in die Welt der Werbung: Der Social-Media-Vermarkter Unruly hat ein Ranking der meistgeteilten Werbespots 2016 erstellt, das uns nützlich sein kann. Warum? Es verdeutlicht, dass alle erfolgreichen Clips etwas gemeinsam haben: Sie wecken Emotionen. Im Marketing wird dieser Schachzug gern genutzt, um Kunden anzuziehen. Und euch kann er dabei helfen, das optimale Hintergrundbild für eure Website zu finden.

Bestimmt fällt euch ein Motiv ein, das mit eurem Angebot oder Blog in Verbindung steht und beim Besucher ein gutes Gefühl auslöst oder eine emotionale Verbindung zu eurer Marke herstellt. Ein Beispiel: Wenn ihr einen Reiseblog erstellen möchtet, wählt ein Bild von einem wunderbaren Ort, den ihr besucht habt – wahrscheinlich wird der Besucher sofort die Koffer packen wollen. Auch ein Bild, das eine Bewegung zeigt oder eine spannende Perspektive einnimmt, kann aus einem simplen Hintergrund etwas Besonderes machen.

Das Hintergrundbild bietet die Möglichkeit, euer Produkt, eurer Geschäft oder euch selbst im besten Licht zu präsentieren. Und keine Panik, wenn ihr euch nicht entscheiden könnt: Mit der Option Wechselbild könnt ihr bis zu 25 Bilder einbinden, die nacheinander in Dauerschleife gezeigt werden.

Macht was her: Das Hintergrundbild dieses Reiseblogs vermittelt direkt Urlaubsstimmung.

Hochwertige Bilder: runterladen oder einfach selber machen

Hochauflösende Bilder lassen eure Website glänzen. Ihr braucht aber kein Profi-Fotograf zu sein, um ein tolles Hintergrundbild für eure Website zu bekommen. Denn: Zum Glück gibt es viele Stockfoto-Dienste, die kostenlos qualitativ hochwertige Bilder anbieten.

Wer lieber ein Foto seines eigenen Produkts als Hintergrundbild einbinden möchte, aber kein Budget für einen Fotografen hat, kann mit unser Anleitung kinderleicht selbst eine professionelle Fotobox bauen. Da sieht man, dass kleine Kniffe einen großen Unterschied machen können.

In beiden Fällen gilt: Jedes Bild hat ein ideales Format. Falls ihr euch nicht sicher seid, ob sich in eurem Fall ein JPG oder ein PNG besser eignet, könnt ihr es hier herausfinden.

Profi-Tipp: Euer gewünschtes Hintergrundbild ist zu groß geraten? Mit den kostenlosen Tools TinyPNG und TinyJPG könnt ihr es ohne sichtbaren Qualitätsverlust komprimieren.

 

Auf die Größe kommt es an: Die richtige Auflösung wählen

Kommen wir nun zu einer weiteren simplen Maßnahme, die oft vernachlässigt wird: die passende Größe für das Hintergrundbild festzulegen. Das ist super wichtig, um eurer Seite ein professionelles Erscheinungsbild zu geben.

Am besten schneidet ihr das Bild zunächst so zu, dass nichts mehr darauf zu sehen ist, was von eurem Produkt, der Person oder dem Reiseziel ablenkt. Damit richtet ihr das Augenmerk des Betrachters nur auf das, worauf es euch ankommt. In den meisten Fällen sind Landschaftsbilder besser für den Hintergrund geeignet als Porträts.

Die geringste Auflösung liegt bei den meisten Monitoren bei 1024×768 Pixeln. Wir empfehlen euch deshalb ein Hintergrundbild mit um die 2000 Pixeln, damit seid ihr auf der sicheren Seite. Hat das Bild eine zu geringe Auflösung, sieht es schnell verpixelt oder verschwommen aus.

Hochwertige Portraits vermitteln die „menschliche Seite“ einer Marke oder eures Projekts.

Wichtig ist es jetzt noch, den Hintergrund bei den meistgenutzten Browsern wie Google Chrome und Firefox sowie auf allen mobilen Geräten zu checken – so geht ihr sicher, dass er überall richtig angezeigt wird.

Profi-Tipp: Ihr seid euch nicht sicher, wie viele Pixel euer Bild hat? Beim PC könnt ihr das ganz einfach herausfinden, indem ihr mit der rechten Maustaste auf den Dateinamen klickt und dann auf „Eigenschaften“ und den Reiter „Zusammenfassung“[CM1] geht. Beim Mac funktioniert es mit einem Rechtsklick auf die Datei und den Optionen „Informationen“ und „Weitere Informationen“.

 

Der Blick aufs Wesentliche: Den Fokuspunkt bestimmen

Der Fokus eures Hintergrundbildes ist wichtig, um die Aufmerksamkeit des Betrachters genau dorthin zu lenken, wo ihr sie haben möchtet. Das kann euer Produkt, aber auch ein anderes interessantes Detail sein. Dafür bietet euch Jimdo die ideale Funktion: Mit dem Fokuspunkt richtet ihr das Bild im Hintergrund ideal nach euren Wünsche aus – und so, dass nichts Wichtiges vom Text oder der Navigation verdeckt wird.

Um den Fokuspunkt zu verschieben, klickt ihr im Menü auf Design und wählt Hintergrund. Hier wählt ihr ein Bild aus und seht einen weißen Kreis, der den Fokuspunkt kennzeichnet. Indem ihr ihn verschiebt, lenkt ihr den Blick des Betrachters auf die gewünschte Stelle im Bild. Das funktioniert bei allen Bildern und auch bei Wechselbildern – ganz ohne Photoshop oder andere Extra-Tools.

Übrigens: Kürzlich haben wir die Buttons „pausieren“ und „fortsetzen“ bei den Wechselbildern hinzugefügt. Damit könnt ihr nun den Fokus bei jedem einzelnen Bild verschieben, das Ergebnis in der Vorschau ansehen und es speichern, wenn es euch gefällt.

Mit dem Fokuspunkt bestimmt ihr die Ausrichtung eures Hintergrundbilds.

Mit dem Fokuspunkt bestimmt ihr die Ausrichtung eures Hintergrundbilds.

Immer in Bewegung: Video als Hintergrund

Eine kleine Warnung vorweg: Ein Video als Hintergrund kann zwar eindrucksvoll sein, birgt aber auch die Gefahr, von der Website abzulenken. Probiert es einfach einmal aus. Ratsam sind zum Beispiel Videos, die nicht zu viel Bewegung enthalten, so wie in diesem Beispiel.

Jimdo Hintergrund Video

Um eurer Webseite ein Video hinzuzufügen, sucht ihr euch einfach eines auf YouTube oder Vimeo aus. Oder ihr nehmt einen lizenzfreien Clip von Seiten wie Pond5 oder AllTheFreeStock.

Die Designs Stockholm und San Francisco eignen sich übrigens besonders gut, um den Effekt eines Videos im Hintergrunds voll auszukosten. Beim Design Stockholm ist das Hintergrundbild auf der Startseite als Vollbild zu sehen und auf den Unterseiten in der Kopfzeile, sodass es die Inhalte nicht „erschlägt“.

Profi-Tipp: Haltet euer Video möglichst kurz. Jimdo zeigt es automatisch in Dauerschleife, sodass es nicht plötzlich vorbei ist.

 

Klare Sache: Wann eine einheitliche Hintergrundfarbe empfehlenswert ist

Für alle, die mit Fotografie oder Videos nicht so viel am Hut haben, gibt es aber auch noch etliche andere Möglichkeiten, den Hintergrund zu gestalten. Probiert es doch mal mit einer plakativen, einheitlichen Farbfläche, auf der ihr ein originelles Statement platziert.
Checkt aber vorab, ob die ausgewählte Farbe zu eurer Branche passt und den Eindruck vermittelt, den ihr euch für euer Angebot wünscht.

Die Agentur unger music nutzt ein knalliges Orange, das ihrem Auftritt etwas Frisches und gleichzeitig Seriöses gibt.

Die Agentur unger music nutzt ein knalliges Orange, das ihrem Auftritt etwas Frisches und gleichzeitig Seriöses gibt.

Der Hintergrund kann aber auch die Sichtbarkeit des Textes beeinflussen. Wenn ihr möchtet, dass der Besucher sich wirklich auf die Inhalte konzentriert, funktioniert ein schlichter weißer Hintergrund am besten und gibt einen eleganten Look – super z. B. für Unternehmen, die einen seriösen Auftritt erzeugen möchten.

Profi-Tipp: Ihr habt Lust, was Rustikaleres auszuprobieren? Dann experimentiert doch mal mit einem strukturierten Hintergrund wie zum Beispiel Holz oder Ziegelsteinen herum.

Ihr seht: Die Wirkung eines eindrucksvollen Hintergrunds ist nicht zu unterschätzen. Am besten probiert ihr ein wenig herum und tastet euch so an genau den Hintergrund heran, der optimal zu euch und eurem Projekt passt. Es lohnt sich kreativ zu werden – eure Besucher werden es euch danken!


Habt ihr einen tollen Hintergrund, den ihr mit uns teilen möchtet? Dann verlinkt eure Seite in den Kommentaren – wir sind gespannt!

Viele Grüße
Tara