Mobile Ladezeiten: So sprintet eure Website auf dem Smartphone
In seiner 2018er Studie zeigt der Bundesverband Digitalwirtschaft (BVDW), warum mobile Online-Auftritte nur erfolgreich sein können, wenn sie schnell laden. Mit dabei: Hilfreiche Tipps und die neuesten mobilen Technologien. Vorhang auf!
Der volle Titel des aktuellen BVDW-Papiers lautet:
"Moderne Mobile-Web-Technologien:
Einführung und Anwendungsbeispiele zur Nutzung von modernen mobilen Webtechnologien zur Verbesserung der Nutzererfahrung und Steigerung des Umsatzes"
Ob das relevant ist? Ja, ist es: Smartphones sind das beliebteste Endgerät, um online zu gehen. 69 Prozent der deutschen User nutzen Smartphones, um zu surfen. Die tägliche Nutzungsdauer liegt wochentags bei 152 Minuten, am Wochenende bei 202 Minuten.
Online-Auftritte sind auf dem Smartphone mehrfach gefordert:
➧ Inhalte müssen auch bei schwachem Netz schnell und nahtlos laden.
➧ Seitendesigns und -funktionen müssen auch auf kleinen Bildschirmen benutzerfreundlich sein.
➧ Überflüssige Eingaben und Klicks sollten vermieden werden.
Viele User verlassen Websites, die länger als drei Sekunden laden. Verzögert sich die Ladezeit um zwei Sekunden, kann dies die mobile Absprung-Rate um bis zu 103 Prozent erhöhen. Selbst eine Verzögerung von einer Zehntelsekunde kann Conversion-Raten auf Smartphones noch um bis zu sieben Prozent verringern.
Faustregel: Eine Webseite sollte in maximal drei Sekunden laden. Tools, die das messen, findet ihr weiter unten.
2. Browser-Caching nutzen: Dabei speichert der Browser (z. B. Chrome oder Firefox) Grafiken und CSS-Dateien im lokalen Speicher zwischen. So verringert sich bei einem erneuten Besuch die Anzahl der notwendigen Serveranfragen deutlich, die Seite lädt schneller.
3. Bilder optimieren: Achtet auf schlanke Bilder und nutzt Optimierungstools wie Kraken.io oder TinyPNG.com. Letztere verringern die Bilder-Dateigröße um bis zu 80 Prozent – bei gleichbleibender Qualität.
4. CMS-Ressourcen kontrollieren: Wer sein Content-Management-System (CMS, z. B. WordPress oder Typo3) mit vielen Plug-ins (Zusatzmodulen) erweitert, macht es träge. Ratsam ist es, nicht sofort benötigte Skripte asynchron nachzuladen und im Footer der Seite zu platzieren.
5. Ladezeiten-Test-Tools nutzen:
6. AMP nutzen: Accelerated Mobile Pages (AMP) heißt eine Open-Source-Initiative, die mobile Webseiten in unter 0,5 Sekunden laden lässt. AMP basiert auf einer modifizierten HTML-Version.
7. Progressive Web Apps erwägen: Sie kombinieren die Vorteile einer mobilen Website mit denen einer App. Sie sind schnell auf dem Smartphone-Homescreen installiert und bequemer aufruf- und nutzbar als eine herkömmliche Download-App. Dabei bieten sie alle Features einer gängigen App (z. B. Push-Benachrichtigungen).
Bonus: Credential Management API. Wer online shoppt, muss sich registrieren und anmelden – das dauert, kann verwirren und nervt häufig. Credential Management API ermöglichen es, mit einem Klick ein bekanntes Benutzerkonto inklusive Passwort zu nutzen. Salopp formuliert handelt es sich um eine 1-Click-Anmeldung.
Lasst es mich wissen: Wie optimiert ihr euren Mobilauftritt?
Quelle & Link-Tipp:
(Mobil unter CC0 1.0) |
Der volle Titel des aktuellen BVDW-Papiers lautet:
"Moderne Mobile-Web-Technologien:
Einführung und Anwendungsbeispiele zur Nutzung von modernen mobilen Webtechnologien zur Verbesserung der Nutzererfahrung und Steigerung des Umsatzes"
Ob das relevant ist? Ja, ist es: Smartphones sind das beliebteste Endgerät, um online zu gehen. 69 Prozent der deutschen User nutzen Smartphones, um zu surfen. Die tägliche Nutzungsdauer liegt wochentags bei 152 Minuten, am Wochenende bei 202 Minuten.
Online-Auftritte sind auf dem Smartphone mehrfach gefordert:
➧ Inhalte müssen auch bei schwachem Netz schnell und nahtlos laden.
➧ Seitendesigns und -funktionen müssen auch auf kleinen Bildschirmen benutzerfreundlich sein.
➧ Überflüssige Eingaben und Klicks sollten vermieden werden.
Mobility: Deshalb ist die Website-Ladezeit so wichtig
Wie lange brauchen eure Webseiten, bis sie auf dem Smartphone erscheinen? Die Ladezeit ist innerhalb der mobilen Usability absolut entscheidend:Viele User verlassen Websites, die länger als drei Sekunden laden. Verzögert sich die Ladezeit um zwei Sekunden, kann dies die mobile Absprung-Rate um bis zu 103 Prozent erhöhen. Selbst eine Verzögerung von einer Zehntelsekunde kann Conversion-Raten auf Smartphones noch um bis zu sieben Prozent verringern.
Faustregel: Eine Webseite sollte in maximal drei Sekunden laden. Tools, die das messen, findet ihr weiter unten.
(Handy unter CC0 1.0) |
So optimiert ihr eure mobile Ladezeit
1. htaccess-Datei erweitern: htaccess steht für "hypertext access". Es handelt sich um eine textbasierte Datei, mit der ihr verzeichnisspezifisch die Konfiguration eines Apache-Servers (meistgenutzter Server-Typ im Web) beeinflussen könnt. Mithilfe von gzip oder Deflate könnt ihr die serverseitige Daten-Kompression aktivieren.2. Browser-Caching nutzen: Dabei speichert der Browser (z. B. Chrome oder Firefox) Grafiken und CSS-Dateien im lokalen Speicher zwischen. So verringert sich bei einem erneuten Besuch die Anzahl der notwendigen Serveranfragen deutlich, die Seite lädt schneller.
3. Bilder optimieren: Achtet auf schlanke Bilder und nutzt Optimierungstools wie Kraken.io oder TinyPNG.com. Letztere verringern die Bilder-Dateigröße um bis zu 80 Prozent – bei gleichbleibender Qualität.
4. CMS-Ressourcen kontrollieren: Wer sein Content-Management-System (CMS, z. B. WordPress oder Typo3) mit vielen Plug-ins (Zusatzmodulen) erweitert, macht es träge. Ratsam ist es, nicht sofort benötigte Skripte asynchron nachzuladen und im Footer der Seite zu platzieren.
5. Ladezeiten-Test-Tools nutzen:
6. AMP nutzen: Accelerated Mobile Pages (AMP) heißt eine Open-Source-Initiative, die mobile Webseiten in unter 0,5 Sekunden laden lässt. AMP basiert auf einer modifizierten HTML-Version.
7. Progressive Web Apps erwägen: Sie kombinieren die Vorteile einer mobilen Website mit denen einer App. Sie sind schnell auf dem Smartphone-Homescreen installiert und bequemer aufruf- und nutzbar als eine herkömmliche Download-App. Dabei bieten sie alle Features einer gängigen App (z. B. Push-Benachrichtigungen).
Bonus: Credential Management API. Wer online shoppt, muss sich registrieren und anmelden – das dauert, kann verwirren und nervt häufig. Credential Management API ermöglichen es, mit einem Klick ein bekanntes Benutzerkonto inklusive Passwort zu nutzen. Salopp formuliert handelt es sich um eine 1-Click-Anmeldung.
Fazit: Mobile first – speed it up!
Die Studie zeigt: Es gibt etliche Stellschrauben, mittels derer ihr mobile Online-Auftritte schneller und benutzerfreundlicher machen könnt. Dafür ist es höchste Zeit: Immer mehr User gehen mit dem Smartphone online und Google stellt 2018 seinen gesamten Index auf Mobile um.Lasst es mich wissen: Wie optimiert ihr euren Mobilauftritt?
Quelle & Link-Tipp:
- bvdw.org: Moderne Mobile-Web-Technologien
- Technisches SEO: So optimiert ihr die Ladezeiten eurer Webseiten
Kommentare