SEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-Freaks

2.351 Aufrufe

Veröffentlicht am

Vortrag PageSpeed 100?!
 Perfekte Ladezeiten und SEO-Hosting für Speed-Freaks von Kai Spriestersbach und Sebastian Jankord

Veröffentlicht in: Präsentationen & Vorträge
0 Kommentare
9 Gefällt mir
Statistik
Notizen
  • Als Erste(r) kommentieren

Keine Downloads
Aufrufe
Aufrufe insgesamt
2.351
Auf SlideShare
0
Aus Einbettungen
0
Anzahl an Einbettungen
259
Aktionen
Geteilt
0
Downloads
564
Kommentare
0
Gefällt mir
9
Einbettungen 0
Keine Einbettungen

Keine Notizen für die Folie

SEO Day 2016: Perfekte Ladezeiten und SEO-Hosting für Speed-Freaks

  1. 1. PageSpeed 100?!
 Perfekte Ladezeiten und SEO- Hosting für Speed-Freaks Köln, den 27.10.16
  2. 2. Kai Spriestersbach Inhaber, SEARCH ONE Online Strategy Consultant, eology GmbH Frontend- und Backend SEO seit 12 Jahren WordPress Developer Sebastian Jankord CTO PURE HOST Linux, Clustersysteme für Hosting und Sicherheitslösungen WordPress sicher machen: Tipps zum richtigen Umgang mit Themes, Plug-ins und Servern
  3. 3. Warum Google manchmal dumm ist …
  4. 4. dummen SEO Oder: Was ist preiswertes Hosting
  5. 5. Mein Hosting anno 2010 • 350 Domains, davon ca. 100 projektiert • 48 Web-Hosting Pakete • Bei 12 verschiedenen Anbietern
  6. 6. und Google so …
  7. 7. Step One • Alles auf einen Server (Dedicated) • Alle Domains zu einem Hoster • Zentrale WordPress Verwaltung
  8. 8. Step Two • PageSpeed optimiert • GZIP aktiviert • Bilder komprimiert • Caching Plugins installiert & konfiguriert • WordPress Themes optimiert :( • HTTP-Requests minimiert
  9. 9. Step Three • Server Stack Hardening (Extern) • Varnish Cache installiert • und als WAF konfiguriert
  10. 10. Final Step • Komplette Betreuung durch PURE HOST
  11. 11. Vorteile • Sicher, Schnell, Zuverlässig, Bezahlbar! • Backups 4 x täglich für 120 Tage • Sicherheit durch Updates, WAF & CloudFlare • Zentrale WordPress Verwaltung, inkl. Updates • Lastminierung durch Caching + CloudFlare • Schneller Support bei Problemen Endlich wieder Fokus auf meine Arbeit!
  12. 12. Was heißt bezahlbar? Vorher Nachher Verbesserung Kosten für Hosting 
 inkl. Buchhaltung > 750 EUR / Monat < 200 EUR / Monat -73% Kosten Arbeitszeit intern > 16 Stunden / Monat < 4 Stunden / Monat -75% Zeit Unique Users max. 150.000 / Monat > 1.000.000 / Monat +660% Performance = Neues Hosting ist 96x Kosteneffizienter!
  13. 13. und das Beste… • KEINE PageSpeed-Optimierung mehr nötig
  14. 14. Plesk ist besser als sein Ruf
  15. 15. Plesk 17: Onyx • NGINX only Hosting möglich • HTTP/2 Out-Of-The-Box • Let’s encrypt SSL • Zentrale Verwaltung • WordPress Toolkit • Automatische Backups • Git, Docker, Ruby und node.js Support
  16. 16. Backups mit Plesk • Inkrementelle Backups
 Mehrfach täglich • Backups nach Zeitplan • Externe Backups
 z.B. Dropbox / FTP • Backups verschlüsselt • Disaster Recovery möglich Zusätzlich 4 mal täglich via BackUp PC
  17. 17. WordPress Toolkit • Sicherheitsüberprüfung • Automatische Updates • Plugin + Theme Verwaltung • Benutzer + Passwörter
  18. 18. Google Bildersuche add_header X-Frame-Options "ALLOW-FROM https://images.google.de/" always; Kennt ihr das?
  19. 19. Achtung: IT-Sicherheitsgesetz! https://www.datenschutzbeauftragter-info.de/sicherheitsgesetz-zweck-anforderungen-und-sanktionen/ 25.07.2015
  20. 20. So bitte nicht …
  21. 21. … besser so!
  22. 22. Vorteile von HTTP/2 • HTTP/2 nur noch über SSL • Komprimierte Header • Mehrere “Streams” gleichzeitig • ServerPush • Multiplexing • schnellere Ladezeiten http://caniuse.com/#feat=http2
  23. 23. Multiplexing rockt
  24. 24. CloudFlare Das einzige CDN, dass das „Uncachebare“ cachen kann
  25. 25. Warum CloudFlare?
  26. 26. Railgun Typical 99.6% compression and a speedup of over 700%
  27. 27. CloudFlare Polish Lossless or Lossy Image Optimization https://blog.cloudflare.com/introducing-polish-automatic-image-optimizati/
  28. 28. CloudFlare Mirage Adaptive on-the-fly Optimierung https://www.cloudflare.com/website-optimization/mirage/
  29. 29. CloudFlare - Requests
  30. 30. CloudFlare - Bandwidth
  31. 31. CloudFlare - Visitors
  32. 32. CloudFlare - Protection
  33. 33. Skalieren über Hardware?
  34. 34. Wenn SEO rockt -> mehr Hardware
  35. 35. Wenn Google News rockt -> Cloud? 1,5 Mio. Unique Users innerhalb von 90 Minuten 20 Mio. Unique Users in einem Monat über Google News Bei Interesse: http://kai.im/seoday-newstool SEARCHONENEWSOPTIMIZER
  36. 36. Google Analytics Live Google News Traffic zur EM 2016 - 3 Webseiten auf einem Cluster
  37. 37. Traffic Stats Extreme • 20 Millionen Unique Besucher in einem Monat • 85 Millionen Seiten Hits & 250 Millionen Requests • 308 TB Traffic während EM / 100 GB in 15 Minuten • Über 40.000 Besucher gleichzeitig
  38. 38. EM-Cluster von PURE HOST 2 Load Balancer 7 Web Server 5 MySQL Galera
  39. 39. Microcaching mit NGINX
  40. 40. Kostenlose NGINX Microcaching Config fastcgi_cache_path /dev/shm/microcache levels=1:2 keys_zone=microcache:5M max_size=1G inactive=2h; fastcgi_cache_key "$scheme$request_method$host$request_uri"; fastcgi_cache_use_stale error timeout invalid_header http_500; fastcgi_ignore_headers Cache-Control Expires Set-Cookie; set $skip_cache 0; # POST Requests und URLS mit einem String gehen direkt an PHP if ($request_method = POST) { set $skip_cache 1; } if ($query_string != "") { set $skip_cache 1; } # Kein Cachen des Adminsbereich / Sitemap usw. if ($request_uri ~* "/wp-admin/|/xmlrpc.php|wp-.*.php|/feed/|index.php|sitemap(_index)?.xml { set $skip_cache 1; } # Kein Cache für eingeloggte User die gerade Kommentare verfassen if ($http_cookie ~* "comment_author|wordpress_[a-f0-9]+|wp-postpass|wordpress_no_cache|wordpress_logged_in") { set $skip_cache 1; } location / { try_files $uri $uri/ /index.php?$args; } # Scripte die noch nicht im Cache sind direkt an PHP schicken location ~ .php$ { fastcgi_split_path_info ^(.+.php)(.*)$; fastcgi_index index.php; fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name; fastcgi_cache microcache; fastcgi_cache_bypass $skip_cache; fastcgi_no_cache $skip_cache; # Zeiten für den Cache fastcgi_cache_valid 200 1d; fastcgi_cache_valid 302 301 1m; fastcgi_cache_valid 404 1s; fastcgi_cache_min_uses 1; fastcgi_cache_use_stale error timeout invalid_header updating http_500; fastcgi_ignore_headers Cache-Control Expires; fastcgi_pass_header Set-Cookie; fastcgi_pass_header Cookie; } Download unter: https://kai.im/seoday-nginx
  41. 41. „Cloud“ im Kostenvergleich ca. 8.500 EURca. 700 EUR • 14 Server • 2 Loadbalancer • 5 MySQL Galera • 7 WebServer • Cloudflare + Railgun • S3 für statische Inhalte • EC2 Instanzen • RDS Instanzen • Cloudfront
  42. 42. The next step… AMP + PWA
  43. 43. AMP kommt…
  44. 44. – Gary Illyes „The other thing is that there is a very strong push for AMP everywhere. And you can expect more launches around that.“ http://searchengineland.com/google-whats-important-2017-machine-learning-amp-structured-data-261150
  45. 45. AMP in WP aktivieren https://de.wordpress.org/plugins/amp/ https://de.wordpress.org/plugins/pagefrog/ Note #1: that Pages and archives are not currently supported. 
 Pages support is being worked on.1. Plugin: AMP 2. Plugin: Pagefrog
  46. 46. CSS anpassen
  47. 47. Tracking aktivieren!
  48. 48. Ad-Networks
  49. 49. Validieren wie anno 1999
  50. 50. Neues Testing Tool https://search.google.com/search-console/amp
  51. 51. WP: Strip invalid code add_filter( 'the_content', 'amp_remove_lightbox', 999 ); function amp_remove_lightbox( $content ) { if ( is_single() && is_amp_endpoint() ) 
 //Change invalid rel="lightbox" to data-rel= $content = str_replace("rel", "data-rel", $content); // Returns the content. return $content; } In die functions.php des Child-Themes:
  52. 52. „Hacking“ AMP <script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script> iFrames aktivieren: sandbox="allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-forms" „Features“ aktivieren: Wert Aktiviert Nutzung allow-forms Formulare Leads / Sales / Kommentare allow-popups Popups Werbung / Cookies allow-scripts JavaScript Tracking / Werbung / Cookies / Maps Auch für White Hats geeignet!
  53. 53. AMP und E-Commerce https://amphtml.wordpress.com/2016/08/22/getting-started-with-amp-for-e-commerce/
  54. 54. AMP + PWA amp-install-serviceworker <script async custom-element="amp-install-serviceworker" src="https:// cdn.ampproject.org/v0/amp-install-serviceworker-0.1.js"></script> Serviceworker 
 im AMP HTML <amp-install-serviceworker src="https://www.your-domain.com/serviceworker.js" data-iframe-src="https://www.your-domain.com/install-sw.html" layout="nodisplay"> </amp-install-serviceworker> Installations JS startet Download Download der WebApp im Hintergrund Direkter Zugriff beim nächsten Klick bzw. Besuch!
  55. 55. PWA - Flipkart • Das „Amazon Indiens“ • AMP und PWA kombiniert • Direkt aus dem Web in die App! • 3x mehr Zeit auf der Seite • 40% höhere Wiederbesuchsrate • 70% höhere Conversionrate bei App Nutzern • 3x weniger Datenverbrauch https://developers.google.com/web/showcase/2016/flipkart
  56. 56. Mehr Progressive Web Apps https://pwa.rocks/
  57. 57. There’s more to come https://www.ampproject.org/roadmap/
  58. 58. Warum ich AMP mag … • Es ist wirklich schnell • Neue Rankings in den Schlagzeilen • Doppelrankings möglich! Organisch #1 + OneBox • Affiliate-Links & Werbung funktionieren • E-Commerce Unterstützung via PWA & iFrames
  59. 59. Kai Spriestersbach Inhaber, SEARCH ONE Online Strategy Consultant, eology GmbH Sebastian Jankord CTO PURE HOST Vielen Dank! Noch Fragen? https://www.pure-host.de https://www.search-one.de

×