So speichern Sie Bilder für Websites

Ich stelle HD-Bilder auf meine Website und es dauert sehr lange, bis sie geladen sind. Ich habe dann versucht, sie mit Photoshop CC als JPEG erneut zu speichern und 1 in der Komprimierungsskala auszuwählen (von 1 bis 12). Sie sind viel leichter, haben aber immer noch die gleiche Größe. Auf meiner Website habe ich eine kleine Verbesserung der Ladegeschwindigkeit bemerkt, aber es war nicht so drastisch, wie ich dachte. Wäre es am besten, die Bilder neu zu skalieren, anstatt sie zu komprimieren (da sie auf der Website nie in voller Größe, dh etwa 5000 x 3500 Pixel, angezeigt werden). Welches ist die beste Lösung, damit meine Bilder schnell geladen werden, aber dennoch eine hervorragende Qualität beibehalten? Danke!!!

Antworten (2)

Sie sollten die Größe der Fotos fast immer ändern, bevor Sie sie auf eine Website hochladen. Der Webdesigner sollte Ihnen sagen können, was die optimalen Abmessungen sind.

Verwenden Sie die Option „Für Web speichern“ in Photoshop. Die zu wählende Qualitätsstufe hängt vom Foto ab. Einige können stärker komprimiert werden, ohne Komprimierungsartefakte zu zeigen. Wählen Sie „In sRGB konvertieren“, um Farbprobleme zu vermeiden.

Verwenden Sie nach dem Speichern der Dateien eine App wie ImageOptim für Mac, um die Exif-Daten zu löschen und die Dateigröße weiter zu reduzieren.

Sie können auch nach Websoftware suchen, die die Größe basierend auf dem Zielanzeigegerät dynamisch anpasst. Mit Webbrowsern, die von winzigen Telefonen bis hin zu 4K+-Desktops laufen, erreicht es einen Punkt, an dem die Anzeige hochwertiger Bilder nicht mehr eine Einheitsgröße sein kann. Ich biete dies nicht als Antwort an, da die zu verwendende Websoftware den Rahmen der Frage (und dieses Forums) sprengt, aber vom OP betrachtet werden sollte.
Das Problem ist, dass imagemagick und gd für PHP, die von den meisten Websites verwendet werden, Bilder nicht so gut komprimieren können wie Photoshop. Daher ist es sinnvoll, die größte Version des Bildes mit einem Tool wie Photoshop zu komprimieren. Responsive Webdesign mit angepassten Bildern sollte selbstverständlich sein und liegt in der Verantwortung des Webdesigners.

Es gibt eine Funktion „Für Web exportieren“ in Photoshop, die Sie hier finden:

Datei -> Für Web exportieren -> (FORMAT WÄHLEN) -> SPEICHERN