Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

High Performance Websites und Google

1,645 views

Published on

High Performance Websites und Google von Stefan Isak, kuehlhaus AG, am 3. Mai 2010 beim 4. Webmontag.talk in Manhheim.

  • Be the first to comment

High Performance Websites und Google

  1. 1. High Performance Web Sites Stefan Isak http://www.flickr.com/photos/didier57/2423562782/
  2. 2. Was bedeutet Web Site Performance? Text Response-Zeit High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  3. 3. Warum ist die Performance wichtig?  User experience  Joy of use  Usability  ...  Erfolgsfaktor http://radar.oreilly.com/2009/07/velocity-making-your-site-fast.html http://www.stevesouders.com/blog/2009/07/27/wikia-fast-pages-retain-users/ http://www.strangeloopnetworks.com/files/Webinars/Performance_Impact_Webinar.m4v High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  4. 4. NEU: Einfluss auf Google Suchergebnisse High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010 http://www.flickr.com/photos/surroundsound5000/2713737042/
  5. 5. Warum ist High Performance wichtig? NEU: Einfluss auf Google Suchergebnisse  Bis jetzt < 1% für englische Anfragen auf google.com  Relevanz wird steigen http://googlewebmastercentral.blogspot.com/2010/04/using-site-speed-in-web-search-ranking.html High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  6. 6. Warum ist High Performance wichtig? Google Webmaster Tools High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  7. 7. Web Site Performance Backend Performance Server Frontend Performance Hardware Datenbank Programmcode ... High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  8. 8. Wo geht die Zeit verloren? 20% 80% HTML-Dokument Komponenten (CSS, Javascript, Bilder, etc.) High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  9. 9. Wo geht die Zeit verloren? Ein Beispiel - heise.de Zugriff: 02.05.2010, DSL 16.000 kbit/s, leerer Cache High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  10. 10. Wo geht die Zeit verloren? Ein Beispiel - heise.de ~8% Zugriff: 02.05.2010, DSL 16.000 kbit/s, leerer Cache High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  11. 11. Wo geht die Zeit verloren? Ein Beispiel - heise.de ~8% ~92% Zugriff: 02.05.2010, DSL 16.000 kbit/s, leerer Cache High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  12. 12. Analyse Werkzeuge Safari Web Inspector Firefox Addon Firebug developer.apple.com/safari/ addons.mozilla.org/de/firefox/ addon/1843 High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  13. 13. Analyse Werkzeuge developer.yahoo.com/yslow/ code.google.com/speed/page-speed/ (benötigt Firebug) (benötigt Firebug) High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  14. 14. Frontend Performance - Analyse mit YSlow Beispiel - heise.de heise.de 02.05.2010, DSL 16.000 kbit/s, voller Cache High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  15. 15. Frontend Performance Goldene Regel: weniger HTTP-Requests 106 Request für 1 Seite bei leerem Browser Cache heise.de 02.05.2010, DSL 16.000 kbit/s, leerer Cache High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  16. 16. Frontend Performance Goldene Regel: weniger HTTP-Requests 103 Request für 1 Seite bei vollem Browser Cache heise.de 02.05.2010, DSL 16.000 kbit/s, voller Cache High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  17. 17. Frontend Performance Goldene Regel: weniger HTTP-Requests CSS-Sprites  mehrere Bilder zu einem Einzigen zusammenfassen  Bilder die hauptsächlich dem Layout/Design dienen sind für CSS-Sprites gut geeignet  ACHTUNG: Bilder die zum Inhalt gehören nie in einen Sprite High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  18. 18. Frontend Performance Goldene Regel: weniger HTTP-Requests CSS-Sprites - Beispiel High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  19. 19. Frontend Performance Goldene Regel: weniger HTTP-Requests mehrere Javascript Dateien kombinieren 27 Javascript Dateien für die Startseite heise.de 02.05.2010, DSL 16.000 kbit/s, voller Cache High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  20. 20. Frontend Performance Goldene Regel: weniger HTTP-Requests mehrere Stylesheets kombinieren heise.de 02.05.2010, DSL 16.000 kbit/s, voller Cache High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  21. 21. Frontend Performance Goldene Regel: weniger HTTP-Requests Expires Headers einsetzen  Komponenten bekommen ein “Verfallsdatum”  Der Browser kann die Komponente bis zum Verfallsdatum aus dem Cache laden  Spielt keine Rolle beim ersten Besuch einer Webseite. Beispiel Konfiguration für Apache <FilesMatch “.(png|gif|jpg|js|css)$”> ExpiresDefault “access plus 2 years” </FilesMatch> High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  22. 22. Frontend Performance Goldene Regel: weniger HTTP-Requests Expires Headers einsetzen Komponente wird aus dem Cache geladen. Dennoch ist ein HTTP-Request nötig um zu prüfen, ob die Komponente verändert wurde. Mit Expires Headers entfallen diese Requests. High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  23. 23. Frontend Performance Weitere Regeln High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  24. 24. Weitere Informationen developer.yahoo.com/performance/ code.google.com/speed/ High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  25. 25. Bücher High Performance Web Sites Even Faster Web Sites Steve Souders, O’REILLY Steve Souders, O’REILLY 978-3-89721-850-5 978-0596522308 High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  26. 26. ? High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010
  27. 27. Vielen Dank! Stefan Isak kuehlhaus AG N7, 5-6 D-68161 Mannheim Telefon +49.621.496083-0 E-Mail info@kuehlhaus.com Internet www.kuehlhaus.com High Performance Web Sites, Stefan Isak, Webmontag 03. Mai 2010

×