Inhaltsverzeichnis
Die Onlineshop-Optimierung ist ein richtig umfangreiches Thema, das wir in einer Artikelserie behandeln wollen. In diesem Artikel konzentrieren wir uns auf die Optimierung der Shopsoftware. Dies ist eine kostenintensive, dafür aber sehr wichtige Angelegenheit, die technische Qualität Ihres Onlineshops zu verbessern.
| To-dos | Kommentar |
|---|---|
| Optimierung der Bilder | Reduzieren Sie die Ladezeiten von Webseiten, indem Sie Bilder in angemessener Größe, die für das Web optimiert wurden, hochladen. Alternativ lassen Sie auch Ihren Server spezielle Tools installieren und einrichten, die diese Aufgabe komplett übernehmen. |
| Kombinieren Sie Bilder mithilfe von CSS Background Stripes | Vereinen Sie gleichartige Bilder (z.B. Icons) in einem Bild und lassen Sie den richtigen Ausschnitt (das ursprüngliche Bild) mithilfe von CSS darstellen. |
| Definieren Sie die Höhe und Breite für alle Bilder in Ihrem Onlineshop | Durch solche Angaben wird ein schnelleres Rendern möglich, da keine unnötigen Anpassungen der Darstellungsgröße mehr erforderlich sind. |
| Nutzen Sie Browser-Caching | Dank einer effizienten Nutzung der Browser-Cache-Funktion lassen sich die Inhalte für wiederkehrende Besucher schneller laden.Teilen Sie die statischen Inhalte in Gruppen auf und bestimmen Sie die Lebensdauer des Cache für jede Gruppe. |
| Um ein effizientes Caching für öffentliche Ressourcen, z.B. Facebook, Google etc. zu ermöglichen, laden Sie diese Ressourcen herunter und liefern Sie diese von Ihrem Server aus. | |
| JavaScripts entfernen, die das Laden der Website hinauszögern | Um eine Seite zu laden, muss der Browser den Inhalt aller |
| Optimieren Sie die Reihenfolge von JavaScripts und CSS | Durch die korrekte Anordnung von externen Stylesheets sowie Inline-JavaScripts können Daten parallel heruntergeladen werden, was die Rendering-Zeit des Browsers beschleunigt. Um das parallele Herunterladen zu ermöglichen, platzieren Sie ein Inline-JavaScript vor der externen CSS-Datei oder nach der nächsten Ressource. |
| HTML, JavaScripts, CSS minimieren | Minimierung von HTML, JavaScripts und CSS kann einige dutzend oder hundert KB pro Seite einsparen, bezogen auf tausende Besucher kann eine solche Einsparung wesentlich sein. |
| Skalierte Bilder nutzen | Man soll vermeiden, große Bilder via CSS und HTML zu verkleinern, denn diese werden vollständig geladen, auch um in einem kleineren Format gezeigt zu werden. |
| Nutzung von Server-Cache | Bei Magento 2 und Shopware gibt es Varnish direkt aus der Box. Bei OXID brauchen Sie eine Enterprise Edition oder unsere innovative Lösung Varnish Cache Performance. Die große Kunst ist hier, nicht Varnish einzuschalten, sondern es richtig zu konfigurieren. Bitte überprüfen Sie, ob es wie erwartet funktioniert, sonst haben Sie es falsch konfiguriert. |
| JavaScripts und CSS vereinen | Je weniger Dateien fürs Laden einer Seite notwendig sind, desto schneller wird die Seite geladen. Daher empfiehlt es sich, alle CSS-Dateien und JavaScripts in so wenig Dateien wie möglich zu vereinen, im Idealfall – 1 JavaScript-Datei und 1 CSS-Datei. Manchmal ist es sogar sinnvoll, die kleinsten CSS oder JavaScript Code Snipets direkt in HTML einzuschließen. |
| Lazy Loading nutzen | Nutzen Sie Lazy Loading, damit die Nutzer die Inhalte schnellstmöglich sehen. Die Inhalte aus den unsichtbaren Bereichen können immer noch nachgeladen werden. |
| unnötige Module und Plug-ins abschalten | Oft weniger ist mehr! Je mehr Module und Plug-ins Sie nutzen, desto langsamer ist Ihr Onlineshop. Und oft ist der Nutzen geringer als der Schaden durch die Verlangsamung Ihres Onlineshops. Sie müssen wirklich gute Argumente haben (am besten statistisch bewiesen), warum ein Modul oder Plug-in aktiv bleiben soll. Dieses Problem ist enorm wichtig bei Onlineshops mit über 20 Modulen. |
| unnötige Inhalte entfernen | Nicht alle Inhalte, die Sie für wichtig für Ihre Kunden halten, sind auch solche. Führen Sie A/B-Tests durch, um die Wichtigkeit der Inhalte zu überprüfen und entfernen Sie alle Inhalte, die für Ihre Kunden in der Tat unwichtig sind. Dadurch wird die Anzahl von Serverabfragen reduziert und die Ladezeiten werden verkürzt. |
| Refactoring von Code | Die modernen Shopsysteme sind kompliziert, und es gibt diverse Lösungsalternativen für das eine oder andere Problem. Nicht immer entscheiden sich die Programmierer/Kunden für die optimale Lösung. Auch eine schlechte Code-Qualität kann zu Performance- Problemen führen. Bestimmen Sie mithilfe von Profiling die Schwachstellen und lassen Sie ein Code-Refactoring machen, um die Code-Qualität und die Performance Ihres Onlineshops zu verbessern. |
Fazit
Richtige Nutzung von Cache kann richtig viel ausmachen, gerade wenn Ihre Server unter hoher Last stehen, weil Sie z.B. eine Werbungskampagne gelauncht haben. Auch Code-Refactoring sollte man nicht unterschätzen. Wenn in einem Onlineshop mehrere dutzend Module installiert sind, gibt es unter denen bestimmt solche, die suboptimal programmiert waren und verbesserungsbedürftig sind.
