10 Tools um Websites schneller zu machen

Schnelle Websites sorgen für eine besser User Experience und auch für höhere Rankings bei Suchmaschinen. Da das Thema rasch komplex werden kann habe ich hier mal die wichtigsten Tools und Snippets für gzip und Servercaching zusammengefasst.

Linksammlung zu Sitespeed Tuning Tools um Websites schneller zu machen.

Erste Analyse

Pingdom Tools: pingdom.com

Firefox Plugins

Firebug: getfirebug.com
Yslow: yslow.org
Pagespeed: developers.google.com/speed/pagespeed/insights

CSS beschleunigen

1. CSS entschlacken
Unused CSS: unused-css.com
2. CSS zusammenführen
Shrinker: shrinker.ch
3. CSS verkleinern
CSS Minifier: cssminifier.com

Bilder optimieren

Bilder komprimieren
Unnötige Metadaten und Vorschaubilder entfernen
Smushit: smushit.com
Sprites erstellen
Spritepad: spritepad.wearekiss.com

Datenübertragung komprimieren (gzip für Apache aktivieren)

Einfach folgende Zeilen in die .htaccess kopieren
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/atom_xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-shockwave-flash
</IfModule>

Caching aktivieren (Apache)

Einfach folgende Zeilen in die .htaccess kopieren

ExpiresActive On
ExpiresByType image/gif „access plus 6 months“
ExpiresByType image/jpeg „access plus 6 months“
ExpiresByType image/png „access plus 6 months“
ExpiresByType text/css „access plus 6 months“
ExpiresByType text/javascript „access plus 6 months“
ExpiresByType application/javascript „access plus 6 months“

Allgemeine Vorgehensweise

• Caching optimieren
• RTT minimieren
• Request Overhead verringern
• Payload Größe verkleinern
• Browser Rendering optimieren
• Optimierung für Mobile

Link: developers.google.com/speed/docs/best-practices/rules_intro

5-teilige Videoserie zur Sitespeed Tuning

Gemeinsam mit Timon Hartung habe ich mal eine 5-teilige Videoserie zur Sitespeed Tuning auf ConversionClinic.com gemacht. Darin behandeln wir Caching, Bildkomprimierung und CSS Merging.

Link: Video Sitespeed Tuning