Hallo Leute, wir möchten unseren Zweitshop nun richtig auf Vordermann bringen. ChatGPT hat mir geraten, vor Content- und Designanpassungen erst mal die technische Seite zu überprüfen. Als ersten Schritt nannte er die Optimierung der Page Speed. Der Test bei Google Page Speed Insights lieferte eigentlich recht erfreuliche Ergebnisse. Einzig bzgl. FCP und LCP auf Mobilgeräten sei es zu lahm mit 2,4 bzw. 5,1 Sekunden. Leider werde ich aus dem Satz "Anfragen blockieren das erste Rendering der Seite, was den LCP verzögern kann. Durch das Verschieben oder Einfügen können diese Netzwerkanfragen aus dem kritischen Pfad entfernt werden." nicht schlau. Könnt ihr mir sagen, was genau hier getan werden muss? Oder gibt es unter euch Profis, die uns da unkompliziert und natürlich gegen entsprechende Bezahlung einmal helfen könnten, damit der Shop einigermaßen optimal läuft und man darauf sauber aufbauen kann? Konkrete Produktseite bei bytecheck nur 1 Stern: Unser Shop ist echt simpel und wird außer besserem Design und umfassenderen Produktseiten (Text) eigentlich nicht mehr "wachsen". Die Produktbilder werden ich noch in Aussehen und auch Größe + Typ optimieren. Alles andere ist für mich echt Neuland, aber ich habe mittlerweile mitbekommen, wie wichtig gute Performance für das Ranking ist. Im Voraus vielen Dank für jeden Tipp!
Moin! Die einzelnen Bildchen von den Logistikpartnern würde ich zusammen als 1 Bild gestalten! Bei den Zahlungsarten ebenfalls! Dann könntest du noch die "Alt" Angaben einsetzen, das bringt auch noch etwas. Wenn dann noch den Kontrast bei einigen Bildchen auf der Titelseite verbesserst, belohnt dich Google ebenfalls. Soviel mal auf die schnelle...
Ich würde hier einzelne SVGs für die Logos der Zahlungsanbieter verwenden. Der Performance-Unterschied zu einem JPG-Sprite ist dank HTTP/2 bei so wenigen, kleinen Dateien minimal. Dafür profitieren wir von den Vorteilen von SVGs: Sie sind auf allen Geräten gestochen scharf und lassen sich bei Bedarf mit CSS stylen. Da wir sie im Footer platzieren, beeinträchtigen sie die Ladezeit der Hauptinhalte nicht. Die ALT-Texte fülle ich aus Gründen der Barrierefreiheit korrekt aus.
Es wäre ja mal super wenn Gambio auf WebP oder Avif Bilder umstellen würde, veraltetes javascript, Font Probleme und einiges mehr . Ich habe jetzt auch gerade alles so optimiert,das Pagespeed nur noch beim Logo mäkelt weil man das nicht richtig responsiv einbinden kann, außer man nimmt den freigestateten Bereich, der bei mir aber aus was weiß ich für Gründen nicht richtig funzt. Ich lieg jetzt bei mobil bei der Leistung auf stabilen 75-78 ( schwankt ja immer mal), 100,100,100 und am Desktop PC 96-98,100,100,100, mehr kann ich im Cloudshop nicht rausholen, zumindest nicht für meine persönlichen Möglichkeiten. Hab recht große Bilder auf der Startseite per HTML Widget eingebunden und das klappt ganz gut. Bilder unter 100 kb halten. Falls du magst versuch mal die Bilder auf der Startseite per HTML so einzubinden. Habe meine verlinkt, musst du aber nicht. Kannst da auch die Größen im Style anpassen. Exakte Größe nehmen ist wichtig . Beim Bilder speichern im Grafikprogramm schaust du das du die Komprimierung auf min. 75 - 80 einstellst. Das größte erste Bild mit fetchpriority"high“ laden den Rest mit loading "lazy" <style type="text/css"> .image-container-rechts { text-align: center; margin: 5px auto; background: #f4f4f4; border-radius: 10px; box-shadow: 0 0 0px rgba(0,0,0,0.07); overflow: hidden; display: flex; padding: 0px 0px 0px 0px; box-Shadow: 0px #ccc; position: relative; flex-direction: column; align-items: center; justify-content: center; height:400px; /* Beibehaltung des Seitenverhältnisses */ } .image-container-rechts img { width: 600px; /* Verkleinert das Bild auf 50% der Containerbreite */ height:400px; /* Beibehaltung des Seitenverhältnisses */ margin: 5px; /* Abstand zwischen Bildern */ }</style> <div class="image-container-rechts"> <a href="/deine-url.html "><img alt="Alt Text nicht vergessen „fetchpriority=high“ src="dein-bild.jpg" /></a> </div Die classes ( hier image-container-rechts) sollten aber dann bei jedem weiteren Bild geändert werden , sonst beißt sich das. Was du da nimmst ist schnuppe . Aber so richtig zufrieden bin ich mit den 75 mobil nicht. Für den Core Web Vitalis braucht es noch ein paar Gambio interne Verbesserungen für die Cloudshop Besitzer . https://www.oberschick.de
Ich wollte mir das auf Eurem hinterlegten Shop anschauen, aber das sind die Logos der Zahlungsanbieter im Footer doch alles png's?
Vielen Dank für eure Antworten. Ich weiß, dass der damals vom Chef ohne viel Wissen erstellte (Zweit-)Shop noch gravierende (SEO-)Mängel aufweist. Ich bin dabei, mich in diese Thematik einzuarbeiten und das in den nächsten Monaten wirklich auf ein ordentliches Niveau zu bringen. Finde es auch super, dass ihr mich auf verschiedenste Punkte hinweist. Aber kann denn jemand etwas zu meiner eigentlichen Frage sagen? Also: "Leider werde ich aus dem Satz "Anfragen blockieren das erste Rendering der Seite, was den LCP verzögern kann. Durch das Verschieben oder Einfügen können diese Netzwerkanfragen aus dem kritischen Pfad entfernt werden." nicht schlau. Könnt ihr mir sagen, was genau hier getan werden muss?" Es muss ja einen solideren Grund haben, warum wir eine so schlechte Speed/Performance aufweisen. Der Hoster ist übrigens UnitedDomains. Ist der etwa net so doll?
Guten Morgen, ich würde jede Schrifft auf #000, also schwarz setzen. Schwarz - weiß ist der beste Kontrast. Das mit den Bildern im Footer wurde ja schon erwähnt. Favicon fehlt. Ich empfehle, im chrome rechte Maustaste mal auf untersuchen und dann Lighthouse mobil mal durchlaufen lassen, da bekommst du angezeigt was du machen kannst. Es gibt so einige Dinge, da kann man nichts machen.