Mooff
Ex-Admin
- Joined
- Aug 2, 2002
- Messages
- 25,427
- Points
- 0
UF CSS-Sprites vBulletin Add-On
Ein wichtiger Punkt bei der Benutzung von Webseiten ist die Geschwindigkeit. Dies gilt gleichmaßen für Benutzer, wie auch für Suchmaschinen. Lange Ladezeiten bei Webseiten sind nervig und störend, da man als Benutzer nichts anderes machen kann als zu warten. Aus diesem Grund versuchen wir vom United-Forum die Ladezeiten unserer Seite so kurz wie möglich zu gestalten. Eine gute Möglichkeit die Geschwindigkeit zu verbessern sind dabei CSS-Sprites - eine Funktion die von vBulletin leider nicht angeboten wird.
Wir haben uns deshalb dazu entschlossen selber ein CSS-Sprites Addon für vBulletin zu erstellen.
In dem Artikel werde ich erst kurz erklären, was CSS-Sprites sind, warum sie den Seitenaufbau beschleunigen. Welche Meinung google dazu hat und letztendlich zeigen wir mit verschiedenen Messwerten welchen Geschwindigkeitsvorteil unser Plugin bietet.
Google zu Geschwindigkeit
-quelle: Google Webmaster Blog-
Seit Frühjahr 2010 nutzt Google Seitengeschwindigkeit als ein Kriterium um Webseiten zu beurteilen. Desweiteren bieten sie unterschiedliche Tools an, mit denen man Webseiten auf ihre Geschwindigkeit hin überprüfen - und basierend auf den Ergebnissen optimieren kann. Eines dieser Tools ist Pagespeed. Dieses unterteilt 'Probleme' auf einer Webseite in drei Kategorien. Hohe Priorität, Mittlere Priorität und Geringe Priorität.
Das Ziel des United-Forums war es dabei zuerst alle Punkte die unter Hoher Priorität aufgeführt wurden auszubessern, dies ist in den letzten Wochen und Monaten geschehen. Bis als letzter Punkt die CSS-Sprites unter Hoher Priorität übrig geblieben sind.
Was sind CSS-Sprites
CSS-Sprites ist die Idee mehrere Bilder zu einem Bild zusammenzuführen. Beispielsprite.
Warum CSS-Sprites
Nebenpunkt ist die Tatsache, dass bei der verlustfreien Komprimierung von großen Bildern mehr Daten reduziert werden können, als wenn man mehrere kleinere Bilder komprimiert.
Hauptpunkt ist aber, dass HTTP für jedes Javascript, für jedes Bild eine neue Verbindung vom Benutzer zum Server aufbauen muss. Dies wäre alleine noch kein Problem, allerdings sind aber die maximalen parallelen HTTP-Verbindungen die ein Browser einsetzen kann limitiert (ca. 4). Müssen mehr als 4 Dateien übertragen werden, muss der Browser also warten bis die ersten Dateien übertragen sind, bevor er neue Bilder anfordern kann.
Mit CSS-Sprites kann man also die benötigte Zahl an HTTP-Verbindungen stark senken, was sich sofort auf die Geschwindigkeit auswirkt.
Sehr guter weiterführender Artikel über CSS-Sprites von Sven Wolfermann.
Performance des United-Forum CSS-Sprite Add-Ons
Eure United-Forum-Administration