Die Größe und Platzierung von Bildern auf einer Unternehmenswebsite sind oft übersehene, aber entscheidende Aspekte des Webdesigns. Die Wahl der richtigen Bildgröße und Position verbessert nicht nur die Ästhetik, sondern auch die Ladegeschwindigkeit und das Surferlebnis. Dieser Artikel gibt praktische Tipps für die gängigsten Seitenbereiche.
Größe und Platzierung des Startseiten-Banners
Das Startseiten-Banner ist oft das Erste, was Besucher sehen. Empfohlen werden Abmessungen von 1920×600 oder 1920×800 Pixeln, die an gängige Bildschirme angepasst sind und nicht zu viel Platz im oberen Bereich einnehmen.
Platzieren Sie es unter der oberen Navigation und lassen Sie es über die volle Breite laufen. Achten Sie darauf, dass wichtige Inhalte wie Text oder Buttons im sicheren Bereich liegen, um Beschneidungen auf verschiedenen Bildschirmen zu vermeiden.
Größe und Platzierung von Produktbildern
Produktbilder müssen Details klar zeigen und gleichzeitig die Ladeeffizienz auf Listen- und Detailseiten gewährleisten.
Für Produktlistenseiten empfehlen sich einheitliche quadratische Bilder, z. B. 400×400 oder 500×500 Pixel, um Konsistenz zu wahren. Platzieren Sie sie in einem Raster mit 3–4 Spalten pro Zeile.
Das Hauptbild auf der Produktdetailseite sollte eine Breite von 800–1000 Pixeln haben, mit proportionaler Höhe. Positionieren Sie es links und ergänzen Sie es rechts mit Text. Fügen Sie 2–3 Nebenbilder oder Detailaufnahmen hinzu, die die gleiche Größe haben können.
Größe und Platzierung von Team- und Unternehmensfotos
Bilder auf der „Über uns“-Seite müssen nicht zu groß sein, sondern klar erkennbar. Teamfotos sollten eine Breite von 300–500 Pixeln haben, quadratisch oder im Verhältnis 3:4. Platzieren Sie sie neben den jeweiligen Personen, mit 2–4 Personen pro Zeile.
Größe und Platzierung von Fallstudienbildern
Fallstudienbilder müssen sowohl als Thumbnails als auch in der Detailansicht funktionieren. Für die Listenseite empfehlen sich 300×200 Pixel (16:10) oder 400×300 Pixel (4:3). Nach dem Klicken kann das Bild auf über 800 Pixel Breite vergrößert werden.
Verwenden Sie auf der Listenseite ein Raster oder Kartenlayout mit 2–3 Fällen pro Zeile. Auf der Detailseite platzieren Sie die Bilder in der Mitte, begleitet von Text.
Größe und Platzierung von Nachrichtenbildern
Bilder in Nachrichten oder Blogbeiträgen sollten nicht zu groß sein, idealerweise 600–800 Pixel breit, mit automatischer Höhenanpassung. Platzieren Sie sie im Text, passend zum Inhalt. Achten Sie auf einheitliche Breite für ein ordentliches Erscheinungsbild.
Größe von Logos und Partnerlogos im Footer
Logos oder Partnerlogos im Footer benötigen keine hochauflösenden Bilder. Empfohlen wird eine Höhe von 30–50 Pixeln, mit proportionaler Breite. Ordnen Sie sie horizontal an, 5–8 pro Zeile, um den Footer nicht zu überladen.
Hinweise zur mobilen Anpassung
Da immer mehr Nutzer über Mobilgeräte auf Websites zugreifen, müssen Bilder auch für mobile Endgeräte optimiert werden. Verwenden Sie responsive Bildtechniken, die große Bilder für große Bildschirme und komprimierte Versionen für kleine Bildschirme bereitstellen. Alternativ können Sie per CSS die maximale Breite auf 100% setzen und die Höhe automatisch anpassen, um Überlauf zu vermeiden.
Dies sind die empfohlenen Bildgrößen und -positionen für gängige Bereiche einer Unternehmenswebsite. Passen Sie sie je nach Design und Inhalt an. Wichtig ist die Konsistenz: Verwenden Sie ähnliche Größen und Proportionen für gleiche Bildtypen, um ein professionelles und aufgeräumtes Erscheinungsbild zu erzielen.
