Meier Pagespeed Optimierung

Schritt für Schritt zur schnelleren Website
1. Auflage 2016
ISBN: 978-3-446-44939-8
Verlag: Carl Hanser
Format: PDF
Kopierschutz: 1 - PDF Watermark

E-Book, Deutsch, 178 Seiten

Geschwindigkeit ist ein sehr elementarer Faktor für den Erfolg Ihrer Website oder Ihres Blogs. Sowohl für den Besucher, der auf den Seitenaufbau nicht lange warten will, als auch für das Ranking bei Google spielt Geschwindigkeit eine Rolle.


Praktisch und verständlich zeigt Ihnen dieses Buch, mit welchen Techniken Sie die Performance Ihrer Site selbst optimieren können, und zwar ohne Programmierkenntnisse. Beispiele und Expertentipps helfen Ihnen bei der Umsetzung.


Aus dem Inhalt:
Wie funktioniert eine Webseite // Werkzeuge für die Pagespeed-Optimierung // Vorbereitung
Bilder optimieren // CSS optimieren // JavaScript optimieren // HTML optimieren // Schriftarten optimieren // Komprimieren // Rendering (Aufbau der Seite im Browser) // Zwischenspeichern (Cache) // Webserver optimieren // HTTPS-Seiten Ladezeit optimieren // Responsive Design

Autoren/Hrsg.

Meier, Gregor

Fachgebiete

• Mathematik | Informatik EDV | Informatik Programmierung | Softwareentwicklung Webprogrammierung
• Mathematik | Informatik EDV | Informatik Professionelle Anwendung Web Graphik & Design, Web-Publishing
• Mathematik | Informatik EDV | Informatik Digital Lifestyle Internet, E-Mail, Social Media

Inhaltsverzeichnis

1;1 Einleitung;12
1.1;1.1 Machen Sie aus Ihrer Website einen Ferrari;12
1.2;1.2 Zielgruppe;13
1.3;1.3 Beispiele;15
1.4;1.4 Warum Sie aus Ihrer Webseite einen Ferrari machen sollten;18
1.4.1;1.4.1 Mehr Pagespeed = mehr Besucher;18
1.4.2;1.4.2 Mehr Pagespeed = weniger Absprünge (Bounce Rate);18
1.4.3;1.4.3 Mehr Pagespeed = mehr besuchte Seiten;19
1.4.4;1.4.4 Mehr Pagespeed = mehr Umsatz;20
1.5;1.5 Vorgehen;22
2;2 Wie kommt eine Webseite auf unseren Computer?;24
2.1;2.1 Anfrage des Browsers an den Webserver;24
2.2;2.2 Behandlung des Requests auf dem Server;25
2.3;2.3 Übertragung;26
2.4;2.4 Anzeigen der Seite im Browser (Rendering);27
3;3 Werkzeuge für die Pagespeed-Optimierung;30
3.1;3.1 Google PageSpeed Insights;30
3.2;3.2 WebPageTest;32
3.3;3.3 Test der Internetanbindung eines Webservers;34
3.4;3.4 Welche Ladezeit ist gut?;35
3.5;3.5 Mit FTP eine Webseite bearbeiten;35
3.6;3.6 Mit SSH auf einen Webserver zugreifen;36
3.7;3.7 Vorbereitung;38
4;4 Bilder optimieren;40
4.1;4.1 Die richtige Bildgröße;40
4.2;4.2 Unterschiedliche Bildgrößen für unterschiedliche Geräte;43
4.3;4.3 Welches Bildformat ist das schnellste?;45
4.4;4.4 WebP: das richtige Dateiformat;45
4.4.1;4.4.1 Wie kann man WebP-Bilder erstellen?;45
4.4.2;4.4.2 Fallback im CSS;47
4.4.3;4.4.3 Fallback in HTML 5;48
4.4.4;4.4.4 Per .htacces unterschiedliches Bild ausliefern;48
4.5;4.5 Bilder komprimieren;48
4.6;4.6 Bildgrößen angeben;53
4.7;4.7 CSS statt einem Bild;54
4.8;4.8 Image-Map;55
4.9;4.9 Seiten mit sehr vielen und sehr großen Bildern;55
4.10;4.10 Bilder verzögert laden;55
4.11;4.11 Favicon optimieren;56
4.12;4.12 Unicode statt Grafiken;57
5;5 HTML optimieren;60
5.1;5.1 Die aktuelle HTML-Version verwenden;60
5.2;5.2 Auf Validität des HTML-Codes achten;61
5.3;5.3 Keine externen Elemente einbinden;62
5.3.1;5.3.1 Bilder kopieren;62
5.3.2;5.3.2 DNS-Prefetch;62
5.3.3;5.3.3 Externe Elemente verzögert laden;63
5.4;5.4 Frames vermeiden;63
5.5;5.5 Weiterleitung vermeiden;63
5.6;5.6 HTML reduzieren;64
5.7;5.7 Sichtbare Inhalte priorisieren;65
5.8;5.8 Fehlerhafte Anfragen vermeiden;66
5.9;5.9 Schriftarten optimieren;67
5.10;5.10 Websichere Schriften verwenden;68
5.11;5.11 Cookies vermeiden;69
5.11.1;5.11.1 Was sind Cookies?;69
5.11.2;5.11.2 Ausgleich zwischen Pagespeed und Benutzerfreundlichkeit?;70
6;7 CSS optimieren;72
6.1;6.1 Was ist CSS?;72
6.2;6.2 CSS-Dateien reduzieren (minify);73
6.3;6.3 CSS-Dateien zusammenfassen und/oder inline einbinden;75
6.4;6.4 Wordpress – Deque CSS;77
6.5;6.5 print.css, mobile.css usw. nicht auf allen Seiten mitladen;78
6.6;6.6 Ungenutzte CSS-Styles entfernen;79
6.6.1;6.6.1 unused-css.com;79
6.6.2;6.6.2 Dust-Me;80
6.7;6.7 CSS-Import vermeiden;82
6.8;6.8 CSS nicht immer inline einbinden – aber wenn es sinnvoll ist;82
6.9;6.9 CSS nicht innerhalb von style-Attributen verwenden;83
6.10;6.10 CSS Sprites;84
7;7 JavaScript optimieren;86
7.1;7.1 Was ist JavaScript (JS)?;86
7.2;7.2 JavaScript reduzieren;86
7.2.1;7.2.1 Wie müssen Sie vorgehen?;87
7.2.2;7.2.2 Externe Dateien;88
7.3;7.3 Nicht benötigtes JavaScript entfernen;89
7.4;7.4 jQuery optimieren;90
7.5;7.5 JavaScript zusammenfassen;91
7.6;7.6 JS-Optimierung automatisieren mit GruntJS;92
7.7;7.7 JavaScript verzögert laden;94
7.8;7.8 JavaScript vs. CSS;95
7.9;7.9 Ladezeit von Benutzern ermitteln;96
8;8 Komprimieren;98
8.1;8.1 Was ist Datenkomprimierung?;98
8.2;8.2 Wie können wir mit Komprimierung unsere Webseite beschleunigen?;99
8.3;8.3 gzip auf Apache Webservern;99
8.3.1;8.3.1 Komprimierung mit mod_gzip;100
8.3.2;8.3.2 Komprimierung mit mod_deflate;100
8.4;8.4 gzip funktioniert nicht;101
8.4.1;8.4.1 Shared Hosting;101
8.4.2;8.4.2 gzip und deflate installieren;101
8.5;8.5 gzip auf Windows-Servern;103
9;9 Critical Rendering Path;104
9.1;9.1 Was ist der Critical Rendering Path?;104
9.2;9.2 Wie baut sich eine Seite auf? (Rendering);106
9.3;9.3 CSS in Kritisch und Nichtkritisch unterteilen;106
9.4;9.4 Prefetch und Prerender;108
9.4.1;9.4.1 DNS-Prefetch;109
9.4.2;9.4.2 Prefetch;109
9.4.3;9.4.3 Prerender;110
10;10 Zwischenspeichern (Cache);112
10.1;10.1 Was ist ein Cache?;112
10.2;10.2 Browser-Cache;112
10.3;10.3 Server-Cache;116
10.4;10.4 Wie können wir den Server-Cache nutzen?;117
10.4.1;10.4.1 WP Super Cache;117
10.4.2;10.4.2 W3 Total Cache;120
10.4.3;10.4.3 Externer Server-Cache;122
10.4.4;10.4.4 Cashing mit Varnish;122
10.4.5;10.4.5 Statische Seite;127
11;11 CDN – Content Delivery Networks;132
11.1;11.1 Was ist ein CDN?;132
11.2;11.2 Wie richtet man ein CDN ein?;134
12;12 Webserver optimieren;136
12.1;12.1 Sie brauchen keinen teuren Server!;136
12.2;12.2 Hardware;137
12.2.1;12.2.1 Arbeitsspeicher (RAM);137
12.2.2;12.2.2 Prozessoren und Prozessorkerne;138
12.2.3;12.2.3 Festplatten;138
12.3;12.3 Software;139
12.3.1;12.3.1 Betriebssystem;139
12.3.2;12.3.2 Webserver-Software;139
12.4;12.4 Webserver-Performance steigern;140
12.4.1;12.4.1 Shared-Hosting;141
12.4.2;12.4.2 Ein eigener Server?;142
12.4.3;12.4.3 Webserver auf Nginx wechseln;144
12.4.4;12.4.4 Webserver auf Litespeed wechseln;147
12.4.5;12.4.5 Keep Alive;149
12.5;12.5 Unnötige Anfragen blockieren;150
12.5.1;12.5.1 Wie kann man erkennen, dass eine Seite von vielen Crawlern besucht wird?;150
12.5.2;12.5.2 Wie kann man unerwünschte Crawler und Spam-Bots fernhalten?;152
13;13 Responsive Design;154
13.1;13.1 Warum responsive Design?;154
13.2;13.2 Webseite responsive machen;155
13.3;13.3 Abhängigkeiten vermeiden;155
13.4;13.4 Lösungsansätze;156
13.4.1;13.4.1 Elternelement ausblenden;156
13.4.2;13.4.2 Weiterleitung auf eine mobile Seite;156
13.4.3;13.4.3 Mit JavaScript Bilder erkennen;157
13.5;13.5 Viewport;158
13.6;13.6 Bilder anpassen;159
14;14 Ladezeit von HTTPS-Seiten optimieren;160
14.1;14.1 Was ist HTTPS?;160
14.1.1;14.1.1 Identifizierung;161
14.1.2;14.1.2 Verschlüsselung;162
14.2;14.2 SSL beschleunigen;163
14.2.1;14.2.1 HTTPS nicht auf allen Seiten verwenden;163
14.2.2;14.2.2 HTTPS-Handshake auf einem anderen Server durchführen;164
14.2.3;14.2.3 Server updaten;164
14.2.4;14.2.4 False Start;166
14.2.5;14.2.5 Weiterleitungen vermeiden;167
14.2.6;14.2.6 HSTS;167
15;15 Blick in die Zukunft;170
15.1;15.1 BPG-Bildformat;170
15.2;15.2 Google Transcode;171
15.3;15.3 Accelerated Mobile Pages;172
16;16 Fazit;174
17;Index;176

Über Autor(innen)

Gregor Meier ist bei einer Schweizer SEO-Agentur als Projektleiter für Suchmaschinenoptimierung tätig.