Calocybe: Grafiken optimieren - wie geht das?

Hallo!

Man hoert ja oefter mal was von "Grafik optimieren". Gerade im Web ist es ja wichtig, Bilddateien moeglichst klein zu halten. Aber wie geht das eigentlich? Wenn ich ein Bild gemalt oder gerendert oder sonstwas habe, ist es eben da. Was soll ich denn da optimieren?

Na gut, dass man JPGs besser fuer fotorealistische Bilder nimmt und GIFs mehr fuer so - na sagen wir mal "normale", ist mir schon klar. Und dann koennen auch die einen Programme ein GIF besser packen als andere. Aber mehr faellt mir dazu nicht ein.

Calocybe

  1. Hallo!

    Man hoert ja oefter mal was von "Grafik optimieren". Gerade im Web ist es ja wichtig, Bilddateien moeglichst klein zu halten. Aber wie geht das eigentlich? Wenn ich ein Bild gemalt oder gerendert oder sonstwas habe, ist es eben da. Was soll ich denn da optimieren?

    Naja.. da muss man meist halt rumtesten.. und die JPG'S
    mit verschiedenen Komprimierungsstufen mal speichern umd
    das Optimum an komprimierung mit gleichzeitig noch guter
    annehmbarer Qualität herauszubekommen.

    Gifs sind meist nur bei sehr kleinen Grafiken von der Grösse her noch kleiner oder gleich gross wie JPG'S
    Wenn man transaprente Bilder brauch muss man natürlich
    Gifs nehmen...

    Wie auch immer.. ne Standardantwort gibts da sicher nicht.
    mann muss halt rumtesten und sehen das die Grafiken sowohl
    möglichst klein aber auch noch lesbar sind.. wobei der
    persönliche Geschmack sicher auch ne Rolle spielt.

    gruss
    Jens

  2. Hi,

    Man hoert ja oefter mal was von "Grafik optimieren". Gerade im Web ist es ja wichtig, Bilddateien moeglichst klein zu halten. Aber wie geht das eigentlich? Wenn ich ein Bild gemalt oder gerendert oder sonstwas habe, ist es eben da. Was soll ich denn da optimieren?

    Na gut, dass man JPGs besser fuer fotorealistische Bilder nimmt und GIFs mehr fuer so - na sagen wir mal "normale", ist mir schon klar. Und dann koennen auch die einen Programme ein GIF besser packen als andere. Aber mehr faellt mir dazu nicht ein.

    das ist schon mal ein Anfang :-) Verschiedene Komprimierungsalgorithmen liefern halt verschieden große Ergebnisse. GIF ist dabei besser für Zeichnungen geeignet, zumal gleichartige Flächen (zeilenweise) sehr gut komprimiert werden können. Du kannst also tricksen, indem Du z.B. jede zweite Zeile einfach durchgehend in einer Farbe zeichnest.

    Aber auch ohne solche Tricks ist die Größe der Grafik von verschiedenen Faktoren abhängig. Bei JPEG kenne ich mich nicht aus, aber bei GIF solltest Du den Hauptaugenmerk auf die Farben legen. Je weniger Farben, desto kleiner ist die Grafik. Auch die Farbpalette ist wichtig; mit einer 256-Farbpalette statt 16.7 Mio kannst Du noch mal zusätzlich sparen. Also versuche, Dein Truecolor-GIF mit 219 fast identischen Farben auf 16 Farben zu reduzieren, die aus der 256er-Palette genommen werden.

    Bei Animationen kannst Du noch mal sparen, indem Du die zu ändernde Area so klein wie möglich hälst. Wenn Du in einem großen GIF nur eine kleine Kugel rotieren läßt (oder einen Buchstaben in einem langen Wort animierst oder...), brauchst Du nicht die Bildinformationen zu wiederholen, die sich überhaupt nicht geändert haben. Ach ja, in einem GIF können auch Kommentare untergebracht werden - die verbrauchen zwar nur ein paar Bytes, aber das ist ja auch etwas :-)

    Ich hoffe, jemand kann zu JPEG ähnliche Informationen liefern, weil mich das auch interessiert!

    Cheatah

    1. Hi,

      nochwas zu Animationen:
      Wenn mehrere Einzelbilder vorhanden sind, kann jedem einzelnen eine Farbpalette zugewiesene werden. Normalerweise spart es, wenn man diese zu einer globalen zusammenfaßt, am besten wieder unter Reduzierung der Farbzahl. Ich kann jetzt zwar kein Beispiel nennen, aber denkbar wäre auch eine Einsparung, wenn man lokale Farbpaletten benutzt (vielleicht bei vielen kleinen Einzelbildern, die jeweils komplett andere Farben haben).

      Cheatah

  3. Hallihallo!

    Das Thema ist glaube ich zu komplex, um es hier in aller Kürze abzuhandeln. Ein paar gute Antworten hast Du ja auch schon bekommen. Deshalb von mir nur noch ein
    Tip zum "nachsurfen": www.killersites.com!
    Die offizielle Website von David Siegel, seines Zeichens Grafik und Webdesigner (nahe am "Guru").
    Die Site ist leider nur auf englisch, aber es gibt auch
    ein deutsches Buch von ihm: "Killer Web Sites"/Web Site Design/ Markt&Technik. Mit 80,- Märker nicht gerade billig, aber vielleicht kannst Du es ja irgendwo leihen.
    Neben vielen guten Design-Tips auch 'ne Menge Infos zur Site-und Grafikoptimierung.

    Bye, Ronald.

    1. Hallo Ronald

      Tip zum "nachsurfen": www.killersites.com!
      Die offizielle Website von David Siegel, seines Zeichens Grafik und Webdesigner (nahe am "Guru").

      Gibt's besser auch in Deutsch, naemlich online (nicht nur Verweis auf Buecher), ohne falsches Prophetentum und gut verstaendlich. Und das gleich zweifach:

      1. http://webgrafiker.de/gt/
      2. http://ourworld.compuserve.com/homepages/Birgit_Bachmann/

      viele Gruesse
        Stefan Muenz

  4. Hallo Calocybe!

    Man hoert ja oefter mal was von "Grafik optimieren". Gerade im Web ist es ja wichtig, Bilddateien moeglichst klein zu halten. Aber wie geht das eigentlich? Wenn ich ein Bild gemalt oder gerendert oder sonstwas habe, ist es eben da. Was soll ich denn da optimieren?

    Dem konnte ich jetzt nicht widerstehen ;-) also: <../../ti.htm>

    Wie Cheatah schon sagte:
    Dateigröße: Möglichst wenige Farben, Grad der Kompriemierung.
    Anti-aliasing: Beim pixel-Grafiken verhindert den Treppen-effekt beim Farbübergängen und/oder am Grafikrand.
    Interlaced Bild:
    Das Bild wird "beim Laden nicht zeilenweise eingelesen und aufgebaut,sondern schichtweise. ... so erscheint die Grundstruktur der Grafik sehr schnell am Bildschirm des Anwenders. Beim weiteren Einlesevorgang wird die Grafik dann immer  deutlicher und feiner aufgelöst am Bildschirm angezeigt.

    Aber lese mal unter http://mitglied.tripod.de/dueblin/grafik/index.html

    Ist einfach und gut erklärt, mit weiterführender Literatur.

    Grüße
    Thomas

  5. Hallo Ihr Lieben!

    Danke fuer Eure Antworten. Dass man unter Optimierung auch das Anti-Aliasing verstehen kann, daran hatte ich noch gar nicht gedacht. Allerdings braucht man dafuer zwangslaeufig mehr Farben, was die Dateigroesse unter Umstaenden aufblaehen koennte (ausserdem duerfte die GIF-Kompression nicht mehr ganz so effektiv sein). Manche uebertreiben es auch mit dem Weichzeichnen, da brauch ich mir nur mal die Seiten meiner Firma ansehen.

    Marlies hat mir noch per Mail mitgeteilt, dass es fuer JPGs ein Programm namens JPEG-Optimizer gibt, welches einem das ganze Rumprobieren weitgehend abnimmt. Es war auf einer CD von ihr im Internetmagazin 4 oder 5/99. Ich hab's dann auch auf http://search.shareware.com/code/engine/Find?logop=and&cfrom=quick&orfile=True&hits=25&search=jpeg+optimizer&category=MS-Windows(all) gefunden.

    Calocybe