Bilder optimieren für Webseiten

  • Was mich so langsam kirre macht sind Bilder für Webseite. Mal "zu groß" um schnell zu laden, jedoch stimmt dann die Qualität. Mal "zu klein", lädt schneller, aber die Qualität ist unterirdisch.

    Wie muss man denn die Bilder bereitstellen, damit es optisch passt und schnell lädt? Vom Code her möchte ich nur html und css verwenden.


    Danke für eure Zeit

  • Wenn man die Bildgröße an die Gegebenheiten im Web anpasst, habe ich keine Probleme: JPG, 800px an der längeren Kante, Komprimierung so, dass sich eine Dateigröße von 100 bis 200 kB ergibt. Damit gibt es keinen sichtbaren Qualitätsverlust.


    Schwierig wird es, wenn man die beliebten fensterfüllenden Hintergrundbilder haben will, Dafür kenne ich auch kein Patentrezept.

  • Danke für deine Antwort.

    Ich habe immer Qualitätsverlust oder lange Ladezeiten. Das ist auch bei 4,5,6 kleineren Bilder ( 200x200 ) neben-/übereinander so.

  • In seinem Buch, Flexible Boxes, beschreibt Peter Müller ab Seite 124 das Thema Grafiken optimieren und flexibel einbinden. Du solltes dir das Buch beim Verlag Rheinwerk Computing besorgen. Es wird dir viele Antworten auf deine Fragen geben, nicht nur zum Thema Einbindung von Grafiken. Das Buch kostet kanpp 30€ und ist es echt wert! Beispieldateien und Infos zum Buch gibt es unter pmueller.de

  • ich mache viel mit Bildbearbeitung und lasse hier noch einen kleinen Tipp.


    Ich verwende Photoshop zum bearbeiten meiner Bilder habe auch kostenlose Alternativen versucht. Was mir aufgefallen ist ist das so Software wie Photoscape etc. die JPGs stark komprimiert, Photoshop hingegen nicht.

    Also verwende ich PNG wenn es die Dateigröße hergibt ansonsten mit Photoshop abspeichern damit nicht /nur gering komprimiert wird.