Heiko: Bilder passende verkleinern

Ich habe ein Bild mit der Abmessung von 700 Pixel × 525 Pixel
diese soll per HTML in einen Container integriert werden. Dieser ist aber maximal 300Pixel x 300Pixel.

Jetzt habe ich soweit ich weiß, zwei Möglichkeiten. Entweder per HTML

<img src="bild'.jpg" width="300" height="300">

wobei das Ergebnis zwar passt aber furchterregend aussieht.  Oder ich lese per PHP die Abmessungen ein und berechne die richtige Größe.
Jetzt meine Frage, gibt es noch eine dritte, vieleicht einfache Lösung ohne Berechnung????

Heiko

  1. Wenn du die größe e schon vorher weißt wieso nicht einfach das bild direkt mit 300x300 px abspeichern? Oder hat es einen genaueren Grund.

    Ein Bild nur max so groß speichern wie benötigt, runterskalieren ist unnötig und verbraucht nur traffic und führt letztendlich auch nicht zu besseren ergebnissen wenn du zB. width und height angibst wie du selbst sagst.

    width und height würd ich im allgemeinen trotzdem angeben damit der browser von anfang an weiß wie groß das bild sein soll (=> ladet schneller). Trotzdem, wenn du es nicht größer als 300x300 brauchst dann skalier es direkt in gimp, photoshop oder ähnlichen programmen.

    Sonst (wenn du ein unverzerrtes bild willst) kannst du es über Php zB machen oder Canvas (was aber IE ws. nicht unterstützt).

    lg

  2. wobei das Ergebnis zwar passt aber furchterregend aussieht.  Oder ich lese per PHP die Abmessungen ein und berechne die richtige Größe.
    Jetzt meine Frage, gibt es noch eine dritte, vieleicht einfache Lösung ohne Berechnung????

    Du kannst mit PHP die Bidler serverseitig herrunterrechnen:

    http://php.net/manual/de/function.imagecopyresampled.php

    1. Ich frage mich nur was sinnvolle ist.

      Wenn ich Das Bild in 5 Formaten brauche, die alle ziemlich gleich sind, also zwischen 80 und 200 Pixel.

      Ob ich beim Abspeichern 5 verschiedene Bildergrößen erstelle und speichere, oder eben nur eines und das dann skaliere, wenn ich es brauche?

      Heiko

      1. Ob ich beim Abspeichern 5 verschiedene Bildergrößen erstelle und speichere, oder eben nur eines und das dann skaliere, wenn ich es brauche?

        Das kommt drauf an - skalieren im Browser kann ziemlich schlimm aussehen, andererseits verursachen eben 5 separate Bilder mehr Ladezeit (HTTP-Requests und Traffic).

        ggf. hilft ein gesundes Mittelmaß?