Website optimieren – das sind die größten Baustellen

Eine der wichtigsten Aufgaben für Website-Betreiber ist es, die Surferfahrung der Besucher so angenehm wie möglich zu gestalten. Bereits der Aufruf der Startseite ist entscheidend: Durch zu lange Ladezeiten verlieren Sie unnötig viele Interessenten – ein Thema, das mit dem zunehmenden mobilen Traffic weiterhin an Bedeutung gewinnt. Wenn Sie die Website-Performance im Auge behalten und regelmäßig verbessern, stellen Sie schnell fest, dass Ihre Besucher mehr Zeit auf Ihrer Website verbringen und nicht bereits nach einem einzelnen Seitenaufruf verschwinden, sondern mehrere Pages öffnen werden. Positiver Nebeneffekt: Sie steigen so auch in der Gunst der Suchmaschinen und profitieren von besseren Rankings.

Ihren aktuellen Website-Speed können Sie mit kostenfreien Website-Speed-Tests wie Google PageSpeed Insights oder pingdom testen. Diese messen und bewerten die Leistungsfähigkeit unter der Berücksichtigung netzwerkunabhängiger Aspekte wie medialen Inhalten oder der Struktur des HTML-Codes. Das Google-Tool analysiert sowohl die Desktop-Version als auch die mobile Variante Ihrer Webpräsenz und gibt Ihnen Verbesserungsvorschläge.

Welche Aspekte haben Einfluss auf die Ladegeschwindigkeit? Wir informieren Sie über die typischen Geschwindigkeitsbremsen und verraten Ihnen mögliche Lösungsansätze.

Tipp:
Testen Sie jetzt die Performance Ihrer Website mit dem kostenlose Website-Checker von 1&1!

Website-Check

Hosting

Als erstes sollten Sie sich fragen: Genügt die aktuelle Hosting-Umgebung den Ansprüchen Ihres Webprojekts? Viele wollen ausgerechnet bei der Leistung und den Kapazitäten des Servers sparen und präferieren das günstigste Angebot. Die Konsequenz: Im entscheidenden Moment fehlt die notwendige Bandbreite, um alle Nutzeranfragen zu verarbeiten. Insbesondere Besucherspitzen und starkem Wachstum zeigen sich Billig-Hosting-Lösungen, bei denen sich mehrere Parteien einen Server teilen, nicht gewachsen. Ein weiterer typischer Fehler ist es, die eigene Website auf einem Server im Ausland zu hosten, obwohl das Angebot in erster Linie auf den nationalen Markt beschränkt ist – auch dadurch erhöht sich die Ladezeit für Ihre Besucher.

Das können Sie tun:

  • auf flexible Hosting-Lösungen mit uneingeschränktem Webspace und Traffic zurückgreifen
  • nur Server mieten, die sich in Rechenzentren im Land der meisten Nutzer befinden
  • ein Content Delivery Network (CDN) nutzen, wenn Sie eine internationale Zielgruppe ansprechen wollen
  • das Hosting selbst übernehmen und perfekt auf das eigene Projekt abstimmen
Transkription

Welche Rolle spielt die Performance im modernen Webhosting?

Heutzutage erwarten die Nutzer, dass alles zu jeder Zeit verfügbar ist – das gilt auch für die Webseiten unserer Kunden. Diese müssen in kürzester Zeit ausgeliefert werden, um einen Besucherrückgang zu vermeiden. Um eine Webseite schnell auszuliefern, haben wir mit http/2, PHP7.1 und unserer SSD-Plattform die perfekte Grundlage entwickelt. Zusätzlich haben wir nun die 1&1 Performance Level entwickelt. Dadurch gewährleisten wir im Webhosting-Bereich beste Performance – jederzeit flexibel anpassbar.

Wofür benötige ich welches Performance-Level?

Eine einfache wenig komplexe Webseite benötigt lediglich ein niedriges Performance Level. Ein umfangreicher Online Shop mit beispielsweise vielen Artikeln oder vielen Besuchern benötigt dementsprechend ein hohes Performance-Level. Aber genau hier ist man mit dem Performance-Leveln sehr flexibel. Benötigt man mehr Leistung, weil plötzlich mehr Besucher auf die Webseite strömen, ist es kein Problem ein höheres Performance-Level zu buchen. Genauso umgekehrt, verändern sich die Bedürfnisse nach unten, ist es kein Problem dass Performance-Level zurückzustufen.

Wie kann ich das Performance-Level anpassen?

Unser neues Web Hosting bietet im 1&1 Control Center einen Performance-Level Dashboard. Unsere Kunden können hier den aktuellen Verbrauch des Webhosting-Pakets als auch die empfohlene Leistung direkt und einfach einsehen. Der Wechsel ist ebenfalls einfach gehalten. Auch Unerfahrene können hier mit wenigen Klicks die Performance-Levels wechseln. Ein Tarifwechsel ist hierfür nicht nötig.

HTML, CSS und JavaScript

Wenn Besucher Ihre Website aufrufen, fordert deren Browser die HTML-Datei auf Ihrem Server an und stellt sie entsprechend der enthaltenen CSS-Formatierungen dar. Gleiches gilt auch für eingebundene JavaScript-Elemente wie Werbebanner oder Nachrichtenticker. Je größer die Dateien werden bzw. je mehr Code gelesen und umgewandelt werden muss, desto länger dauert der Prozess. Allerdings sind die Gestaltungsbögen und Skripte insbesondere für dynamische Websites essenziell – ein Verzicht auf CSS und JavaScript zugunsten einer hohen Website-Geschwindigkeit kommt daher nicht in Frage. Vielmehr sollte der Fokus darin liegen, die Codes zu optimieren.

Das können Sie tun:

  • HTML nur für die Angaben nutzen, die mit CSS nicht möglich sind
  • separate Dateien für CSS und JavaScript verwenden und nur in Ausnahmen CSS-/JavaScript-Code in die HTML-Seite schreiben (JavaScript immer ganz am Ende des Dokuments, vor dem schließenden body-Element)
  • Code-Dateien zusammenfassen und komprimieren (mehr dazu finden Sie hier)

Bilder und externe Inhalte

Multimediale Inhalte sind ein wichtiger Bestandteil einer guten Website. Gleichermaßen wie Design und Layout prägen sie das Erscheinungsbild Ihrer Website und verleihen den Texten Ausdruck. Insbesondere im E-Commerce sind Sie darauf angewiesen, Ihre Produkte mit hochwertigen Bildern zu präsentieren. Mit jedem hinzugefügten Bild oder Foto erhöht sich jedoch die Ladezeit der Website, vor allem wenn diese nicht auf dem eigenen, sondern auf einem fremden Server abgespeichert sind. Das gilt auch für andere Mediendateien wie Musik, Videos oder PDFs.

Das können Sie tun:

  • möglichst wenige Elemente von externen Seiten laden
  • überflüssige Bilder, Videos etc. vermeiden
  • Bilder mithilfe von Tools komprimieren (wie in diesem Ratgeber beschrieben)
  • Bilder auf einen externen Server auslagern
  • Breite und Höhe der Bilder angeben (werden ansonsten vom Browser berechnet)
  • SVG-Icons (skalierbare Vektorgrafiken) verwenden
  • mithilfe des jQery-Plug-ins Lazy Load den Ladevorgang aller Bilder außerhalb des Anzeigebereiches verzögern (werden erst geladen, wenn der Besucher zu ihnen scrollt)

Caching

Ein Problem vieler langsamer Websites ist der Verzicht auf Caching-Mechanismen. Dabei kann durch gut eingerichtete Zwischenspeicher mit wenig Aufwand eine Menge zur Website-Optimierung beigetragen werden. Zwischengespeicherte Inhalte müssen nicht bei jedem Aufruf erneut vom Webserver angefordert werden und laden entsprechend schneller. Nebenbei sorgt das auch für eine Entlastung des Webservers, der in der Folge wesentlich weniger Anfragen bearbeiten muss. Sie können alle statischen Elemente wie JavaScript- und CSS-Dateien, Bilder oder Dokumente cachen und definieren, wie lange diese im Zwischenspeicher verweilen sollen.

Das können Sie tun:

  • den Browser der Besucher als Cache einsetzen (Browser-Cache): bei einem Apache-Webserver beispielsweise aktivieren Sie dazu das „mod_expires“-Modul und definieren, wie lang die entsprechenden Dateitypen im Cache bleiben sollen; den Rest übernimmt der jeweilige Browser des Users
  • einen Reverse-Proxy-Server einrichten und als Cache nutzen (Webcache) bzw. auf die Dienste eines Content Delivery Networks zurückgreifen, wodurch Sie Zugriff auf ein ganzes Netz aus weltweit verteilten Reverse-Proxy-Servern erhalten
  • Cache-Software wie memcached verwenden, um dynamische Inhalte vorübergehend im Arbeitsspeicher zu hinterlegen und so die Datenbankzugriffe zu minimieren

Weitere Tipps und Tricks zur Website-Optimierung

Von diesen größeren Schritten zur Performance-Optimierung Ihres Webprojekts abgesehen gibt es viele kleinere Maßnahmen, die ebenfalls helfen, die Ladezeiten niedrig zu halten. Hierzu zählen beispielsweise:

  • Redirects/Weiterleitungen auf ein Minimum reduzieren
  • Zeichencodierung im HTML-Dokument angeben
  • fehlerhafte Inhalte regelmäßig entfernen
  • den übermäßigen Einsatz von Plug-ins im CMS vermeiden
  • in Cookies gesammelte Informationen beschränken
  • Favicons verwenden (denn Browser durchsuchen den Webserver stets nach der favicon.ico-Datei)

Wenn Sie bisher auf Maßnahmen verzichtet haben, die Ihre Website schneller zu machen, sollten Sie möglichst bald mit ihnen beginnen. Das israelische Technologie-Unternehmen Radware hat in seiner 2015 veröffentlichten Infografik zum Thema Website-Speed im E-Commerce erstaunliche Ergebnisse zu den Top 100 E-Commerce-Anbietern festgehalten. So verzichteten beispielsweise rund 50 Prozent aller Shop-Seiten auf die Komprimierung der eingebundenen Bilder, während gerade einmal zwölf Vertreter eine Ladezeit von unter drei Sekunden aufwiesen – und das, obwohl drei Sekunden als Maximalwert für die Geduld der meisten Besucher gehandelt werden.

Wollen Sie potenzielle Kunden bzw. Interessenten nicht schon beim Aufruf Ihrer Startseite verlieren, handeln Sie rechtzeitig, indem Sie Ihre Website optimieren und so nebenbei die Weichen stellen für die mobile Ära.