Richtlinien zur Bildgröße

Jedes Mal, wenn Sie ein Bild hochladen, werden bis zu 5 verkleinerte Kopien des Bildes erstellt. IONOS fügt dann automatisch das Bild in der richtigen Größe in den Desktop, das Tablet und die mobilen Websites ein und stellt so sicher, dass Ihre Website-Besucher das Bild stets in der richtigen Größe für ihr Gerät sehen.

Optimierte Bildgrößen je Gerät

Bildtyp

Bildbreite

Hintergrund

1980 Pixel

Desktop

1660 Pixel

Tablet

1440 Pixel

Mobil

600 Pixel

Thumbnail

150 Pixel

Die Größe des hochgeladenen Bildes wird nicht erhöht. Nur Bilder, die kleiner als das Original sind, werden erstellt. Wenn beispielsweise ein Bild mit einer Breite von 2000 Pixeln hochgeladen wird, werden 5 neue optimierte Kopien erstellt. Wenn ein Bild mit einer Breite von 100 Pixeln hochgeladen wird, werden keine neuen Bilder erstellt.

Maximale Bildgröße

Die Gesamtfläche eines Bildes darf 3.145.728 Pixel nicht überschreiten. Es ist unwahrscheinlich, dass eines Ihrer Bilder über dieser Grenze liegt, aber Sie können dies schnell überprüfen, indem Sie die Pixelbreite mit der Höhe multiplizieren.

Richtlinien zur Bildgröße pro Widget

Schieberegler

Der Schieberegler-Widget wird normalerweise bei größeren Bildern verwendet, um einen dramatischen Effekt zu erzielen. Schieberegler erstrecken sich in der Regel von einem Ende zum anderen, daher ist es gut, Bilder mit einer größeren Breite zu verwenden, damit der Schieberegler passt. Verwenden Sie für quadratische Schieberegler ein gerades Seitenverhältnis, z. B. 1:1.

Es ist am besten, Bilder mit gutem Innenabstand zu wählen, so dass der Hauptinhalt des Bildes bei einer Größenänderung nicht abgeschnitten wird. Die Bildverhältnisse im Schieberegler sollten aus Gründen der Designkonsistenz gleich sein.

  • Übliche Seitenverhältnisse: 16:9, 3:4
  • Übliche Auflösungsgrößen (Pixel): 1600x900, 1280x720, 1280x960
Hinweis

Mobile Geräte haben oft das entgegengesetzte Seitenverhältnis im Vergleich zu Desktop-Geräten. Möglicherweise müssen Sie die Funktion „Auf Gerät ausblenden“ verwenden, um mobile Schieberegler korrekt anzuzeigen.

Fotogalerie

Das Fotogalerie-Widget ist das flexibelste Widget zur Verwendung mit Bildern, da es so viele Layout-Optionen gibt. Sie können zum Beispiel eine gekachelte Galerie erstellen, die für alle Bilder die gleiche Größe hat, oder ein Mosaik, das pro Bild eine unterschiedliche Größe hat.

Das Seitenverhältnis der Bilder in der Fotogalerie sollte die gewünschte Darstellung widerspiegeln.

  • Beispielsweise sollten Galerien im quadratischen Stil ein Bildformat von 1:1 haben.
  • Galerien mit Bildern im Hochformat sollten längere Höhenverhältnisse haben, wie z. B. 2:5 oder 200 Pixel mal 500 Pixel.

Die Bildverhältnisse sollten aus Gründen der Designkonsistenz gleich sein. Lassen Sie etwas Innenabstand im Bild, sodass der Schwebeeffekt genutzt werden kann und Ihre Bilder nicht abgeschnitten werden.

  • Übliche Seitenverhältnisse: beliebiges Seitenverhältnis.
  • Übliche Auflösungsgrößen (Pixel): Jede Auflösung, aber nicht größer als 1500 Pixel, wegen der Seitengeschwindigkeit.

Icons

Symbole sind ein sehr wichtiger Bestandteil jeder Website. Sie sind visuelle Markierungen für Informationen und können Ihrer Website ein modernes Aussehen verleihen. Sie können transparente PNGs, JPEGs oder SVGs verwenden.

  • Übliche Seitenverhältnisse: Im Allgemeinen 1:1, aber jedes Seitenverhältnis ist möglich.
  • Übliche Auflösungsgrößen (Pixel): 200x200, 80x80 oder jede beliebige Auflösung. SVGs können jede beliebige Auflösung haben.

Favicons

Favicons werden nicht auf Ihrer eigentlichen Website verwendet, sondern auf der Registerkarte angezeigt, wenn Benutzer Ihre Website öffnen.

  • Erforderliches Seitenverhältnis: 1:1
  • Zulässige Auflösungsgrößen (Pixel): 24x24, 36x36, 48x48

Seitenverhältnis vs. Auflösung

Das Seitenverhältnis ist das Verhältnis der Bildattribute Breite und Höhe. Ein Seitenverhältnis von 16:9 kann ein Bild mit 16x9 Pixel oder ein Bild mit 1600x900 Pixel sein. Grundsätzlich ist es jede Bildauflösung, die das Verhältnis 16:9 hat.

Visualisierung der beiden gebräuchlichsten Seitenverhältnisse:

Geräteabhängige Seitenverhältnisse

Zwar werden die Bilder auf Ihrer Website optimiert, doch wird das Design der Bilder auf Ihrer Website nicht in der Größe verändert. Wenn Sie auf dem Desktop ein Bild mit einem Seitenverhältnis von 16:9 verwenden, wird es auf dem Desktop perfekt aussehen, da ein Desktop-Bildschirm oft sehr breit ist. Ein mobiles Gerät ist jedoch viel schmäler, so dass ein Seitenverhältnis von 16:9 manchmal klein aussieht.

Um dies auszugleichen, können Sie entweder die Funktion "Auf Gerät ausblenden" verwenden, um spezifische Versionen für diese Geräte zu erstellen, oder Sie können die Größe des Bildes so ändern, dass es passt. Änderungen der Größe sind geräteunabhängig.

Erwägungen

Das Größte ist nicht immer das Beste

Das Hochladen der größten Auflösung für Ihre Website garantiert, dass die Bilder Ihrer Website für Ihre Kunden und Interessenten hochauflösend dargestellt werden. Denken Sie jedoch daran, dass große Bilder auch einen erheblichen Einfluss auf die Geschwindigkeit Ihrer Seite haben. Da hochaufgelöste Bilder herunterskaliert werden, merken die Benutzer den Unterschied in der Auflösung normalerweise nicht. Es ist besser, Bilder hochzuladen, die so groß sind, wie sie verwendet werden sollen. Wenn Sie beispielsweise ein Bild mit einer Auflösung von 300 Pixel x 300 Pixel auf Ihrer Website haben, sollten Sie es nicht als Bild mit einer Auflösung von 4000 Pixel x 4000 Pixel hochladen.