Deine Website für bessere Leistung optimieren
Die Website-Leistung spielt eine wichtige Rolle für deinen Erfolg online. Auf Leistung optimierte Seiten verbessern die Wahrnehmung deiner Marke, verschaffen dir online einen Wettbewerbsvorteil und sorgen dafür, dass deine Nutzer immer wiederkommen. Schnellere Websites erhöhen die Nutzerbindung, die Verweildauer von Besuchern, den Umsatz und damit letztlich deinen Gewinn.
Damit du Besuchern deiner Website tatsächlich eine erstklassige Erfahrung bieten kannst, musst du die Leistung deiner Seite ständig optimieren. Und mit Googles Core Web Vitals (CWV) als neuen aussagekräftigen Leistungskennzahlen ist jetzt die perfekte Zeit dafür.
Die CWV-Kennzahlen erleichtern das Messen und Überwachen der Website-Leistung durch die Bewertung von drei wesentlichen Faktoren, die die Ladezeit deiner Seite beeinflussen. Warum dich das interessieren sollte? Weil Google diese Core Web Vitals in seinen Suchalgorithmus integriert. Das bedeutet, dass diese Werte mit darüber entscheiden, wie die größte Suchmaschine der Welt deine Website bewertet.
Bei Wix verbessern wir laufend unsere Software und Infrastruktur, damit die Websites unserer Nutzer schnellstmöglich laden und reagieren. Daneben gibt es jedoch noch weitere Faktoren, die die Leistung einer Website mitbestimmen. Dazu gehören Anwendungen, Designelemente und Medieninhalte. Und das sind Punkte, an denen du optimieren kannst.
In diesem Artikel beschreiben wir verschiedene Komponenten, die die Leistung deiner Website beeinflussen, damit du der Konkurrenz einen Schritt voraus sein kannst, da die Core Web Vitals ein neuer Standard zur Messung der Website-Leistung werden.
Einführung
Prioritäten bei der Optimierung
In diesem Abschnitt erläutern wir einige Fragen, die du dir stellen solltest, und geben Tipps, wie du die Leistung deiner Website schnell verbessern kannst.
Was soll deine Website erreichen?
Wenn du die Leistung deiner Website optimieren willst, solltest du erst mal wissen, welche Ziele du mit der Seite verfolgst. Das gibt dir ein besseres Verständnis dafür, welches Benutzererlebnis du auf deiner Website vermitteln willst und was deine Nutzer tun sollen, während sie auf deiner Seite sind.
Sieh dir die Ladezeit deiner Website an
Bevor du mit der Optimierung beginnst, solltest du dir die aktuelle Ladezeit deiner Website ansehen und herausfinden, was diese verlangsamen könnte. In der neuen Website-Geschwindigkeits-Verwaltung von Wix siehst du jetzt noch einfacher, wie deine Website bei tatsächlichen Besuchen (sogenannten Felddaten) abschneidet. Außerdem siehst du den auf Labordaten basierten PageSpeed-Insight-Wert für Mobilgeräte und Desktop.
Die regelmäßige Kontrolle der Leistung liefert dir die nötigen Erkenntnisse, um deine Website in die richtige Richtung zu entwickeln.
Was weißt du über die Besucher deiner Website (und ihre Ladezeiten)?
Die Statistiken von Wix verraten dir eine Menge über die Besucher deiner Websites. Kommen sie aus Ländern mit langsamerem Internet? Verwenden sie eher Low-End-Mobilgeräte? Wenn ja, könntest du gewisse Aspekte deiner Website optimieren, um die Ladezeiten unabhängig von der Internetverbindung oder den Geräten deiner Besucher zu verkürzen.
Erste Schritte
Optimiere deine Mediendateien für schnellere Ladezeiten
Fotos, Illustrationen und Videos können deine Website attraktiver machen – aber auch verlangsamen. Damit deine Website schneller geladen werden kann, optimiert Wix automatisch Bilder und Videos für dich. Platzhalter mit geringerer Qualität und verzögertes Laden von Mediendateien außerhalb des zuerst angezeigten Bereichs („Lazy Loading“) sorgen dafür, dass deine Website schnell und flüssig geladen wird. Erst wenn Besucher auf der Seite scrollen, ersetzt Wix die Platzhalter durch höherwertige Mediendateien. Das hält die Ladezeiten so kurz wie möglich.
Hier sind einige Dinge, die du tun kannst, um deine Mediendateien für eine schnelle Website zu optimieren.
Verwende wenn möglich JPG statt PNG
JPG-Bilder sind bis zu 10x kleiner als PNGs und können entsprechend schneller geladen werden. Verwende sie also wo immer möglich. PNG-Bilder solltest du nur verwenden, wenn du Transparenz benötigst (das unterstützt JPG nicht) oder Bilder, die höchstmögliche Qualität haben müssen.
Verwende SVG für Formen, Symbole und Logos
PNG und JPG sind gute Formate für Fotos, aber für Formen und gezeichnete Elemente wie Logos ist das SVG-Format geeigneter. SVG-Dateien sind in der Regel viel kleiner als PNGs und JPGs und auch schneller geladen, da sie direkt in HTML eingebettet sind. Außerdem sehen SVGs immer scharf aus, egal wie sehr sie vergrößert werden. Verwende sie also wo immer möglich.
Wir empfehlen Bilder/PNGs nur dann, wenn das SVG-Element SEHR komplex ist (z. B. ein Bild der Küste von Norwegen mit annähernd 250 kB) und das Element im Layout nur wenig Raum einnimmt – besonders für Formen, die nicht unmittelbar sichtbar sind.
Vermeide animierte GIFs
Alle lieben schicke Animationen. Aber animierte GIFs sind in der Regel groß und haben entsprechend lange Ladezeiten. Wenn du eine Animation auf deiner Website einbauen willst, verwende stattdessen ein Video, da diese Dateien kleiner sind und die Inhalte bereits angezeigt werden können, bevor die Datei vollständig heruntergeladen wurde. Wir empfehlen GIFs nur für einfache animierte Grafiken oder Logos oder wenn dein animierter Inhalt nur wenige Bilder hat und klein ist (z. B. 100x100 Pixel).
Tipp: Bessere Leistung mit der Videobox von Wix
Eine Videobox statt animierter GIFs liefert bessere Leistung als externe Video-Player wie YouTube und Vimeo.
Medienoptimierung
Weitere Tipps für Mediendateien
Hier sind weitere Tipps, wie du Mediendateien für die Leistung deiner Website optimieren kannst.
Füge Bilder zusammen
Wenn du Überlagerungen verwendest, fasse sie in einem Bild zusammen, um die Downloadgröße zu reduzieren. Dadurch ist vielleicht auch keine Transparenz mehr nötig, wodurch du ein einzelnes JPG-Bild verwenden und den Download entsprechend beschleunigen kannst.
Lehn dich entspannt zurück mit Lazy Loading
Wix nutzt „Lazy Loading“ für das schnellere und reibungslosere Laden von Websites. Dabei werden hochauflösende Bilder durch Platzhalter mit geringerer Qualität ersetzt. Um Lazy Loading zu optimieren, verschiebe Bilder mit geringerer Priorität auf der Seite weiter nach unten, damit sie mehr Zeit haben, um voll geladen zu werden.
Unterteile große Hintergrundbilder in einzelne Abschnitte
Die Länge von Website-Seiten kann sich über mehrere Bildschirmlängen erstrecken und beim Surfen zu Verzögerungen führen, während der Browser wartet, bis große Hintergrundbilder geladen wurden. Um das Laden zu beschleunigen, teile große Hintergrundbilder in jeweils etwa einen Bildschirm lange vertikale Abschnitte auf. Dann kann deine Seite mit Lazy Loading schneller geladen werden und Bilder werden erst heruntergeladen, wenn Nutzer nach unten scrollen.
Verbessere die Leistung deiner Website mit dem Video-Player von Wix
Nutze den integrierten Video-Player von Wix statt externer Player wie YouTube und Vimeo, um die Leistung deiner Website zu verbessern.
Gleiche Hintergrundfarben und Primärfarben von Bildern an
Du kannst eine Farbe für Hintergrundelemente wie Streifen oder Spalten festlegen. Diese Farbe ist hinter teilweise transparenten Bildern zu sehen und wird auch angezeigt, bevor Bilder geladen wurden. Wenn du eine zur Primärfarbe deines Bildes passende Hintergrundfarbe wählst, kann das die Wahrnehmung deiner Seite durch die Nutzer verbessern.
Eine Website, die Lazy Loading für optimierte Ladezeiten nutzt
Weitere Medienoptimierung
Conclusion
Many agencies aren’t upselling soon enough. And they’re risking premature customer churn because of it.
Knowing when to upsell a client can feel more art than science, but a study by Vendasta claims to have found the perfect time to expand your relationship with a client: 3 months.
Ninety days may seem like a short timeline to start upselling, but if a client is satisfied with your work in that time period then upselling can bring them more value quicker than they expected. Alternatively, if they’re not satisfied, it gives you a chance to recalibrate so you can keep their business. Both of those scenarios result in additional revenue you would have missed out on had you not initiated the conversation.
Upsells are easier to approach and able to start earlier than most agencies realize. Here are four critical steps that will help you upsell sooner successfully.
Optimiere deinen Text
Text wird in der Regel schneller geladen als Bilder, aber dennoch kannst du auch Text und Schriftarten deiner Website noch optimieren.
Zeige relevanten Text in der ersten Ansicht
Wenn der Bereich „über der Falz“ deiner Website relevanten Text enthält, wissen deine Besucher bereits mehr über deine Seite, bevor sie nach unten scrollen. Sorge dafür, dass dieser Text ansprechend ist und die Leute dazu anregt, deine Website weiter zu erkunden. Besucher springen ab, wenn der erste Text, den sie sehen, nicht relevant ist (oder schlimmer noch, die Seite so leer ist, dass sie den Eindruck bekommen, sie ist gar nicht vollständig geladen). Nutze also diesen Raum – und deine Worte – sorgfältig, um Besucher bestmöglich anzusprechen und zu binden.
Verwende nicht zu viele Schriftarten
Wir alle wissen, dass es Spaß macht, mit Schriftarten herumzuspielen, aber wenn du zu viele Schriftarten, Schriftbreiten und Schriftgrößen verwendest, kann das chaotisch aussehen, die Lesbarkeit verschlechtern und deine Seite langsamer machen. In vielen Fällen wird Text erst sichtbar, wenn die entsprechende Schriftartdatei heruntergeladen wurde. Dementsprechend laden Seiten unter Umständen langsamer, wenn erst mehrere Schriftarten heruntergeladen werden müssen. Wir empfehlen daher, pro Seite maximal fünf verschiedene Schriftarten zu verwenden.
Lade eine eigene Schriftart nur einmal hoch
Wenn du eine benutzerdefinierte Schriftart verwendest, achte darauf, dass du sie nicht mehrmals hochlädst. Das kann nämlich dazu führen, dass eine Schriftart auf einer Seite mehrmals heruntergeladen wird. Das verringert die Leistung deiner Website und macht sie möglicherweise langsamer. Der Wix Editor ist eine gute Möglichkeit hierfür und lädt deine benutzerdefinierten Schriftarten hoch und priorisiert schnellere Ladezeiten.
Vermeide Text in Bildern
Die Kombination von Text und Bildern macht auf Besucher deiner Website den meisten Eindruck. Aber Text IN Bildern kann die Leistung deiner Website beeinträchtigen. Suchmaschinen oder Screenreader können in ein Bild eingebetteten Text nicht erkennen. Außerdem sind diese Text in den meisten Fällen verpixelt und schwerer lesbar. Und was die Leistung angeht, so ist der Text nicht sichtbar, bis das Bild voll geladen ist.
Verwende Einblendeanimationen nur sparsam
Einblendeanimationen können wichtige Inhalte hervorheben und die Nutzererfahrung beim Laden bereichern. Aber wenn sie exzessiv eingesetzt werden, kann das störend wirken. Außerdem ist Text erst lesbar, wenn die Animationen beendet sind, was die Ladezeit verlängert. Daher raten wir dir, Einblendeanimationen eher sparsam einzusetzen.
Achte auf starken Kontrast
Wenn du Text über einem Bild darstellst, achte auf einen starken Kontrast zum darunterliegenden Bild und der Hintergrundfarbe. So ist der Text bereits lesbar, bevor das Bild geladen wurde.
Beispiel für den ersten Eindruck einer Website
Textoptimierung
Was verlangsamt deine Website sonst noch?
Wenn du immer noch Probleme mit der Leistung deiner Website hast, haben wir hier noch weitere Optimierungstipps für dich.
Sieh dir Komplexität und Seitenlänge an
Um die Ladezeit deiner Website zu optimieren, solltest du dir auch die Seitenlänge ansehen. Deine Seiten wachsen mit den Inhalten, die du auf ihnen veröffentlichst, aber je mehr Inhalt eine Seite hat, desto länger wird sie – und desto länger dauert es, sie zu laden. Daher könntest du zu lange Seiten auf mehrere kürzere Seiten mit jeweils speziellen Inhalten aufteilen.
Optimiere deine Website für Mobilgeräte
Mit dem Mobile-Editor von Wix macht deine Website auf allen Geräten gute Figur. Wähle ein Layout, füge unterschiedliche Inhalte für Mobile und Desktop hinzu, blende weniger wichtige Inhalte aus und reduziere die Anzahl der Elemente in Galerien, Feeds und Repeatern.
Bedenke die Wirkung von iFrames, Google Ads und Analyse-Werkzeugen auf deine Website
Website-Integrationen wie iFrames (bei denen zusätzlicher HTML-Code und andere Ressourcen heruntergeladen werden) und Google Ads können die Leistung deiner Website beeinträchtigen. Setze daher iFrames nur sparsam ein und achte bei der Verwendung von Google Ads darauf, dass alle Felder sichtbar sind. Nachverfolgungs- und Analysewerkzeuge können deine Website ebenfalls verlangsamen, also verwende nur jene, die du wirklich brauchst, um das Besucherverhalten auf deiner Seite zu analysieren. Du kannst auch die Leistung deiner Seite vorher und nachher (mit und ohne) Zählpixel testen, um besser abzuschätzen, welchen Einfluss sie auf die Ladezeiten deiner Website haben.
Beschränke den Einsatz von Lightboxen
Lightboxen sind Pop-up-Fenster, die über dem Hauptinhalt deiner Seite angezeigt werden. Sie eignen sich bestens für wichtige Nachrichten und Ankündigungen. Aber Lightboxen, die beim Laden einer Seite automatisch eingeblendet werden, führen zu einer Verzögerung, bis diese Inhalte sichtbar sind. Daher empfehlen wir dringend, Lightboxen nur für Zusatzinformationen wie spezielle Sales zu verwenden, nicht aber für grundlegende Inhalte deiner Seite, wie etwa deinen Firmennamen.
Zusammenfassung
Nachdem die Core Web Vitals Teil von Googles Suchalgorithmus werden, sollte die Optimierung der Leistung deiner Website für dich stets an erster Stelle stehen. Bei Wix sind wir bezüglich der Website-Leistung immer auf dem neuesten Stand und sorgen so dafür, dass die hunderten Millionen auf unserer Plattform gehosteten Websites optimal performen.
Allgemeine Optimierungstipps
Ready to learn more?
For an overview of website performance and to get your site up to speed, read our Intro to Performance article. Or to get a detailed understanding of Core Web Vitals, read our in-depth guide.
Author: Dan Shappir
Dan focuses on optimizing all sites hosted on Wix for speed. With over 25 years of software development experience, Dan has worked on systems ranging from multi-user games to missile trajectory simulations. He is a frequent speaker at technical conferences, a panelist on the JavaScript Jabber podcast and a member of the Google Chrome Advisory Board (CAB). Dan holds an M.Sc. in Computer Science.
Willst du noch mehr wissen?
Einen Überblick über die Website-Leistung und wie du deine Seite beschleunigen kannst, findest du in unserer Einführung in Website-Performance. Und in unserem Guide zu den Core Web Vitals erfährst du alles über die neuen Kennzahlen.
Dan spezialisiert sich auf die Optimierung der Geschwindigkeit aller bei Wix gehosteten Websites. Dan hat über 25 Jahre Erfahrung in der Softwareentwicklung und bereits an allen möglichen Systemen gearbeitet, von Multiplayerspielen bis zu Simulationen von Raketenflugbahnen. Er hält regelmäßig Vorträge bei technischen Konferenzen, tritt im JavaScript-Jabber-Podcast auf und ist Mitglied des Beratergremiums für Google Chrome (Chrome Advisory Board, CAB). Dan hat einen M.Sc. in Informatik.
Autor: Dan Shappir
Performance Tech Lead bei Wix.com
