Richtige Hintergrundbildgröße für das Web

Wenn Sie eine Website gestalten, müssen Sie verstehen, wie jedes Bild, Textfeld und Hyperlink miteinander interagieren, um ein funktionales Ganzes zu erstellen. Dies trifft insbesondere auf Hintergrundbilder zu, die einem ansonsten minimalistischen Layout Farbe und Stil hinzufügen können. Wenn Sie dieses Bild jedoch nicht mit den richtigen Abmessungen und der richtigen Dateigröße optimieren, kann es Ihre Website verlangsamen oder das Bild unansehnlich strecken. Nachstehend haben wir einige wichtige Tipps für das Auswählen und Skalieren von Hintergrundbildern für das Web aufgezeigt.


Sie benötigen Bilder für Ihr Projekt? Shutterstocks beeindruckendes Archiv mit mehr als 70 Millionen Bildern kann Ihnen dabei helfen! Sehen Sie selbst, was unser Archiv zu bieten hat.


Größe ist alles
Hintergrundbilder sind für das Aussehen einer Site großartig, doch je mehr sich Ihre Seiten auf diese Bilder verlassen, desto langsamer wird Ihre Website. Um zu vermeiden, dass Ihre Site mit zu vielen Daten langsamer wird, müssen Sie das optimale Gleichgewicht zwischen Bildqualität und Größe finden. Es ist hilfreich, über die heutigen Auflösungsstandards nachzudenken, die angeben, wie viele Pixel auf einem Bildschirm angezeigt werden. 

Derzeit sind die beliebtesten Desktop- und Tabletauflösungen 1280 x 800, 1366 x 768 und 1920 x 1080. Andererseits zeigen Smartphones Ihre Website mit einer viel kleineren Auflösung an, wie zum Beispiel 320 x 480 oder 800 x 480. Und schließlich erfordern die neuesten Computerserien mit Retina-Displays Bilder, die zweimal so groß wie der durchschnittliche Monitor sind. 

Einen Kompromiss finden
Wie sollen Sie nur ein Hintergrundbild erstellen, dass alle diese Anforderungen erfüllt? Wenn Sie ein hoch detailliertes Hintergrundbild verwenden möchten, ist es am besten, die Dateigröße unter 1 MB zu halten (und wenn möglich, unter 100 KB). 

Ein 1 MB Hintergrundbild kann die Grenzen der Internetgeschwindigkeit des normalen Benutzers überschreiten, ohne sein Weberlebnis zu ruinieren, daher ist dies eine gute Faustregel. Wenn der selbe Hintergrund auf Ihrer gesamten Website genutzt wird, können Sie die Auflösung etwas höher machen, weil das Bild nach dem erstmaligen Laden im Cache des Benutzers gespeichert wird. Wir empfehlen, Ihr Hintergrundbild zu skalieren, sodass es ein Verhältnis von 1,777 zu 1 hat, was für Bildschirme mit einer Auflösung von 1920 x 1080 optimal ist. 

  • War dieser Artikel hilfreich?

Kann die Antworten nicht finden?