✔ Erste Website / Ladezeit optimieren

[sepp05]

Hallo Leute,
ich habe nach langer Arbeit endlich meine 1. Website mit CSS fertig gestellt!!
Es ist die Internetpräsenz meiner Firma und sieht auch gut aus - wie ich finde.

Ich bin nur gerade dabei die Ladezeit zu optimieren, was sich bis jetzt nur auf das herunterkomprimieren der JPG's beschränkt hat, weil ich ansonsten keine Idee hab!

Die Seite lädt ungewöhnlich lange - vorallem lädt erst der Content, dann das Design...
Ich habe hier in der Firma DSL 16000 und trotzdem dauerd es ca. 4-5 Sekunden bis ich das komplette Design sehe!

Könnt ihr mir helfen?

Gruß Sepp05

 

[Gumbo]

28 Grafiken sind wirklich viel. Vor allem diese vielen Anfragen wirken sich auf die Ladezeit aus.

 

[sepp05]

Ok erst mal Danke für diesen Link - Die Seite kannte ich noch nicht!

Warum lädt denn der Content früher als das Design? Die Reihenfolge des Ladens wird doch durch die Abfolge im Quellcode festgelegt oder? Und das Layout wird sogar im Head-Bereich beschrieben also als aller erstes!?

Prügelt mich wenn ich was falsches vermute

 

[Gumbo]

Wenn ein Dokument aber aus mehreren Objekten besteht, also beispielsweise nicht nur Text sondern auch Grafiken, externe Stylesheets etc., müssen diese alle einzeln angefragt werden. Dies benötigt wieder Zeit und der Browser fängt oft schon an, das Dokument auf Basis der Informationen, die er zu diesem Zeitpunkt bereits kennt, zu rendern.

 

[sepp05]

Okay das leuchtet mir ein!
Das heißt aber es gibt 3 Möglichkeiten:

- Einfach zu viele Grafiken auf der Seite
- Umständlicher bzw. aufgeblasener Quellcode (aufgrund meiner Unerfahrenheit)
- Zu langsamer Webspace?!

Oder?
Gruß Sepp05

 

[StupidBoy]

- Umständlicher bzw. aufgeblasener Quellcode (aufgrund meiner Unerfahrenheit)

Naja, es gibt sicherlich Seiten die deutlich aufgeblaserenen Quellcode haben und ich muss sagen, dass sich die Ladezeit deiner Seite bei mir doch in sehr erträglichen Grenzen hält (~2 Sekunden).
Auch ist ein bisschen überflüssiger Quellcode kaum eine große Bremse (vorausgesetzt, die Verbindung ist entsprechend) , wer komprimiert schon seine HTML, CSS und JS Dateien um noch ein paar Bytes zu sparen?
Wenn du aber noch etwas am Quellcode schrauben möchtest, dann könntest du Passagen wie folgende sicherlich auch etwas sinnvoller gestalten, den das macht wenig Sinn:

<tr align="center" valign="middle">
              <td colspan="2"><div align="right" class="Stil2"><br />
              </div></td>
            </tr>

Was mir aufgefallen ist, ist dass die die Grafiken die bei jeder Seite wechseln relativ lange brauchen bis sie geladen sind. Hier könntest du versuchen diese bereits auf der ersten Seite, nachdem diese aufgebaut ist, vorzuladen um diese schon mal in dem Cache des Client-Browsers zu hinterlegen. Allerdings fällt dadurch natürlich zusätzlicher/ggf. unnötiger Traffic an.

MfG

 

[sepp05]

@stupidBoy... THX

Aber wie stelle ich das an, dass die wechselnden Grafiken erst geladen werden, wenn die Seite sich schon komplett aufgebaut hat?

 

[deostift]

Konkret zu Deiner Seite:
Es sind eindeutig zu viele Grafikelemente für die Einstiegsseite. Versuch das unbedingt zu kürzen, zumal die Bilder nicht gerade klein sind. Empfehlen würde ich Dir eine Startseite auf der Du den User kurz und knapp über die Inhalte informierst oder sowas in der Art - jedenfalls wurden dann schon die Grundelemente Deiner Seite in den Browser-Cache geladen.

Danach kann der User gerne auf "Wir über uns" klicken und erhält dann die zusätzlichen Content-Bilder. Jedenfalls würde ich Dir abraten, dem Besucher alle Informationen schon beim ersten Einstieg auf Deine Seite um die Ohren zu hauen.

------------------

Zum Thema "wie werden die Elemente vom Browser geladen" .. als ich mir vor einiger Zeit diese Frage auch stellte, hing das auch sehr starkt von der Rendering-Engine des jeweiligen Browsers ab. Bei manchen wurde z.B. der Text sofort dargestellt und erst Bilder schrittweise nachgeladen - historisch betrachtet machte das auch Sinn, da man den Text schon mal anfangen konnte zu lesen und danach das Bild sich anschaut.

Man konnte aber hier auch mit etwas JavaScript gegensteuern.

------------------

 

[deostift]

@stupidBoy... THX

Aber wie stelle ich das an, dass die wechselnden Grafiken erst geladen werden, wenn die Seite sich schon komplett aufgebaut hat?

Hast Du doch schon eingebunden --- im Prinzip via JavaScript Funktion die durch den onload() Event im Body-Tag angestoßen wird.