Bilder für das Web optimieren – Teil 2 “optimale Bildgrößen”

Dieser Eintrag wurde veröffentlicht in Tipps & Tricks

Profitieren Sie und Ihre Besucher von professionell optimierten Fotos und Grafiken auf Ihrer Webseite. Im zweiten Teil “Bilder für das Web optimieren” erfahren Sie, welche Bildgrößen sich für Online-Publikationen eignen.

Optimale Bildgrößen für Fotos im Web

Fotos und Grafiken die in Ihre Webseite einbinden möchten benötigen selten mehr Bildhöhe, als der Monitor des Betrachters zulässt. Eine Bildschirmauflösung von 1024 x 768 Pixel ist immer noch weitgeläufig. Hinzu kommen noch die Randleisten des Browsers, die das Darstellungsfeld der Webseite zusätzlich einschränken. Kein Betrachter möchte im Normalfall ein Bild scrollen. Eine ideale Bildgröße ergibt sich somit aus der Darstellungshöhe des sichtbaren Bereichs im Browser. Wenn Sie auf Nummer sicher gehen möchten empfehle ich Ihnen eine Bildhöhe von 480 Pixel. Für das Seitenverhältnis von 4:3 Ihres Fotos ergibt sich somit eine Bildgröße von 640 x 480 Pixeln.

Für Bilder, die sich in einem Popup-Fenster öffnen bietet sich eine Bildgröße von 800 x 600 Pixeln an. Für Monitore mit HD-Auflösung können die Bilder eine Größe von 960 x 640 aufweisen (Facebook Popups verfügen z. Z. über eine maximale  Bildbreite von 960 Pixeln).

Bildauflösung

Ein Monitor kann nur zwischen 72 dpi und 96 dpi (dots per inch) darstellen. Bei 96 dpi sind das 96 Bildpunkte in einem Viereck von 2,54 x 2,54 cm Seitenlänge. Im Vergleich: Eine Tageszeitung verfügt über eine Auflösung von 150 dpi.

Die Fotos und Grafiken benötigen für die Bildschirmdarstellung somit eine wesentlich geringere Auflösung als für den Bilderdruck. Eine höhere Bildauflösung ist also nicht gleich besser, sonder für die Bildschirmdarstellung sinnlos. Die Dateigröße wird unnötigerweise aufgebläht und verlangt längere Ladezeiten.

Bildgröße und Auflösung ändern

Bildgröße und Auflösung ändern

Bildgröße und Auflösung ändern

In einem Bildbearbeitungsprogramm können Sie die Größe Ihres Fotos ändern. Als kostenloses Programm bietet sich paint.net an. Eine Beschreibung zur Freeware finden Sie in unserem Beitrag “Kostenlos Fotos für das Web optimieren mit Paint.NET“. Auch RIOT ist ein spitzen Tool zur Bildoptimierung. Lesen Sie dazu den Beitrag: Weboptimierte Fotos mit dem kostenlosen Programm RIOT.

Dieser Eintrag wurde veröffentlicht in Tipps & Tricks und getagged , , , , , , , , . Bookmarken: Permanent-Link. Kommentieren oder ein Trackback hinterlassen: Trackback-URL.

2 Kommentare

  1. Erstellt am 29. Dezember 2011 um 14:32 | Permanent-Link

    Hi,
    eine nette Ergänzung wäre die aktuell perfekte Auflösung für Facebook-Bildergalerien.

    1024×768 sollte die reguläre Größe sein, aber was Facebook unter verbesserter Qualität versteht, ist mir grad z.B. nicht so ganz klar ;)

    Ansonsten viel Spaß beim bloggen.
    Gruß Martin

    • Erstellt am 2. Februar 2012 um 18:18 | Permanent-Link

      Hallo Martin,
      ich teste gerade optimale Bildformate für die Facebook Bildergalerie. Die Checkbox “hohe Bildqualität”, beim Bild-Upload auf Facebook, lässt mich z. Z. noch im Unklaren. Aber die ersten Test zeigen überraschende Ergebnisse. Bezüglich der Qualität der Bilder, die auf Facebook hochgeladen werden lassen sich deutliche Unterschiede feststellen. Eine vorhergehende Weboptimierung für Facebook lohnt. Der entsprechende Beitrag folgt in Kürze. Du wirst staunen!

Ihr Kommentar

Ihre E-Mail wird niemals veröffentlicht oder verteilt. Benötigte Felder sind mit * markiert

*
*

Du kannst diese HTML Tags und Attribute verwenden: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Die Kommentarfunktion für Ihre Werbezwecke zu nutzen macht keinen Sinn. Werbung wird in den Kommentaren nicht veröffentlicht. Wenn Sie auf diesem Blog werben möchten, reden Sie mit mir.
Weitere Hinweise zur Nutzung finden Sie in den Datenschutzbestimmungen.

.
Mehr Infos auf »