Ladezeit beschleunigen, Tipps

**Quetschi** · 25.09.2008, 08:24

Minimales Finetuning geht evtl. noch beim Apachen - z.B. mit ExpiresByType für Bild-, Javascript- und Css-Dateien sofern sich diese nicht so kurzfristig ändern, dass es anderweitige Probleme dadurch geben könnte.

Somit würde z.B. der Browser beim Aufruf der nächsten Seite nicht wieder versuchen die css-Dateien und Hintergrundbilder neu zu requesten worauf er vom Browser sowieso nur ein not Modified zurückbekommen würd. Da lässt sich einiges an Traffic und Prozessorzeit für Request-/Response-Header sparen.

Übrigens ist in der httpd.conf für .jpg-Dateien häufig ein falscher Mime-Type für ExpiresByType eingegeben - da steht häufig ExpiresByType image/jpg A3600 statt ExpiresByType image/jpeg A3600 was dazu führt, dass eben die Browser, die sich dann an das CacheControlling halten die .jpg immer wieder neu laden möchten.

**nOe** · 25.09.2008, 08:25

Ich glaube, dass wirst du nicht weiter verbessern können. Denn am Ende entscheidet sowieso die Bandbreite des Besuchers.. Aber die von dir beschriebenen Ansätze sind schon mal gut..

OffTopic:
Link?

Gruß, nOe

**fabio** · 25.09.2008, 08:42

okey, das mit dem expirebytype schau ich mal an. die CSS sind statisch, keinen dynamischen inhalt, könnte also gehen. ich muss nur schauen ob ich da beim hoster was machen kann, da weder root noch vroot server.

ich habe halt so die erfahrung gemacht, dass die seiten oftmals nicht durch den anschluss des users gebremst werden, sondern vielmehr durch die anzahl zu ladenen dateien.

also der browser hat schneller eine datei mit 100kb geladen, als 100 mit je 1kb. liegt wohl daran, dass der server bei letzterem 100mal angepingt werden muss und 100mal ein request geben muss.
deswegen versuchte ich eben die einzelnen dateien zusammenzufügen.

ich kann die seite leider noch nicht zeigen, weil noch im aufbau, und ich will nicht dass google bots die unfertige homepage aufnehmen. kann man die irgendwie abhalten? dann könnte ich sie mal uploaden.

**Quetschi** · 25.09.2008, 09:07

Müsst jetzt nachgucken, aber IMHO kann man die Directiven auch in einer .htaccess setzen.

Wegen Googlebot - der hält sich meines Wissens nach an die robots.txt - damit kannst du ihn vom Spidern abhalten.

Früher kursierte tatsächlich das meiner Meinung nach falsche Gerücht ein großes Bild würde schneller geladen, wenn man es in viele kleine zerstückelt - IMHO war das Quatsch, weil tatsächlich noch mehr durch Request-/Response-Header draufgeht. Bei langsameren Verbindung war der Vorteil nur der, dass der Nutzer eher was am Bildschirm sieht - wenns auch nur kleine Stücke sind.

**derHesse** · 25.09.2008, 09:18

Original geschrieben von fabio

also der browser hat schneller eine datei mit 100kb geladen, als 100 mit je 1kb. liegt wohl daran, dass der server bei letzterem 100mal angepingt werden muss und 100mal ein request geben muss.
deswegen versuchte ich eben die einzelnen dateien zusammenzufügen.

Hier würde ich alles von PHP zusammenbauen (fopen und header, ist hier das Stichwort) und anschließend cachen, damit nicht bei jedem Aufruf alles neu gerendert/gerechnet werden muss.
So bleibt dir auch weiterhin beim Entwickeln die Übersicht deiner einzelnen Skripte erhalten.

Original geschrieben von fabio

ich kann die seite leider noch nicht zeigen, weil noch im aufbau, und ich will nicht dass google bots die unfertige homepage aufnehmen. kann man die irgendwie abhalten? dann könnte ich sie mal uploaden.

Du kannst den Google auch per .htaccess aussperren. Die IPs von google sind ja allgemein bekannt.
Stell sich nur noch die Frage wie Google das wertet,wenn du dann später deine Inhalte spidern lassen willst.

**unset** · 25.09.2008, 09:50

Keine ahnung, ob das iphone das unterstützt, aber du kannst deine seiten auch komprimiert senden.

Ansonsten sollte es mittels robots.txt kein problem sein, spider am indizieren deiner seite zu hindern. Denn der html-quelltext ist auch noch mal so ein flaschenhals. Wenn ich lese, dass du 'alles mit divs' gemacht hast, wette ich, dass Da auch noch mal ordentlich was zu optimieren ist ...

**PHP-Desaster** · 25.09.2008, 13:06

Keine ahnung, ob das iphone das unterstützt, aber du kannst deine seiten auch komprimiert senden.

Das schickt dir der Browser ja mit

Code:

Accept-Encoding: gzip,deflate

oder halt nix.

**fabio** · 25.09.2008, 14:22

hi

also, zurück vom hörsaal.
also, hab die seite mal mit robots.txt auf ne subdomain gestellt.
http://interni.fplog.ch/

ist noch nicht fertig, das foto ist noch ein "dummyfoto" von der (seeehr alten und zum glück nicht von mir gestalteten) alten homepage. auch der text ist natürlich noch nicht vollständig. links gehen noch nicht, und das einzige bisschen PHP ist das menu (welches noch nichtmal fertig ist) ^^
schreibfehler sind gut möglich, mein dad hat den text geschrieben, und ja, hehe, der macht viele fehler. wie gesagt, noch lange nicht die finale fassung, weswegen ich googleindexing verhindern will.

sieht man auf den ersten blick grad was zu verbessern? (ja, mir ist die farbe auch etwas zu grell aber hey chef sagts ich tus

)

**mcmurphy** · 25.09.2008, 15:17

sieht man auf den ersten blick grad was zu verbessern?

Statt nur auf div's zu setzen mehr die "normalen" Html Tags nutzen...
zb.
<div id='logo'><img src='/img/logo.png' alt='Logo interni raumgestaltung und innenarchitektur'></div>

wäre bei mir:
<h1>raumgestaltung und innenarchitektur</h1>

in CSS dann

PHP-Code:


h1 {

      width:225px;

height:80px;

text-indent:-5000px;

background-image:url(pfad/zum/logo.png);

}

oder bei
<div id="navi">
<ul>
kannste doch der ul direkt ne id geben und sparst dir das div....

**PHP-Desaster** · 25.09.2008, 15:23

PHP-Code:


text-indent:-5000px;

Finde ich persönlich jetzt nicht viel sauberer ^^

**mcmurphy** · 25.09.2008, 15:33

@php-desaster: ok, da kann man jetzt eine diskussion drüber führen...
ich finds besser weil
- kürzer als die div methode (Thread heißt ja ladezeit verkürzen)
- (für mich

) logischer - ist ja die Überschrift der Seite
- so kann der Begriff "raumgestaltung und innenarchitektur" auch von einer SUMA erfasst gehen
- der Begriff und nicht die Grafik in diesem Fall das entscheidende ist

weiter unten im Code:
<div id='fotoblock'><img src='/img/profil.jpg' alt='foto fuer unterseite profil'></div>

würde ich natürlich auch als Grafik einbinden, aber selbst da kannste ja das div rausnehmen und dafür
<img src='/img/profil.jpg' id='fotoblock' alt='foto fuer unterseite profil' /> schreiben

**fabio** · 25.09.2008, 16:16

ja, gerade beim logo werde ich noch einiges ändern, ua dass es das logo evt möglichst getreu als text anzeigt, und dann beim laden das image drübergeladen wird.
die sache warum noch ein <div> um das menu ist unter anderem auch, dsas wenn man die textgrösse viel grösser macht, dass dieser sich nicht mit der adresse überlappt, sondern das DIV sich dann wir ein "iframe" mit scrollleisten verhält. (selbiges passiert auch beim text).
zudem werde ich dann noch ein print-css file machen, so dass die seite für den druck besser angepasst wird.
und dort ist es teilweise noch gut wenn man mit divs arbeiten, weil man diese dann dort schön einfach ausblenden kann (für was bräuchte es zb ein "menu" auf einer gedruckten seite

).

edit:
das mit den fotos im fotoblock hat noch einen anderen grund, und zwar werden dort die fotos per scriptaculous/selfmadejs als diashow eingespielt (ähnlich wie auf einer anderen page von mir www.ursulahuerlimann.ch ), und ich dann eben mehr als nur ein <img> tag in diesem div container habe, und jeweils einfach die margin-left verändere (dass sich das bild wie verschiebt).

**mcmurphy** · 25.09.2008, 16:27

per scriptaculous/selfmadejs als diashow eingespielt

is nen Argument

**fabio** · 25.09.2008, 17:20

ja, wobei ich wahrscheinlich nicht scriptaculous nehmen werde, wäre etwas übertrieben, nur für ein "von 0px margin, nach -500px margin" befehl ne komplette vollumfangige bibliothek zu nehmen.

Ladezeit beschleunigen, Tipps