Deine Fotos erscheinen nach dem Web-Upload unscharf? Oder weisen eine lange Ladezeit auf? Dann hast du entweder versehentlich das Foto in voller Auflösung hochgeladen oder das Bild vorher nicht ordentlich komprimiert. In diesem Beitrag entdeckst du vier Wege, wie du mit Lightroom, Photoshop oder JPEGmini die Bilder richtig für den Upload ins Internet komprimierst.
Zuerst ein paar Gedanken, die du dir in Punkto Dateigrößen und Auflösung immer überlegen solltest: Wo will ich meine Bilder zeigen und welche Qualität / Auflösung benötige ich dafür?
Hier gibt es folgende zwei Szenarien:
- Für einen hochqualitativen Ausdruck mit 300ppi wird meistens die maximale Bildqualität / Auflösung benötigt
- Für Bildschirme (also das Internet) reichen meistens schon 76ppi – also eine deutlich geringere Auflösung
Mittlerweile gibt es allerdings auch das “Problem”, dass selbst Bildschirme immer hochauflösender werden. Daher stimmt die 76ppi Regel meist für 4K Laptop Bildschirme oder Retina Displays oft nicht mehr. Hier gilt es dann immer abzuwägen.
In diesem Beitrag zeige ich dir, wie du die Bildgröße beschränken kannst und die üblichen Probleme im Web vermeidest: Der Upload Dialog lädt ewig, das Bild sieht nachher einfach nicht mehr scharf aus oder die eigene Website lädt einfach nicht mehr so schnell. Wie kann man die Bilder nun als qualitativ hochwertig, aber mit geringer Dateigröße speichern ?
In den meisten Programmen kannst du die Kantenlänge der langen Kante in Pixeln und die Bildqualität in Prozent einstellen. Hierfür solltest du je nach Endmedium / Plattform entscheiden:
| Website Full Screen | Website Content | Social Media | Fotocommunity | Empf. Dateigröße | |
| 2400px, mind. 80% | ✔ | ✔ | max. 1200kb | ||
| 1920px, 70-80% | ✔ | ✔ | max. 900kb | ||
| 1440px, 70% | ✔ | max. 500kb | |||
| 960px, 70% | ✔ | max. 350kb |
Und so funktioniert das im Detail in Photoshop, Lightroom und JPEGmini.
Inhaltsverzeichnis
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.
| WIN | MAC | |
| Für web exportieren | Strg + Shift + Alt + S | CMD+ Shift + Alt + S |
Anschließend können wir unsere gewünschte Kantenlänge festlegen. Schreib den gewünschten Wert (siehe Tabelle oben) bei der langen Kante rein – also bei Querformat die Breite, bei Hochformat die Höhe. Achte darauf, dass das Kettensymbol rechts daneben aktiv ist, wodurch das Seitenverhältnis beibehalten wird.
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 oben rechts kann man die Qualität dann noch anpassen, dass man im gewünschten Bereich der Dateigröße bleibt. Orientiere dich dabei an meinen empfohlenen Dateigrößen aus der Tabelle oben.
Die Option Bikubisch schärfer sollte auch unten rechts bei Qualität ausgewählt sein, um eine etwas knackigere Wiedergabe im Web zu erhalten.
2. Lightroom Bildgrösse ändern, Dateigrösse beschränken und für Web exportieren
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… .
In diesem Dialog kann man nun zunächst unter “Speicherort für Export” auswählen, wohin man die ausgewählten Bilder speichern will. Im Bereich “Bildgröße” lässt sich nach Anklicken des Hakens auswählen, dass die lange Kante z.B. 1920px Betragen soll.
Unter “Dateieinstellungen” lässt sich nun die Qualität in Prozent festlegen. Orientiere dich auch hier wieder an den Einstellungen aus meiner Tabelle – meistens liegt man bei 70-80% richtig.
Achtung: Du kannst hier statt dem prozentualen Wert auch einstellen, 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. Allerdings empfehle ich diesen Vorgang generell nicht. Bleib lieber bei der prozentualen Angabe, da einfach jedes Bild unterschiedlich ist. Eine generelle Begrenzung nimmt dem Bild oft die “Entfaltungsmöglichkeit” und es ist völlig normal, dass Bilder völlig unterschiedliche Dateigrößen haben.
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.
Tipp: Export-Vorgaben erstellen
Links im Bedienfeld kannst du die aktuellen Einstellungen auch als Export-Vorgabe “Hinzufügen”. Am Beispiel eines 1920px Exports sollten folgende Einstellungen enthalten sein:
- Exportieren in: Ordner später wählen
- Bildformat: JPEG
- Qualität: 70%
- Farbraum: sRGB
- In Bildschirm einpassen: Lange Kante, 1920px
- Schärfen für: Bildschirm, Stärke: Niedrig
Anschließend musst du nie wieder in dieses Export-Menü. Stattdessen reicht ab jetzt ein einfacher Rechtsklick auf das zu exportierende Bild. Im “Exportieren” Kontextmenü findest du nun direkt dein Preset.
3. Schnelle Komprimierung mit dem Hilfsprogramm JPEGmini
Wenn du regelmäßig Massen an Bildern ins Internet hochladen möchtest, wirst du vielleicht schon einmal von JPEGmini gehört haben. Dieses Tool ist vor allem empfehlenswert, wenn man im Nachhinein bereits exportierte Fotos noch für den Web-Upload verkleinern möchte. So vermeidest du, dass du jedes Bild noch einmal in Photoshop oder Lightroom öffnen musst.
Stattdessen ist JPEGmini einfach nur ein Fenster, in das man Bilder ziehen kann. Anschließend werden die reingezogenen Bilder mit den gewünschten Maßen neu abgespeichert:
Neben einer Webkomprimierung kann das Programm auch einfach das Originalbild in derselben Auflösung, nur verlustfrei komprimiert neu abspeichern (Optimize Originals). Das ist nützlich, um z.B. tausende Fotos auf einen kleinen USB-Stick speichern zu können. Ein Unterschied ist in der Qualität nicht sichtbar, an der Dateigröße allerdings schon.
Fazit – Bilder für Web exportieren und verkleinern
Mit diesen drei professionellen Möglichkeiten bist du nun gewappnet, deine Bilder gut und mit geringer Ladezeit im Internet zu präsentieren. Durch die kontrollierte Komprimierung nimmst du auch den Social Media Plattformen diese Aufgabe weitestgehend ab, wodurch das Bild nach dem Upload noch beinahe so aussehen wird wie vorher.
Nichtsdestotrotz möchte ich anmerken, dass du auf kurz oder lang deine eigene Kombination zwischen Auflösung und Bildqualität finden musst. Das kommt sowohl auf dein eigenes Empfinden von Bildqualität an, aber auch auf deine Website.
Wenn deine Website z.B. Bilder im Content-Bereich nur sehr klein zeigt, reicht z.B. 960px aus. Werden Bilder groß gezeigt oder z.B. auch Fullscreeen, dann muss entsprechend größer exportiert werden – was natürlich zu Ungunsten der Ladezeit geht. Für eine etwas brillantere Darstellung zeige ich (vor allem eben auf meinem Fotoblog) die Bilder lieber sogar etwas größer, als zu klein. So werden pixelige Darstellungen vermieden.
Deine Bildbearbeitung ist laaangsam? Übernimm meine besten Lightroom Techniken und beschleunige deinen Workflow extrem.
Im kostenlosen Lightroom Crashkurs lernst du, wie sich deine Fotos beinahe von selbst bearbeiten. Und mit wenigen Klicks genau das heraus kommt, was du möchtest.
Trage dich jetzt ein und du erhältst in den nächsten 5 Tagen je eine Lektion. Zusammen zünden wir den Turbo für deinen Workflow: Von systematischer Bildauswahl über automatische KI-Retusche bis hin zur kompletten Erstellung von Farblooks.
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. :)
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?
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.
Ah okay. Ja mit der Trial kommt man also auch schon wie weit. Werd ich mir wohl mal anschauen müssen, danke für den Tipp!
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 :)
Schön dass es dir weitergeholfen hat. Besonders für Stapelverarbeitung ist LR sehr praktisch!