Die Ladezeiten einer Website wirkt sich auf deren Ranking aus, auch wenn die Zeit nur ein kleiner Faktor von vielen ist. Noch wichtiger ist die Ladezeit aber in Hinblick auf die Nutzererfahrung. Oder möchten Sie etwa ständig warten, bis sich die Seite aufgebaut hat? Sicher nicht. Es ist daher enorm wichtig, dass Sie die Ladezeiten optimieren, um Ihren Besuchern ein bestmögliches Surferlebnis bieten zu können.
Wir stellen Ihnen die Ursachen vor, die derartige Verzögerungen auslösen und zeigen Ihnen ein paar Beispiele, wie Sie die Ladezeit Ihrer Seite verbessern.
Erst analysieren, dann Ladezeiten optimieren
Die Ladezeit einer Website kann durch sehr viele technische Aspekte beeinflusst werden. Ursachen sind z.B.:
– große Datenmengen auf der Website
– große Bilder
– Server ist zu langsam
– Komprimierungen sind nicht aktiviert
– Datenbanken arbeiten langsam
Sie müssen also zuerst herausfinden, wo der der Fehler liegt. Dafür gibt es eine Reihe von Analyse-Tools. Auch Google stellt ein derartiges Tool zur Verfügung: Google PageSpeed Insights. Das Tool ist kostenlos und analysiert den gesamten Ladevorgang. Es testet also nicht einfach die Zeit, bis die Seite vollständig geladen ist, sondern überprüft mehrere Faktoren. Als Ergebnis erhalten Sie einen Wert (PageSpeed) zwischen 1 und 100. Je höher der Wert, desto besser ist die Performance Ihrer Website.
Das Tool liefert aber nicht nur den Wert, sondern gibt auch an, wo die Schwachstellen liegen und wie diese behoben werden können. Es ist allerdings kaum möglich, den maximalen Wert zu erreichen und das ist auch nicht sinnvoll. Bereits ein Wert, der höher als 90 liegt, verlangt, dass Sie alle interaktiven Features und externe Scripte deaktivieren, die sich natürlich deutlich beim Laden bemerkbar machen. Das wiederum würde aber die Nutzbarkeit der Seite negativ beeinflussen.
Arbeiten Sie also nicht stur auf einen bestimmten Wert hin, sondern überlegen Sie immer, wie wichtig die Funktion ist, um den Nutzern ein positives Erlebnis auf Ihrer Website zu ermöglichen.
Beispiele zur Ladezeitenoptimierung
Im Folgenden stellen wir Ihnen 5 konkrete Fälle vor, die sich auf die Ladezeit auswirken und zeigen Ihnen die Optimierungsmöglichkeiten:
Javascript und CSS Datensätze zu groß
Auch Kleinigkeiten können die Ladezeit verbessern, wenn sie in einer großen Masse auftreten wie die sogenannten Whitespaces in CSS und Javascript. Durch die Entfernung dieser unnötigen Leerzeichen können Sie die Webseitengröße um bis zu 21 Prozent verringern. Das lässt sich über Tools realisieren wie z.B. JSMin oder YUI Compressor.
Position von CSS- und Javascript-Dateien im Quellcode
Wenn Sie die JS- und CSS-Dateien an den Anfang im Code stellen, könnte es bei einem langsamen Server sein, dass der Bildschirm eine ganze Weile weiß bleibt – so lange, bis die ganze Java-Datei geladen ist. Das können Sie dadurch lösen, indem Sie JS in den Footer des Quellcodes einbauen und CSS in den Header. Der Nutzer sieht dann sofort den für ihn wichtigen Webseiteninhalt. Call-To-Action-Buttons, die erst etwas später im „Laufe des Webseitenbesuchs“ eine Rolle spielen, werden eben erst etwas später nach dem Klick geladen.
Zu große Bilder
Da Bilddateien wesentlich größer als Textelemente sind, bilden sie oft auch den höchsten Datenanteil an einer Seite. Am besten optimieren Sie die Bilder schon vor dem Einfügen durch ein Bildbearbeitungsprogramm wie Photoshop. Speichern Sie sie einfach im Webseitenformat ab und reduzieren Sie damit die Datengröße.
Möglich ist auch die Auslagerung der Bilder durch ein CDN, ein Content Delivery Netzwerk, sofern sehr viele Bilder auf der Website vorhanden sind. Sie liegen dabei auf einem externen Server, was ein schnelleres Laden ermöglicht.
Dokumente auf dem Server sind zu groß
Achten Sie darauf, die Dokumente in komprimierter Form zur Verfügung zu stellen. Möglich ist das z.B. in Form von gzip-komprimierten Inhalten. Das funktioniert sowohl mit IIS-Servern als auch mit Apache-Servern.
Servercache
Der Servercache sollte nur in Ausnahmefälle geleert werden, z.B. bei wichtigen Updates, die sofort umgesetzt werden müssen. Bei im Browser-Cache gehaltenen Daten, die per HTTP übertragen werden, empfiehlt es sich, ein Ablaufdatum einzurichten. Hier sollten Sie aber darauf achten, einen guten Mittelweg zu finden zwischen: Datum nicht zu knapp bemessen und Webseiteninhaltsanzeige nicht behindern.
Dieser Beitrag soll Ihnen erstmal einen groben Überblick über die Möglichkeiten der Ladezeitoptimierung geben. Wir werden in künftigen Blogbeiträgen noch detaillierter auf die einzelenen Möglichkeiten der Optimierung eingehen.
21 Kommentare zu “Ladezeiten optimieren – Tipps für eine bessere Websiteperformance”
Andreas #
Geschrieben am 15. Dezember 2015 um 13:06 Uhr
Hallo,
der Apache-Server liefert Dateien automatisch gzip-komprimiert aus, wenn er richtig konfiguriert ist.
Dazu muss mod_deflate vorhanden sein.
http://httpd.apache.org/docs/2.4/mod/mod_deflate.html
So macht es z.B. Contao in Version 3.5.6:
https://github.com/contao/core/blob/master/.htaccess.default#L70-L82
Gruß Andreas
admin #
Geschrieben am 15. Dezember 2015 um 15:05 Uhr
Richtig, der Apache Webserver unterstützt die Komprimierung. Aber diese muss halt per htaccess noch aktiviert und konfiguriert werden. mod_deflate ist auch auf all unseren Servern aktiv und kann von unseren Kunden verwendet werden.
Thomas #
Geschrieben am 7. Juni 2016 um 08:08 Uhr
Eine Frage zum serverseitigen Caching. Ist bei webgo APC oder Memcached installiert, so dass man in PHP kompilierte Datenbankabfragen, Abfrageergebnisse etc. oder mit Symfony die ausgelesenen Annotations cachen kann?
Ist nicht akut wichtig, aber könnte unter Umständen die Antwortzeiten auch verkürzen.
Viele Grüße
Thomas
webgo #
Geschrieben am 7. Juni 2016 um 08:20 Uhr
Hallo Thomas,
serverseitig haben wir derzeit nur den OPCache installiert. Dieser kann über die php.ini jederzeit aktiviert und konfiguriert werden. Unser Support berät Dich dabei gerne.
Mit dem OPCache haben wir bisher die besten Erfahrungen und Ergebnisse erzielt.
Ich hoffe, dies hilft Dir etwas weiter 😉
Dein webgo Social Media Team
Simon W #
Geschrieben am 12. Januar 2017 um 15:18 Uhr
Eventuell ist Redis eine alternative? Opcache ohne APCu bringt ja defakto meist wenig.
Marcel El-Ghori (webgo GmbH) #
Geschrieben am 6. September 2018 um 13:44 Uhr
Kommentar aktualisiert am 27.04.2020:
Lieber Markus,
in Webhosting Paketen gibt es die Möglichkeit, mit einem Befehl in der php.ini OPcache zu aktivieren. Füge dafür folgende Einträge zu der php.ini hinzu:
opcache.enable =1
opcache.memory_consumption=128
opcache.interned_strings_buffer=8
opcache.max_accelerated_files=4000
opcache.revalidate_freq=60
opcache.fast_shutdown=1
opcache.enable_cli=1
Wie Sie Ihre php.ini-Konfiguration bearbeiten können, erklären wir hier: https://www.webgo.de/hilfe/content/81/58/de/kann-ich-meine-phpini-bearbeiten.html
Wir hoffen das wir Dir damit weiterhelfen konnten! Gerne kannst Du uns jederzeit im Support kontaktieren, solltest du Hilfe benötigen.
Für den Einsatz von Memcached benötigst Du jedoch einen vServer.
Liebe Grüße
Dein webgo Social Team
CodeSache - Contao Partner #
Geschrieben am 6. September 2018 um 13:16 Uhr
Hallo zusammen,
gibt es den zu dem Hosing-Paketen Platin eine Auswahl an Cache-Methoden wie Redis oder Memcached die ich aktivieren kann.
Ich habe bei mir auf der Seite zum Thema Ladezeitenoptimierung mit Contao auch ein paar Informationen zusammen getragen.
https://www.codesache.de/webseiten-ladezeiten-optimieren
Viele Grüße
Markus
MIcha #
Geschrieben am 27. April 2020 um 09:07 Uhr
Hallo,
mit dieser Zeile folgen Fehler im Error Log:
–> zend_extension=opcache.so
Korrekt wäre:
opcache.enable =1
opcache.memory_consumption=128
opcache.interned_strings_buffer=8
opcache.max_accelerated_files=4000
opcache.revalidate_freq=60
opcache.fast_shutdown=1
opcache.enable_cli=1
Schön wäre es, wenn ihr einmal einen Blogbeitrag nur über den OPcache machen würden und warum bspw. das File Caching nicht aktiv ist.
Marcel El-Ghori (webgo GmbH) #
Geschrieben am 27. April 2020 um 11:04 Uhr
Lieber Micha,
vielen lieben Dank für Deinen Hinweis! Wir haben genau diesen Befehl auch oben stehen. Der gilt ab PHP 7.0. Es war leider nicht gleich so offensichtlich zu erkennen, daher haben wir nun einen zusätzlichen Absatz eingebaut.
Deinen Vorschlag zu einem OPcache Beitrag geben wir sehr gerne weiter. Es wird dazu demnächst einen FAQ Beitrag geben!
Liebe Grüße und bleib gesund
Dein webgo Social Team
Matthias #
Geschrieben am 24. Juni 2020 um 15:22 Uhr
Danke für den Beitrag!
Bei mir gab es nen rätselhaften 500er weil ich auf PHP 7 umgestellt hatte. Die Cache-Einstellung für Nextcloud aber noch „alt“ war. Leider hat Nextcloud oder das Backend hier keinen Fehler ausgegeben und erst mit dem Bearbeiten der php.ini hab ich den Fehler wieder beseitigen können.
Viel schöner fände ich eine Suche in den Webgo-Support-Dokumenten. Ich benutze immer ne Websuche – das find ich immer etwas doof.
Marcel El-Ghori (webgo GmbH) #
Geschrieben am 25. Juni 2020 um 11:23 Uhr
Lieber Matthias,
das freut uns sehr, dass Dir der Beitrag gefällt!
Vielen Dank für Deinen Hinweis. Wir hoffen, Deinen Kommentar richtig eingeordnet zu haben. Die notwendigen Einstellungen für OPCache haben wir ebenfalls als FAQ Beitrag aufgenommen:
https://www.webgo.de/hilfe/content/81/344/de/opcache-_-was-ist-das.html
Eine Suchfunktion im FAQ Bereich von webgo existiert jedenfalls schon. 🙂
Für weitere Vorschläge und/oder Verbesserungen zu unseren FAQ Artikeln, sende uns gerne eine Mail an faq@webgo.de und wir bemühen uns, Deinen Vorschlag schnellstmöglich umzusetzen.
Liebe Grüße
Dein webgo Social Team
Sven Esser #
Geschrieben am 11. Oktober 2020 um 16:09 Uhr
Hier wird nach memcached gefragt und mit opcache geantwortet… Dies sind allerdings zwei völlig verschiedene Cachings die nichts miteinander zu tun haben.
Um es einmal einfach und nicht technisch auszudrücken….
Bei memcached geht es darum Datenbankabfragen zu reduzieren während es bei opcache darum geht PHP zu precompilieren.
…dies ist wirklich stark vereinfacht.
Dennoch: Warum gibt es bei Webgo kein Caching um Datenbankabfragen zu reduzieren?
Tom #
Geschrieben am 7. November 2020 um 09:54 Uhr
Ich würde gern die Brotli Compression in Webgo nutzen. Wie kann das Apache-Modul dazu installiert werden?
Danke, Tom.
Marcel El-Ghori (webgo GmbH) #
Geschrieben am 18. November 2020 um 10:57 Uhr
Lieber Sven,
vielen Dank für Deinen Beitrag. Bitte entschuldige die späte Antwort.
Weil es grundsätzlich recht spezielle Anforderungen sind und diese global für alle Hostingkunden passen müssen.
Hinsichtlich der Datenbanken haben wir erst in diesem Jahr Optimierungen vorgenommen, die deutliche Verbesserungen hinsichtlich der Performance der Datenbanken gebracht haben. Dies wurde auch durch den connect Webhosting Anbieter Check bestätigt: „Gegenüber dem Vorjahr hat sich webgo in allen Disziplinen verbessert, am deutlichsten in der Datenbankkategorie.“
Wie Dir schon auf Twitter geschrieben wurde, würden wir Brotli gerne im Webhosting anbieten, jedoch müsste dies per Hand im NGINX eingebunden & aktualisiert werden. Sobald dies automatisiert möglich ist, werden wir dies natürlich auch anbieten können.
Liebe Grüße
Dein webgo Social Team
Marcel El-Ghori (webgo GmbH) #
Geschrieben am 18. November 2020 um 10:57 Uhr
Lieber Tom,
vielen Dank für Deine Frage, gerne beantworten wir Dir diese bestmöglich. Bitte entschuldige die verspätete Antwort.
Brotli kannst Du bei uns auf einem root vServer oder root dedicated Server installieren. Was genau Du bei Deinem System beachten musst, können wir so aktuell leider schwer sagen. Es kommt auch darauf an, welche Apache Version Du verwendest. Solltest Du Apache 2.4.26 oder höher einsetzen hilft Dir eventuell dies weiter:
Wenn Brotli nicht schon aktiviert ist, kannst Du es mit dem Kommando „a2enmod brotli“ aktivieren. In der Server Config muss anschließend folgendes hinzugefügt werden:
„AddOutputFilterByType BROTLI_COMPRESS text/html text/plain text/xml text/css text/javascript application/javascript“
Um das Komprimierungsstufe zu ändern müsstest Du folgendes in die Server Config eintragen:
Z.B. „BrotliCompressionQuality 4“ (Voreingestellt ist z.B. Stufe/Level 5) Stufe 4 hat jedoch eine schnellere Dekomprimierung und eine deutlich – fast doppelt so schnelle Komprimierung. Die Level gehen dabei von 1 bis 11.
Wir hoffen Dir damit weitergeholfen zu haben und wünschen Dir noch einen wunderbaren Tag!
Bleib gesund!
Liebe Grüße
Dein webgo Social Team
Hannes #
Geschrieben am 18. August 2022 um 22:11 Uhr
Hallo,
besteht die Möglichkeit, dass Brotli auch für das Shared Hosting für NGINX / Apache aktiviert wird?
Damals angegebener Grund für das Fehlen war ja, dass dies per Hand in NGINX eingebunden werden müsste.
Hier gibt es jedoch (inzwischen) eine automatisierende Lösung:
https://gist.github.com/pujianto/795e858f11ffc3073a24f60217fcba1a
Es wäre klasse wenn das umgesetzt wird und es würde sicherlich die Performance nochmals verbessern!
Marcel El-Ghori (webgo GmbH) #
Geschrieben am 5. September 2022 um 12:02 Uhr
Lieber Hannes,
zunächst vielen Dank für Deinen Kommentar, die damit verbundene Frage und Deine Geduld. Wir haben Deine Anfrage mit unserer Technik besprochen, leider wäre es in unserem Fall weiterhin nur manuell umsetzbar. Der dadurch entstehende Mehraufwand bei Serverupdates auf der Anzahl an Webhosting Servern ist für uns aktuell nicht realisierbar und bitten höflichst um Dein Verständnis.
Liebe Grüße und einen schönen Start in die Woche
Marcel vom webgo Social Team
Maxim #
Geschrieben am 19. Januar 2023 um 04:05 Uhr
Hallo Marcel,
Redis und Memcached werden für die Standard Webhosting Pakete immer noch nicht angeboten oder? Frage nur weil das die beiden Empfehlungen von WordPress sind und OPcache ja eigentlich nur PHP-Bezogen etwas bringt.
Grüße
Maxim
Marcel El-Ghori (webgo GmbH) #
Geschrieben am 26. Januar 2023 um 13:52 Uhr
Lieber Maxim,
leider nicht. Wir haben die Caching Varianten aktuell bewusst noch nicht an, da diese leider nicht ganz so unkritisch einsetzbar sind. Wir haben es natürlich auch mal getestet. Redis bspw. hat bei WordPress Seiten häufig dazu geführt, dass Aktualisierungen auf der Website nicht übernommen wurden und nach wie vor der „gecachte“ Zustand angezeigt wurde. Als Cache Plugin für Deine WordPress Seite kannst Du natürlich auch sehr gerne W3 Total Cache einsetzen.
Hoffentlich hilft das Dir und Deiner WordPress Seite weiter die Geschwindigkeit weiter zu optimieren!
Liebe Grüße
Marcel vom webgo Social Team
Andreas #
Geschrieben am 18. Juni 2023 um 11:30 Uhr
Liebes webgo-Team,
Memcache wird mittlerweile auch für Nextcloud benötigt bzw. empfohlen.
Wäre wirklich super, wenn das verfügbar wäre!
Gruß,
Andreas
Marcel El-Ghori (webgo GmbH) #
Geschrieben am 19. Juni 2023 um 15:41 Uhr
Lieber Andreas,
vielen Dank für Deinen Kommentar!
Absolut und das sollte auch verfügbar sein.
Um Dir direkt und zielgerichtet helfen zu können, würden wir Dich bitten unseren Support zu kontaktieren.
Liebe Grüße
Marcel vom webgo Social Team