Bilder kleiner machen: 2 Wege für die JPG Web Optimierung

Am in veröffentlicht.
Kostenloses Ebook: Kreative Available LIght Portraits

Lerne im kostenlosen Portrait Email-Kurs, wie du Schritt für Schritt gelungene Porträts fotografierst. Trage dich jetzt in den Newsletter ein und du erhältst den Kurs mit weiteren nützlichen Tricks und Angeboten.

Du kannst dich jederzeit wieder abmelden. Deine Daten werden unserem sicheren Newsletter Anbieter GetResponse übermittelt. Die Übertragung ist SSL-verschlüsselt. Mit Klick auf den Button erklärst du dich mit der Datenschutzerklärung einverstanden.


Unscharf ? Lange Ladezeit ? Ich stelle 2 wichtige Funktionen bzw. Wege vor, mit denen man Bilder richtig für den Upload ins Internet komprimiert.

Die üblichen Probleme: Der Upload Dialog lädt ewig, auf Facebook will das Bild nachher einfach nicht mehr scharf aussehen oder die eigene Website lädt einfach nicht mehr so schnell, weil das Bild unnötig groß hochgeladen wurde. Wie kann man die Bilder nun als qualitativ hochwertig, aber mit geringer Dateigröße speichern ?

Zunächst sollte man überlegen, welche Auflösung für das Internet sinnvoll ist. Auf Facebook reicht meistens eine kleinere Dateigröße, wohingegen man auf Fotocommunities wie 500px oder flickr eine etwas größere Auflösung wählen könnte. Aktuell exportiere ich meine ganzen Bilder einheitlich in 1600px (lange Kante). Mit diesem Bildmaß kann man die spätere .jpg Dateigröße schon einmal erheblich verkleinern. Das Bild wird anschließend noch zusätzlich komprimiert.

Lightroom und Photoshop stellen uns dafür sogar spezielle Dialogfelder zur Verfügung:

1. Bilder kleiner machen mit Photoshop

In Photoshop wählen wir, nachdem wir das Bild fertig bearbeitet haben Datei > Exportieren > Für Web speichern… aus. Am besten prägt man sich die Tastenkombination zum Aufrufen des Dialogs ein.

Bilder kleiner machen

Anschließend können wir unsere gewünschte 1600px Kante festlegen, wobei sich durch das Kettensymbol die kurze Kante automatisch im Verhältnis anpasst. Verlässt man nun das Feld, sieht man bereits, dass die neue Dateigröße errechnet wird. Die Dateigröße wird immer unten links unter dem Bild angezeigt. Diese solltet ihr immer im Auge behalten. Durch den Qualitätsregler kann man die Qualität dann noch anpassen, dass man im gewünschten Bereich der Dateigröße bleibt. Bei 1600px reicht eine Dateigröße von 300kb für’s Web völlig aus. Die Option Bikubisch schärfer sollte auch unten rechts bei Qualität ausgewählt sein, um eine etwas knackigere Wiedergabe im Web zu erhalten.

Bilder für Web optimieren

 

2. Bilder kleiner machen mit Lightroom

Für den Export von mehreren Bildern hintereinander ist es oft mühseelig, in Photoshop jedes mal den Vorgang auszuführen. Abhilfe kann Lightroom schaffen. Hier kann per Stapelverarbeitung in einem Zug viele Bilder kleiner machen, egal ob es sich um ein, zehn oder hundertfünfzig Fotos handelt.

In Lightroom klicken wir mit der rechten Maustaste auf das Bild (oder die ausgewählten Bilder), das wir exportieren wollen und gehen auf Exportieren > Exportieren… .

Lightroom für Web exportieren

In diesem Dialog kann man nun zunächst unter „Speicherort für Export“ auswählen, wohin man die ausgewählten Bilder speichern will und unter „Dateibenennung“ wie die Dateien heißen sollen. So kann man beispielsweise zusätzlich eine Sequenznummer für die einzelnen Bilder verwenden.

Export Dialog in Lightroom

Im Bereich „Bildgröße“ lässt sich nach Anklicken des Hakens auswählen, dass die lange Kante z.B. 1600px Betragen soll. Im Anschluss kann man unter „Dateieinstellungen“ noch festlegen, dass die Bilder eine gewisse Dateigröße nicht überschreiten sollen. Dafür genügt es, das Häkchen bei „Dateigröße beschränken auf:“ zu setzen. Wenn ich das Foto auf Facebook oder Instagram zeigen will, wähle um die 300kb aus. Beim Upload auf Websiten dritter kann man immer sicher sein, dass die Plattformen selbst nachhelfen, dass alles schnell lädt-

Für die eigene Website nehme ich meistens nur 1440px und eine Größe von 150kb. Für die Fotos im Blog Beitrag reichen 960px Breite und 90kb Dateigröße.

Weiter unten im Dialogfeld kann man das Bild schließlich auch noch für die Wiedergabe auf dem Bildschirm schärfen. Die sollte man jedoch von Fall zu Fall testen, ob einem das Ergebnis zusagt. Für’s Bilder kleiner machen fehlt nun nur noch ein Klick auf exportieren und man findet das Foto komprimiert im entsprechend ausgewählten Ordner.

Bilder für Web optimieren

So lassen sich die Bilder kleiner machen, können nun schneller hochgeladen und auch auf Websites schneller abgerufen werden. Auch Facebook komprimiert die Bilder nun nicht mehr so krass, wie wenn man direkt ein hoch aufgelöstes Bild hochladen würde und es sieht immer noch so aus, wie wir es selbst bestimmt haben.

Update 2018

Wenn du merkst, dass die Qualität mit den Einstellungen am Ende irgendwie zu schlecht aussieht, erhöht einfach die zu exportierende Dateigröße in Lightroom (oder die JPG-Qualität in Photoshop). Des weiteren benutze ich mittlerweile das kleine Hilfsprogramm JPG Mini. Dieses stellt als Standalone Programm eine Komprimierung bereit, die das ganze sogut wie verlustfrei weiter verkleinern kann. Auch gibt es zusätzlich die Möglichkeit, diese Komprimierung mit den Plugins direkt im Export von LR und PS zu verwenden.

Markus Thoma

Ich bin Markus und schreibe aus meiner Erfahrung als Berufsfotograf über die kreative Art der Fotografie. Am liebsten fotografiere ich draußen Porträts - bei natürlichem Licht. Denn weniger ist meistens mehr. Hin und wieder bin ich auch gerne mal auf Reisen. Wenn ich gerade nicht fotografiere, findet ihr mich auf Metalcore Konzerten, in der Natur oder am Buffet. Schau doch auch mal auf meinen Social Media Kanälen vorbei:

6 Gedanken zu „Bilder kleiner machen: 2 Wege für die JPG Web Optimierung“

  1. Für die Vorbereitung für’s Web liebe ich ja das Tool http://www.jpegmini.com/

    Aus PS/LR mit 100% Qualität exportieren und dann da rein schmeißen. Kommt ein verdammt gutes Qualitäts/Dateigrößenverhältnis bei raus, das man nicht mit PS/LR durch Schieben des Reglers erreichen kann. Kling wie Werbung, is aber so. :)

    Antworten
    • Das Tool kannte ich noch nicht. Hab mir gerade mal die Website angeschaut. Wollte jetzt eigentlich schreiben dass ich nicht extra immer alles exportieren will um es dann nochmal da durchjagen zu müssen. Aber gibt ja auch eine Plugin Lösung scheinbar. Sieht insgesamt eigentlich schon vielversprechend aus, ja! Aber ob es sich für den Preis lohnt weiß ich noch nicht. Hast du die Pro Version? Oder wie lange läuft die Trial?

      Antworten
      • Die Trial ist zeitlich unbefristet und auf 20 Bilder am Tag begrenzt, da bin ich auch ne ganze Weile mit ausgekommen.

        Ich hab nur die Standalone-Version für $20 und glaube nicht, dass ich auf absehbare Zeit auf die Pro Version als Plug-In umsteigen werde. Die Vorteile sind mir zu gering, es funktioniert schon so gut genug und das Ergebnis überzeugt einfach.

        Antworten
  2. ich mache es bisher immer in PS, habe mich aber schon ewig gefragt, wo das wohl in LR geht. danke für den hilfreichen tipp, das werde ich demnächst probieren und sollte mir doch etwas arbeit ersparen :)

    Antworten

Schreibe einen Kommentar

shares

So einfach ist Farbbearbeitung mit Lightroom.

Im "Lightroom Farblooks Verstehen"-Kurs zeige ich dir in einfachen Lektionen, wie du ab jetzt gelungene Farblooks bearbeitest. Dazu gehört im Kurs ein gratis Preset, Checkliste und weitere nützliche Angebote zu Lightroom und der Fotografie.

 Mit Klick auf den Button erklärst du dich mit der Datenschutzerklärung einverstanden.