Lange Ladezeiten auf Grund von .GIF ToolBar

[WernerDietrich]

Guten Abend liebe Community,

ich habe folgendes Problem:

Ich benutze auf meiner Webseite eine Toolbar, welche im CSS wie folgt klassifiziert ist:

.top-bar{
    background-image: url("bg_toolbar.gif");

Nun ist es so, dass durch diese animierte Toolbar die Ladezeit meiner Seite sehr lange beträgt und andere Inhalte erst nach 5 Minuten geladen werden..

Ich möchte aber ungern auf diese Toolbar verzichten. Was kann ich da tun? Ich bin echt ratlos.. freue mich auf Rat eurerseits.

MfG, Werner

[hellbringer]

Zu wenig Informationen. Was genau braucht so lange? Der HTTP-Request? Wie groß ist diese GIF-Datei? Und warum blockiert sie das Laden von anderen Inhalten?

[WernerDietrich]

Ja genau, ich habe alle Files via SFTP auf meinen Webserver geladen.. die index.php braucht ewig zum laden und meine Buttons zB oder .jpg Grafiken auf der Seite werden nicht angezeigt.. zumindest anfangs nicht.. meine Toolbar hat die Maße 2412 x 482 px und ist 107 MB groß.

MfG Werner

[hellbringer]

Ja genau, ich habe alle Files via SFTP auf meinen Webserver geladen..

Das ist eine irrelevante Information.

die index.php braucht ewig zum laden

Was genau heißt das? Wie lange genau? Was davon dauert so lange? Dauert die HTTP-Übertragung so lange? Oder braucht der Server so lange zum Antworten? Oder braucht clientseitiges JavaScript so lange?

und meine Buttons zB oder .jpg Grafiken auf der Seite werden nicht angezeigt.. zumindest anfangs nicht.. meine Toolbar hat die Maße 2412 x 482 und ist 107 MB groß.

LOL. Naja, das ist natürlich ganz großer Käse. Eine 107 MB große GIF-Datei. Wer möchte bitte so eine Webseite lesen, die ein 107 MB GIF lädt? Macht man die Seite am Smartphone auf und Schwupps sind 107 MB vom Datenguthaben weg. Damit macht man sich Freunde...

[WernerDietrich]

Genau, die HTTP Übertragung dauert lange.. es dauert ca 5 Minuten bis alle Inhalte geladen sind und dargestellt werden.. lasse ich das GIF weg, funktioniert alles.. was kann ich tun, damit ich trotzdem das GIF verwenden kann und die Seite schneller lädt?

MfG, Werner

[Zeichen32]

meine Toolbar hat die Maße 2412 x 482 px und ist 107 MB groß.

Das ist doch ein Troll-Post hier, oder?

[hellbringer]

Genau, die HTTP Übertragung dauert lange.. es dauert ca 5 Minuten bis alle Inhalte geladen sind und dargestellt werden.. lasse ich das GIF weg, funktioniert alles.. was kann ich tun, damit ich trotzdem das GIF verwenden kann und die Seite schneller lädt?

Und die Seite verwendest dann nur du selber? Oder glaubst du wirklich, dass sich das jemand anders freiwillig antut?

[WernerDietrich]

Nein, das hier ist kein Troll-Post, ich meine das ernst. Mir ist nun klar, dass es alles an der GIF Datei liegt, die viel zu groß ist.. meine Frage ist daher, wie kann ich diese verkleinern?

[protestix]

Lass die Animation weg und dafür gibt es Programme, die so was können und zudem zu jpg konvertieren.
Alternativ bastelt du dir eine Toolbar aus Einzelbildern oder aus svg.

[hellbringer]

Nein, das hier ist kein Troll-Post, ich meine das ernst. Mir ist nun klar, dass es alles an der GIF Datei liegt, die viel zu groß ist.. meine Frage ist daher, wie kann ich diese verkleinern?

Das hängt stark vom Inhalt ab. Wahrscheinlich indem man ein MPEG-4 Video macht statt einer GIF-Datei. Und man sollte etwas technisches Verständnis über Video-Streaming haben. Also wie genau die Video-Header ausschauen und an welcher Position sie stehen müssen. Also kurz: Man sollte Ahnung davon haben, was man tut. Einfach ein riesiges GIF machen und auf die Seite klatschen wird jedenfalls nicht funktionieren.

[tomBuilder]

Nein, das hier ist kein Troll-Post, ich meine das ernst. Mir ist nun klar, dass es alles an der GIF Datei liegt, die viel zu groß ist.. meine Frage ist daher, wie kann ich diese verkleinern?

schau dir dein gif an in Gimp bspw.
wieviel ebneen hat das ding, wie lange welche auflösung etc...

offtopic:

ich habe vor jahren bei einer krankenkassenwerbung mit immer neuen prozenten und bildern mal verstellen müssen,
das alle alten bilder und prozente mitgeliefert wurden, die werbung war auch recht gross.

Einfach ein riesiges GIF machen und auf die Seite klatschen wird jedenfalls nicht funktionieren.

yes

[Arne Drews]

Man müsste mal einen Screenshot davon sehen, ich erkenn so überhaupt gar keinen Sinn in einer so großen Grafikdatei. Vollkommen egal, ob animiert oder nicht.
Vermutlich ist das per HTML5/CSS3 und evtl. etwas JS abbildbar.

[WernerDietrich]

Es ist eine einfache Toolbar, in welcher ich ein paar Infos und Social Media Links stehen habe. Und diese ist eben animiert, aber ich denke ich werde es mal mit einer kleineren GIF Datei versuchen.

[Arne Drews]

Das hört sich für mich immer noch nach CSS3 und JS an.
Aber solange Du die Ansicht geheim hältst, wird es wohl keine bessere Hilfe geben.

[tomBuilder]

verlink doch einfach mal dein GIF WernerDietrich ,
ist ja eh öffentlich im internet ^^