Verzaubere deine Besucher
mit den passenden Bildern

Willst du Bilder für den Einsatz auf deiner Website vorbereiten? Erfahre, welche Eigenschaften deine Bilder haben müssen und welche Punkte bei der Produktion der Bilder zu beachten sind.

So verarbeitet das 
Website-System deine Bilder

Die richtige Bildgrösse ist für die Ladezeit deiner Website essentiell. Suchmaschinen messen diese und lassen sie in das Ranking deiner Website einfliessen. Aus diesem Grund überlassen wir die Wahl der Bildgrössen nicht dem Zufall. Das System verkleinert deine Bilder in verschiedene Varianten. Die Varianten haben unterschiedliche Grössen. Der Webbrowser nutzt dann je nach Displaygrösse eine passende Variante.

Besucht ein Nutzer deine Website mit dem Handy, wird ihm ein kleineres Bild zur Verfügung gestellt, als wenn er dies mit einem Laptop tut. Im Normalfall sehen alle Bild-Varianten gleich aus. Bei Bedarf kannst du einzelne Varianten unterschiedlich zuschneiden. So kannst du zB. ein Bild für Laptops im 16:9 Format präsentieren und das Handy im 1:1 Format. 

Das optimale Seitenverhältnis und warum du kein Grafikprogramm brauchst

Egal welches Seitenverhältnis die Bilder auf deiner Website haben werden. Das Seitenverhältnis der Ursprungsdatei, welche du zuvor in die Website hochladen musst, spielt keine Rolle. In der Regel haben Bilder, welche deine Kamera ausgibt, ein Seitenverhältnis von 16:9, 4:3 oder 3:2. Schneide deine Bilder niemals vor dem Upload in die Website zu. So verlieren die Bilder unnötig an Qualität. Du kannst deine Bilder später bequem im Website-System zuschneiden, ohne dass du dazu ein zusätzliches Grafikprogramm brauchst. 

Warum deine Bilder
möglichst gross sein sollten

Das Website-System verkleinert deine Bilder auf die passende Grösse. Wir empfehlen, Bilder so gross wie möglich hochzuladen. So haben wir keinen Qualitätsverlust und das System kann optimal arbeiten. Idealerweise haben Bilder eine Kantenlänge von rund 3000px - 5000px, was einer Dateigrösse von rund 4 MB - 6 MB entspricht. Die meisten Kameras geben Bilder in diesem Bereich aus.

Dateitypen die sich am besten eignen

Wie oben bereits erwähnt, ist die Ladezeit auf einer Website essentiell. Darum sollten Bilddateien verwendet werden, die möglichst stark komprimiert sind. Am besten eignen sich dazu JPG und PNG Dateien. Auf jeden Fall solltest du auf den Einsatz offener Grafikdateien wie EPS, PSD, TIFF etc. verzichten. Wir werden immer wieder gefragt ob man GIF Dateien (Animierter Kurzfilm) einsetzen kann. Grundsätzlich geht das, dabei gilt aber zu beachten, dass das Website-System diese nicht verkleinern kann. Achte also darauf, dass dein GIF maximal 500 kB schwer ist. 

Diese Punkte sind bei der 
Produktion der Bilder zu beachten

Je nachdem, wo ein Bild auf deiner Website eingesetzt wird, sind unterschiedliche Punkte wichtig. Wir unterscheiden Hero-Bilder, Content-Bilder und Portrait-Bilder. Hero-Bilder werden im Kopf der Website angezeigt und erstrecken sich meist über die gesamte Website Breite. Oft werden grosse Headlines und ein Fliesstext über das Bild gelegt. Das Bild muss also einen Bereich haben, wo der Hintergrund möglichst ruhig und frei von störenden Objekten ist. Nur so ist der Text für den Nutzer lesbar. Wir empfehlen 50% der Bildbreite für die Bildbotschaft zu verwenden (z.B. eine Person die lacht) und die andere Hälfte möglichst ruhig zu halten (z.B. blauer Himmel oder eine graue Mauer).

Bei Content-Bildern und Portrait-Bildern ist die Aufteilung meist weniger wichtig. Wir empfehlen dem wichtigsten Teil des Bildes (z.B. ein Auto, das fährt oder eine Person, die in die Kamera schaut) genügend Raum rundherum zu geben. So hat der Redakteur der Website genügend Spielraum, das Bild bei Bedarf passend zuzuschneiden.