Bildaufbau optimieren

[Reiner]

Hallo!
Meine HP besteht aus sehr viel Grafik. (Eigentlich nur gifs)
Kurze Beschreibung:
Sowas ähnliches wie eine Sichel füllt fast den ganzen Bildschirm.
So in etwa: [C]
Dazu hab ich die Grafik in Bildschirmgröße erstellt und in slices unterteilt, die dann vom browser zum Gesamtbild zusammengebaut werden.
Nur sieht das etwas merkwürdig aus, da (nach Zufallsprinzip?)hier und da nach und nach ein Stückchen erscheint und erst zum Schluß das Gesamtbild, nämlich diese Sichel komplett ist.

Die Illusion, die Sichel sei ein kompaktes Gebilde, geht beim Aufbau allerdings verloren, denn an manchen Stellen steht erstmal für einen Moment lang nur eine Lücke, bis das Bildchen komplett geladen und eingebaut ist.

Kann man irgendwie die Reihenfolge beim Laden bzw. beim Bilschirmaufbau beeinflussen, damit der Aufbau wenigstens am einen Ende der Sichel beginnt und am anderen Ende aufhört und nicht wie bisher eher nach Zufallsprinzip abläuft?

Danke, Reiner

[Struppi]

Hallo!
Meine HP besteht aus sehr viel Grafik. (Eigentlich nur gifs)
Kurze Beschreibung:

eine schlechte Idee.

Kann man irgendwie die Reihenfolge beim Laden bzw. beim Bilschirmaufbau beeinflussen, damit der Aufbau wenigstens am einen Ende der Sichel beginnt und am anderen Ende aufhört und nicht wie bisher eher nach Zufallsprinzip abläuft?

Nein, kann man nicht beeinflussen, aber da diese Seite sowieso nutzlos ist kannst du das mit JS erledigen.

In selfhtml findest du mehr.

Struppi.

[Reiner]

Nein, kann man nicht beeinflussen, aber da diese Seite sowieso nutzlos ist kannst du das mit JS erledigen.

Wieso nutzlos?

[Reiner]

OK, Jungs, vielen Dank an alle! Ich werde mich jetzt doch wohl mal etwas mehr mit CSS beschäftigen,..

bis dann mal..

Reiner

[Ronbov]

Kann man irgendwie die Reihenfolge beim Laden bzw. beim Bilschirmaufbau beeinflussen, damit der Aufbau wenigstens am einen

Hallo Rainer!

Den Bildaufbau kann man beschleunigen, indem man die gleiche Grafik (von mir aus auch unterteilt) in niedrigerer Qualität vorladen lässt!

Sähe wie folgt aus:

Ich rufe die Seite auf, bekomme das komplette Bild angezeigt (allerdings etwas pixeliger, weil ja in niedrigerer Qualität). Wenn die Seite dann komplett fertig geladen ist, werden die bilder mit der höheren Qualität geladen und über die alten gelegt!

Dadurch entstehen keine Lücken oder sowas!

MfG, Ronbov

[Reiner]

Ich rufe die Seite auf, bekomme das komplette Bild angezeigt (allerdings etwas pixeliger, weil ja in niedrigerer Qualität). Wenn die Seite dann komplett fertig geladen ist, werden die bilder mit der höheren Qualität geladen und über die alten gelegt!

Meinst Du mit interleave? Oder eher ein gif mit 5 Farben oder so? :)

[Ronbov]

Ich rufe die Seite auf, bekomme das komplette Bild angezeigt (allerdings etwas pixeliger, weil ja in niedrigerer Qualität). Wenn die Seite dann komplett fertig geladen ist, werden die bilder mit der höheren Qualität geladen und über die alten gelegt!

Meinst Du mit interleave? Oder eher ein gif mit 5 Farben oder so? :)

nein, nein...

du setzt einfach die auflösung deiner bilder runter...die werden dann pixeliger...aber wesentlich kleiner...wenn deine Dateine dann nur ein paar kb groß sind, werden die eigentlich sofort angezeigt, ohne, daß es zu ladezeiten kommt...

[Cheatah]

Hi,

du setzt einfach die auflösung deiner bilder runter...die werden dann pixeliger...aber wesentlich kleiner...

je nach Grafikformat.

wenn deine Dateine dann nur ein paar kb groß sind, werden die eigentlich sofort angezeigt, ohne, daß es zu ladezeiten kommt...

Hallo? Ein paar Kilobyte sind immer noch ein paar Kilobyte, die übertragen werden müssen - pro Grafik.

Cheatah

[Reiner]

du setzt einfach die auflösung deiner bilder runter...die werden dann pixeliger...aber wesentlich kleiner...wenn deine Dateine dann nur ein paar kb groß sind, werden die eigentlich sofort angezeigt, ohne, daß es zu ladezeiten kommt...

Meine 'Nutzgrafik' ist ca. 15 kb groß. Also die Summe aller slices, die ich für die 'Sichel' selbst brauche. Der Rest des Bildschirms (,da einfarbig,) wird durch gestretchte 1x1 px spacer.gifs aufgefüllt. Kann es sein, daß der browser beim Berechnen hier zuviel Zeit benötigt?

[Cheatah]

Hi,

Meine 'Nutzgrafik' ist ca. 15 kb groß.

• (Anzahl der einzelnen Grafiken) * ((Größe des HTTP-Request-Heads)+(Größe des HTTP-Response-Heads))

Wobei das noch nichts mit der Zeit zu tun hat, die u.a. auch aus server- und clientseitiger Bearbeitungszeit sowie - immens wichtig - den Roundtrips besteht.

Der Rest des Bildschirms (,da einfarbig,) wird durch gestretchte 1x1 px spacer.gifs aufgefüllt.

WAAAAH! ...rum denn das, in Gottfrieds Namen?

Kann es sein, daß der browser beim Berechnen hier zuviel Zeit benötigt?

Das ist zwar ein Problem, aber nicht _das_ Problem.

Cheatah

[Reiner]

• (Anzahl der einzelnen Grafiken) * ((Größe des HTTP-Request-Heads)+(Größe des HTTP-Response-Heads))

Das sagt mir eigentlich gar nichts, sowas in der Art hatte ich allerdings auch schon im Hinterkopf. Wie läßt sich der Daten/Zeitaufwand berechnen, der für die 'Koordination' entsteht?

Wobei das noch nichts mit der Zeit zu tun hat, die u.a. auch aus server- und clientseitiger Bearbeitungszeit sowie - immens wichtig - den Roundtrips besteht.

Was sind roundtrips?

WAAAAH! ...rum denn das, in Gottfrieds Namen?

... keine einpixeligen gifs? Ist doch vom Ladeaufwand das minimalste, war mein Gedankengang, da für ca. 90% der Grafik nur ein paar bit benötigt werden...

[Cheatah]

Hi,

• (Anzahl der einzelnen Grafiken) * ((Größe des HTTP-Request-Heads)+(Größe des HTTP-Response-Heads))
  Das sagt mir eigentlich gar nichts,

die HTTP-Header sind ohne auch nur ein einziges Byte der Grafik zu beachten einige Kilobyte groß - pro Request.

Wie läßt sich der Daten/Zeitaufwand berechnen, der für die 'Koordination' entsteht?

Den Datenaufwand habe ich umrissen, der Zeitaufwand ist nicht berechenbar. Allenfalls die minimale Zeit ließe sich ungefähr abschätzen, wenn Du davon ausgehst, dass der Client direkt am Server sitzt (was nicht der Fall ist).

Was sind roundtrips?

Der Gang vom Client zum Server und zurück. Ein Trip rundherum.

WAAAAH! ...rum denn das, in Gottfrieds Namen?
... keine einpixeligen gifs?

Nein, das ist ein unglaublicher Overhead für ein qualitativ geringeres Ergebnis.

Ist doch vom Ladeaufwand das minimalste, war mein Gedankengang, da für ca. 90% der Grafik nur ein paar bit benötigt werden...

Die kleinste netztaugliche Grafik_datei_, die ich je sah, hat 42 Byte für 1x1 Pixel. Die Grafik_ressource_ ist nicht nennenswert kleiner als eine (nicht mal allzu) kleine HTML-Datei. Egal wie Du es betrachtest ist es aber mehr als beispielsweise die Zeichenkette " ".

Cheatah

[Reiner]

Die kleinste netztaugliche Grafik_datei_, die ich je sah, hat 42 Byte für 1x1 Pixel.

Jo, mein spacer.gif hat 43 bit.. Was meinst Du mit overhead? Den Rechenaufwand zum stretchen der Grafiken? Sollte ich die einfarbigen slices besser als getrennte gifs, also jedes einzeln laden (also bspw. als 30x40 px gif..)? Macht das einen Unterschied?

Die Grafik_ressource_ ist nicht nennenswert kleiner als eine (nicht mal allzu) kleine HTML-Datei. Egal wie Du es betrachtest ist es aber mehr als beispielsweise die Zeichenkette " ".

Hm ich verstehe leider nicht ganz was Du mir damit sagen willst.. Ich brauch doch die Grafikplatzhalter, damit meine 'Nutzgrafik' dann auch am richtigen Platz erscheint.. Mit Leerstellen (" ") kommt man doch nur grob an die Positionen, das ganze hier sollte aber pixelgenau sein, damit eben ein sauberer Bogen entsteht.
Oder geht das irgendwie mit Leerzeichen ebenso präzise?

[wahsaga]

hi,

Hm ich verstehe leider nicht ganz was Du mir damit sagen willst.. Ich brauch doch die Grafikplatzhalter, damit meine 'Nutzgrafik' dann auch am richtigen Platz erscheint.. Mit Leerstellen (" ") kommt man doch nur grob an die Positionen, das ganze hier sollte aber pixelgenau sein, damit eben ein sauberer Bogen entsteht.
Oder geht das irgendwie mit Leerzeichen ebenso präzise?

nein. aber mit CSS.
margin und padding können "1x1 pixel"-gifs heutzutage eigentlich gut genug ersetzen; deine verwendete technik hingegen ist webdesign des letzten jahrhunderts.

gruss,
wahsaga

[Ingo Turski]

Hi,

Ich brauch doch die Grafikplatzhalter, damit meine 'Nutzgrafik' dann auch am richtigen Platz erscheint.. Mit Leerstellen (" ") kommt man doch nur grob an die Positionen, das ganze hier sollte aber pixelgenau sein, damit eben ein sauberer Bogen entsteht.
Oder geht das irgendwie mit Leerzeichen ebenso präzise?

Wieso überhaupt Leerzeichen und nicht einfach die Grafik 'am Stück' als Hintergrund einbinden?
Abgesehen davon bietet CSS Dir auch bessere Alternativen zur Positionierung von Elementen.

freundliche Grüße
Ingo

[wahsaga]

hi,

die HTTP-Header sind ohne auch nur ein einziges Byte der Grafik zu beachten einige Kilobyte groß - pro Request.

jetzt übertreibst du m.e. aber ein bisschen :-)

habe es gerade interessehalber mal mit michael schröpls http-trace tool auf seiner HP ausprobiert, den URL eines bildes angegeben,

ohne nutzdaten kam ich dabei auch ca. ein halbes bis dreiviertel KB pro bild - was natürlich auch schon nicht zu verachten ist, aber eben noch nicht "mehreren KB" entspricht.

gruss,
wahsaga

[Sven Rautenberg]

Moin!

• (Anzahl der einzelnen Grafiken) * ((Größe des HTTP-Request-Heads)+(Größe des HTTP-Response-Heads))

Das sagt mir eigentlich gar nichts, sowas in der Art hatte ich allerdings auch schon im Hinterkopf. Wie läßt sich der Daten/Zeitaufwand berechnen, der für die 'Koordination' entsteht?

Du darfst davon ausgehen, dass pro Anforderung einer Bilddatei vom Webserver zusätzlich zu den nutzbaren Daten (also die Bytes, die auf deiner Festplatte angezeigt werden) noch mindestens ein Kilobyte an HTTP-Daten übertragen wird.

Wenn du also 15 KB an Bilddaten hast, und das ganze in 20 Einzeldateien verteilst, dann kommen nochmal geschätzte 20 KB an Downloadmenge zusammen, die sinnlos für HTTP verbraten werden.

Wobei das noch nichts mit der Zeit zu tun hat, die u.a. auch aus server- und clientseitiger Bearbeitungszeit sowie - immens wichtig - den Roundtrips besteht.

Was sind roundtrips?

Das ist Zeit, die vergeht, während der Browser eine neue Grafik vom Server anfordert und auf das Ergebnis wartet.

In HTTP/1.1 (das benutzen aktuelle Browser) sind üblicherweise nur vier parallele Verbindungen zum Server erlaubt. Das bedeutet: Nur vier Grafiken werden gleichzeitig geladen.

Rechnen wir mal etwas herum: Du hast 15 KB an Dateien. Der Einfachheit halber 15 Stück zu 1 KB.

Sobald der Browser die HTML-Seite geladen hat und Bilder findet, startet er den Download derselben. Also vier Bilder. Die 1 KB mal 4 plus 1 KB für HTTP mal 4 macht 8 KB. 8 KB übertragen sich bei einem 56K-Modem in grob 2 Sekunden. Danach kommen die nächsten vier Grafiken - nochmal 2 Sekunden. Insgesamt werden die 15 Grafiken in 4 Durchgängen mit insgesamt 8 Sekunden Zeitdauer übertragen. Wobei zu beachten ist, dass die Anforderung einer Grafik nicht nur Downloadzeit benötigt, sondern auch Zeit vergeht, bis der Server endlich anfängt, zu senden. Also sind 8 Sekunden schon sehr idealisiert.

Im Gegensatz dazu hätte eine Gesamtgrafik sicherlich auch nur 15 KB Größe und würde zum einen wesentlich einheitlicher geladen werden, und andererseits würde es nur 4 Sekunden dauern - das aber dann tatsächlich so schnell, weil nicht noch auf weitere Teile gewartet werden muß.

Du hast also abzuwägen, ob du 15 KB als große Blockgrafik willst, die definiert von oben nach unten sichtbar lädt und 4 Sekunden (bei Modems) benötigt, oder ob du Minimum 8 Sekunden benötigen willst, um wild zusammengewürfelte Einzelteile zu laden.

Und noch ein Argument: Wer DSL hat, lädt an der Einzelgrafik natürlich fast gar nicht mehr, die Grafik ist eher spontan da, sobald sie angefordert wurde. Aber auch ein DSL-Benutzer wartet geduldig, wenn viele einzelne Grafiken geladen werden sollen, weil viele Grafiken einzeln angefordert werden müssen, und der Server dann eine Verzögerung darstellt. Insbesondere, wenn sich der Server wegen hoher Auslastung jedesmal zwei Sekunden Zeit läßt, bevor er eine Grafik sendet (und das Senden selbst in Nullkommanichts geschehen ist), wartet man bei einer Grafik eben nur genau einmal diese zwei Sekunden - bei den Schnipseln mehrfach 2 Sekunden.

WAAAAH! ...rum denn das, in Gottfrieds Namen?
... keine einpixeligen gifs? Ist doch vom Ladeaufwand das minimalste, war mein Gedankengang, da für ca. 90% der Grafik nur ein paar bit benötigt werden...

Wie oben erklärt: 42 Byte plus ein Kilobyte für die HTTP-Anforderung plus die Zeit, die vergeht, damit das Bild beim Browser ankommt. Dann doch lieber ein paar Byte fürs CSS spendieren und auf Blindgifs verzichten.

- Sven Rautenberg

[wahsaga]

hi,

Meine 'Nutzgrafik' ist ca. 15 kb groß. Also die Summe aller slices, die ich für die 'Sichel' selbst brauche.

jesses, und dafür machst du jetzt hier so'n aufstand ...? :-)

die werden mit meiner dsl-verbindung sicher schneller geladen, als ich einmal blinzeln kann.
und ein modem-user ist es sowieso gewöhnt, dass sich seiten langsam und stückweise aufbauen - also brauchst du für den keine extrawurst braten.

gruss,
wahsaga

[Reiner]

jesses, und dafür machst du jetzt hier so'n aufstand ...? :-)

die Ladezeit scheint auch irgendwie nicht das Problem zu sein..
Es ist nur irgendwie Schade, dass beim Bildaufbau überall 'Zahnlücken' entstehen und dadurch irgendwie die 'Unschuld' dieser runden Form verlorengeht :D da die Illusion schon zu Beginn zerstört wird, (à la 'hoe, sind ja alles nur Stückchen aneinandergeklebt..')..

[Cheatah]

Hi,

Nur sieht das etwas merkwürdig aus, da (nach Zufallsprinzip?)

nach der browserindividuellen Request-Optimierung.

Kann man irgendwie die Reihenfolge beim Laden bzw. beim Bilschirmaufbau beeinflussen,

Nein. Verwende eine einzige Grafik.

Cheatah

[Reiner]

Nein. Verwende eine einzige Grafik.

Eine große Grafik braucht aber doch viel länger als viele kleine..

[Cheatah]

Hi,

Eine große Grafik braucht aber doch viel länger als viele kleine..

nein, *wesentlich* weniger. Nicht nur, dass es sehr viel weniger Bytes sind, es sind vor allem weniger Roundtrips. Selbst wenn man die Beschränkung von HTTP/1.1 auf maximal vier Connections vom Client zum selben Host ignoriert.

Cheatah

[Cybaer]

Hi,

Eine große Grafik braucht aber doch viel länger als viele kleine..

Im Gegenteil.

Aber speichere das GIF am besten im GIF97-Format/interlaced ab. Dann kann der Surfer beim Aufbau zuschauen.

Ansonsten: Ggf. Grafiken vorab cachen.

Falls Du aber den Kacheleffekt beim Laden gern hast, kannst Du sie ja mittels eines JavaScripts zeitverzögert laden:
1. Normale IMG-Tags (für Nicht-JS-Nutzer)
2. Anschließend sofort mit JavaScript durch kleine Blind-GIFs "überladen"
3. Zeitverzögert die einzelnen Original-GIFs laden

;-)

Gruß, Cybaer

[wahsaga]

hi,

Dazu hab ich die Grafik in Bildschirmgröße erstellt

interessant - woher kennst du meine bildschirmgrösse?
und wie kommst du darauf, dass zwischen dieser und der grösse meines browserfensters irgendein zusammenhang bestehen würde?

gruss,
wahsaga

[Reiner]

interessant - woher kennst du meine bildschirmgrösse?
und wie kommst du darauf, dass zwischen dieser und der grösse meines browserfensters irgendein zusammenhang bestehen würde?

Die Bezeichnung Bildschirmfüllend ist nicht ganz korrekt, dient aber dazu, das ganze relativ schnell und vereinfacht zu erklären.

Eigentlich ist die HP ein Ausschnitt von 800 x 500 px, align=center, valign=top.
Ich glaube ich weiß auf was Du raus willst...
User mit geringeren Auflösungen haben hier leider Pech gehabt. Ist vielleicht nicht ganz freundlich von mir, aber das ist meine 'freie künstlerische' Entscheidung.
Ich lasse auch keine Hochglanzprospekte mit 3 cm großen Lettern drucken, nur weil ne ganze Menge Kurzsichtiger Menschen es besser lesen könnten..

[Struppi]

Ich lasse auch keine Hochglanzprospekte mit 3 cm großen Lettern drucken, nur weil ne ganze Menge Kurzsichtiger Menschen es besser lesen könnten..

Eine Internetseite ist ja auch kein Hochglanzprospekt.
http://www.woodshed.de/werbeagenturen/index.html

Aber wenn dein Hauptanliegen ist Bilder anzubieten, hast du Recht.

Struppi.

[Reiner]

Eine Internetseite ist ja auch kein Hochglanzprospekt.
http://www.woodshed.de/werbeagenturen/index.html

Aber wenn dein Hauptanliegen ist Bilder anzubieten, hast du Recht.

Struppi.

Ich verstehe Dich schon ziemlich gut, ist teilweise auch angenehm wenn man im kleinen Fenster alles noch im Blick hat (wobei es hier ja auch hier Grenzen gibt), aber Seiten wie diese

http://www.draenert.de

sind einfach nur ästetisch und in dieser Form nicht anders machbar, sprich immer ein Kompromiß..

[Struppi]

http://www.draenert.de

ja, ein typisches Beispiel, ich hab keine Ahnung was diese Firma von mir will oder was sie mir anbieten kann, das wird auf dieser Seite auch in keiner Weise deutlich.

Und dann vier Klicks später, eine ziemlich verwurschtete Seite (bzw. im orangen Zweig bleibe ich stecken weil der Seite mein Flash nicht gefällt), ein wirklich typisches Produkt einer Werbeagentur. Nur schön zum angucken, aber als Internetseite nicht zu benutzen.

Struppi.

[Reiner]

Und dann vier Klicks später, eine ziemlich verwurschtete Seite [...] Nur schön zum angucken, aber als Internetseite nicht zu benutzen.

kommt eben immer drauf an, was man erreichen will..
Die o.g. HP dient eben dazu, die exclusiven Möbel zu präsentieren.
Zielgruppe ist also nicht wirklich jedermann, sondern eher Eingeweihte, die wissen, was Sie suchen.. Exclusive Möbel wollen auch im Hochglanz präsentiert werden, ich finde, das haben die Jungs recht gut gemacht..
Wobei Du schon recht hast, der Einstieg ist verwirrend..

[at]

Hallo.

kommt eben immer drauf an, was man erreichen will..

Kommunikation?

Die o.g. HP dient eben dazu, die exclusiven Möbel zu präsentieren.

Dies wäre aber auch funktional praktischer möglich, ohne Abstriche in der Anmutung machen zu müssen.

Zielgruppe ist also nicht wirklich jedermann, sondern eher Eingeweihte, die wissen, was Sie suchen..

Wessen Zielgruppe ist schon jedermann? Und weshalb entschuldigt dies technische und und die Handhabung betreffende Mängel?

Exclusive Möbel wollen auch im Hochglanz präsentiert werden, ich finde, das haben die Jungs recht gut gemacht..

Sie reihen sich zumindest in fast jeder Hinsicht gut in die Präsentationen anderer Unternehmen dieses Metiers ein.

Wobei Du schon recht hast, der Einstieg ist verwirrend..

Und was mir noch aufgefallen ist: Dein Doppelpunkt ist umgekippt ;-)
MfG, at

[Auge]

Hallo

Wobei Du schon recht hast, der Einstieg ist verwirrend..

Und was mir noch aufgefallen ist: Dein Doppelpunkt ist umgekippt ;-)

Man kann ihn aber auch fest verkeilen /:\ ;-)

Tschö, Auge

[Schuer]

Hallo,

Nur sieht das etwas merkwürdig aus, da (nach Zufallsprinzip?)hier und da nach und nach ein Stückchen erscheint und erst zum Schluß das Gesamtbild, nämlich diese Sichel komplett ist.

Internetnutzer sind gewohnt, dass sich Webseiten meist nach einem solchen Prinzip aufbauen und die Inhalte nicht wie etwa im (vorgeladenen) Flash-Movie in einer vorbestimmten Reihenfolge präsentiert werden.

Insofern ist dein Problem eigentlich gar kein Problem :-)

Kann man irgendwie die Reihenfolge beim Laden bzw. beim Bilschirmaufbau beeinflussen,

Nein, das ist nicht möglich. Abgesehen davon solltest du, wie Cheatah schon anmerkte, die Sichel u.U. als ein Bild anlegen anstelle von zahlreichen Einzelbildern. Sollte dadurch allerdings zuviel Leerraum (also ungenutze Bereiche, die jedoch aufgrund des Bildformats mitgespeichert werden) im Bild sein, was bei einer Sichel anzunehmen ist, so dass die Dateigröße erheblich größer würde als zusammengesetzte Einzelbilder, ist deine aktuelle Methode vielleicht doch angebrachter - auch wenn dadurch sehr viel mehr Requests und unnötige Header entstehen, als bei nur einem Bild.

Gruß,
_Dirk

[Andreas Korthaus]

Hallo Dirk!

Sollte dadurch allerdings zuviel Leerraum (also ungenutze Bereiche, die jedoch aufgrund des Bildformats mitgespeichert werden) im Bild sein, was bei einer Sichel anzunehmen ist, so dass die Dateigröße erheblich größer würde als zusammengesetzte Einzelbilder, ist deine aktuelle Methode vielleicht doch angebrachter - auch wenn dadurch sehr viel mehr Requests und unnötige Header entstehen, als bei nur einem Bild.

Ist das überhaupt möglich? Wenn man bei gleichem Informationsgehalt (Qualität) mit mehreren Einzelbildern eine kleiner Gesamtgröße erreichen könnte als bei einem Gesamtbild, dann stimmt doch was am Algorithmus der Komprimierung nicht, oder? Bei Gif würde ich mal behaupten das ist nicht möglich, bei JPG kann ich es mir auch nicht vorstellen. Ich denke das hat man früher gerne gemacht, als alle noch viel langsamere Modems hatten als heute(28k und langsamer...), dann hätte der Aufbau eines großen Bilder viel zu lange gedauert und der Besucher hätte nicht so lange gewartet, aber wenn man "miterlebt" wie sich das Bild aufbaut, ist das vermutlich anders.

Grüße
Andreas

[Schuer]

Hallo Andreas,

Ist das überhaupt möglich? Wenn man bei gleichem Informationsgehalt (Qualität) mit mehreren Einzelbildern eine kleiner Gesamtgröße erreichen könnte als bei einem Gesamtbild, dann stimmt doch was am Algorithmus der Komprimierung nicht, oder?

in der Tat, ich lag falsch mit meiner Aussage. Habe gerade mal ein bißchen rumgespielt und festgestellt, dass sowohl gif als auch jpg "am Stück" besser komprimieren als die entsprechend aufgeteilten Einzelbilder.

Hätte ich wirklich nicht vermutet :-)

Gruß,
_Dirk

[Heiko Jägle]

Hi Andreas (und natürlich all die anderen)

Ist das überhaupt möglich? Wenn man bei gleichem Informationsgehalt (Qualität) mit mehreren Einzelbildern eine kleiner Gesamtgröße erreichen könnte als bei einem Gesamtbild, dann stimmt doch was am Algorithmus der Komprimierung nicht, oder?

Man kann kleinere Datenmengen erreichen, in dem man z.B. Bildbereiche, die nur aus einer einfarbigen Fläche bestehen, mit einer GIF-Datei mit reduzierter Farbpalette speichert (z.B. 2-Farbenpalette). Für Bildbereiche mit mehr "Bildinformationen" im Sinne von mehrfarbigen Pixeln, kann ein neues Teilbild mit "größerer" Farbpalette erstellt werden. Bei JPG-Bildern kann man ähnliches durch Verändern der Kompressionsrate erreichen (wenig Details -> hohe Komprimierungslevel nehmen; viel Details -> geringen Komprimierungslevel nehmen).

Ob sich all diese mühevolle Kleinarbeit noch lohnt, darf bei zunehmender Übertragungsgeschwindigkeiten bezweifelt werden.

Heiko

[at]

Hallo.

Man kann kleinere Datenmengen erreichen, in dem man z.B. Bildbereiche, die nur aus einer einfarbigen Fläche bestehen, mit einer GIF-Datei mit reduzierter Farbpalette speichert (z.B. 2-Farbenpalette).

In GIF-Bildern werden einfarbige Flächen ohnehin zeilenweise zusammengefasst, so dass deine Vorgehensweise in kaum mehr Fällen als dem einer vertikal linierten Fläche einen nennenswerten positiven Effekt hervorbrächte.
MfG, at

[Sven Rautenberg]

Moin!

Man kann kleinere Datenmengen erreichen, in dem man z.B. Bildbereiche, die nur aus einer einfarbigen Fläche bestehen, mit einer GIF-Datei mit reduzierter Farbpalette speichert (z.B. 2-Farbenpalette).

In GIF-Bildern werden einfarbige Flächen ohnehin zeilenweise zusammengefasst, so dass deine Vorgehensweise in kaum mehr Fällen als dem einer vertikal linierten Fläche einen nennenswerten positiven Effekt hervorbrächte.

In GIF-Bildern werden zeilenweise auftretende, identische Muster zusammengefaßt. Sowohl horizontale Linien als auch vertikale Linien werden identisch gut komprimiert, möchte ich behaupten. "Gift" für die Kompression bei GIF ist die Unterschiedlichkeit.

- Sven Rautenberg

[at]

Hallo.

In GIF-Bildern werden zeilenweise auftretende, identische Muster zusammengefaßt. Sowohl horizontale Linien als auch vertikale Linien werden identisch gut komprimiert, möchte ich behaupten. "Gift" für die Kompression bei GIF ist die Unterschiedlichkeit.

Dann muss ich bei meinen Tests wohl etwas anderes falsch gemacht haben.
MfG, at

[coldarchon]

Dazu hab ich die Grafik in Bildschirmgröße erstellt und in slices unterteilt, die dann vom browser zum Gesamtbild zusammengebaut werden.
Nur sieht das etwas merkwürdig aus, da (nach Zufallsprinzip?)hier und da nach und nach ein Stückchen erscheint und erst zum Schluß das Gesamtbild, nämlich diese Sichel komplett ist.

also wenn Du slices benutzt und der Bildaufbau sieht nicht gut aus, mußt du einfach viel kleinere Bilder benutzen. Dann sieht das nämlich sogar richtig witzig aus. Mit einem Filter per CSS würde man sogar noch mehr herausholen ...

[at]

Hallo.

also wenn Du slices benutzt und der Bildaufbau sieht nicht gut aus, mußt du einfach viel kleinere Bilder benutzen. Dann sieht das nämlich sogar richtig witzig aus. Mit einem Filter per CSS würde man sogar noch mehr herausholen ...

Aus dem Magen? ;-)
MfG, at

[Hans35]

Hallo!

Meine HP besteht aus sehr viel Grafik...
Kann man irgendwie die Reihenfolge beim Laden bzw. beim Bilschirmaufbau beeinflussen...?

Ich wundere mich ein wenig über die vielen "geht nicht"-Antworten.

Ich hab mich mal an dem Problem versucht (als JS-Übung), bin aber (aus Zeitgründen) über eine IE-Version noch nicht hinausgekommen.

FunktionsPrinzip: Erst nur ein Bild laden. Wenn es da ist: Neue Seite mit Bild 1 und 2, dann mit Bild 1, 2 und 3 usw., wobei alle Bilder außer dem letzten jeweils aus dem Cash geholt werden.

Anwendungsfall: Bildergalerie: Solange man das 1. Bild betrachtet, ist Zeit genug, das 2. zu laden, usw. Auch bei Modem-Verbindung ist das erste Bild sehr schnell da und kann angeschaut werden.

Hier mein Prototyp des Programms:
Source:    view-source:http://www.vonsanssouci.de/Bildergalerie1.4.htm
Anschauen: http://www.vonsanssouci.de/Bildergalerie1.4.htm

Gruß
Hans35

Danke, Reiner

[Sven Rautenberg]

Moin!

Ich wundere mich ein wenig über die vielen "geht nicht"-Antworten.

Das liegt daran, dass du das Problem nicht verstanden hast, würde ich sagen.

Anwendungsfall: Bildergalerie: Solange man das 1. Bild betrachtet, ist Zeit genug, das 2. zu laden, usw. Auch bei Modem-Verbindung ist das erste Bild sehr schnell da und kann angeschaut werden.

Es geht hier nicht um eine Bildergalerie, sondern um eine einzige Seite, die (mehr oder weniger) sofort, zumindest aber nicht bruchstückhaft (was die Grafik betrifft) angezeigt werden soll.

Anschauen: http://www.vonsanssouci.de/Bildergalerie1.4.htm

Da passiert nichts.

- Sven Rautenberg

[Hans35]

N'Abend,

Ich wundere mich ein wenig über die vielen "geht nicht"-Antworten.
Das liegt daran, dass du das Problem nicht verstanden hast, würde ich sagen.

Kann sein, vielleicht aber auch nicht.

Ich hab's halt so verstanden, dass er sein Bild in einzelne Teilbilder aufteilen will, und unter Kontrolle bleiben soll, in welcher Reihenfoge diese Teilbilder nacheinander (und keinesfalls teilweise parallel gleichzeitig) auf dem Bildschim erscheinen. Dafür wäre das angegebene das Script geeignet. Was für den Zweck überflüssig ist (Zwischentexte und so), kann man ja weglassen.

Oder war die Fragestellung anders?

Es geht hier nicht um eine Bildergalerie, sondern um eine einzige Seite, die (mehr oder weniger) sofort, zumindest aber nicht bruchstückhaft (was die Grafik betrifft) angezeigt werden soll.

Sofort geht halt nicht, wenn Übertragungsweg oder Server das nicht hergeben, das wurde hier bereits diskutiert. Aber die Reihenfolge der Teilbilder kann man wenigstens in den Griff bekommen.

Anschauen: http://www.vonsanssouci.de/Bildergalerie1.4.htm
Da passiert nichts.

Das solltest du schon etwas genauer erläutern. Kein Bild oder was?

Das Script ist nur für den IE ausgetestet, hab ich ja dazugeschrieben. Im Moment hab ich hier grad den Konqueror, der kann's aber auch. Nur "source-view" geht da nicht.

Das Script soll auch nur zeigen, dass man das Problem prinzipiell in den Griff kriegen kann. Ist hier keine ausgetestete Lösung für "alle" Browser.

Gruß
Hans35