Pagespeed Optimierung (eBook)

Schritt für Schritt zur schnelleren Website

Gregor Meier (Autor)

eBook Download: PDF

2016 | 1. Auflage
176 Seiten
Carl Hanser Fachbuchverlag
978-3-446-44939-8 (ISBN)

Infos

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

Inhalt

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

Produkt-Details

• Erscheint lt. Verlag: 6.6.2016
• Verlagsort: München
• Sprache: deutsch
• Themenwelt: Mathematik / Informatik ► Informatik ► Web / Internet
• Schlagworte: Google PageSpeed Insights • Responsive Webdesign • Seitenladezeit • Suchmaschinenoptimierung • technisches SEO • Webdesign • Website Performance • Website Speed Test
• ISBN-10: 3-446-44939-6 / 3446449396
• ISBN-13: 978-3-446-44939-8 / 9783446449398