Bildergalerie verpixelt

  • Hallo Zusammen

    Kurze Vorstellung wer ich bin:
    Ich bin Timo 18 Jahre alt und komme aus der Schweiz.

    Ich habe letzten Oktober/November mit meinem eigenen Online-Shop angefangen und habe mich davor noch nie mit Wordpress auseinandergesetzt.
    Nachdem mehr oder weniger alles einmal lief, kamen dann erste Probleme.

    Ich hoffe ich darf hier meine Seite Posten, wäre diese hier: Frameshop.ch

    1. Die Produktbilder auf meiner Website sind scharf, wenn ich dann allerdings mit der Maus drüber hover, womit mir das erste Bild in der Galerie angezeigt wird (welches immer das gleiche wie das Produktbild ist) ist dieses völlig verpixelt.

    Ich komm nicht drauf wiso, denn es ist das genau gleiche Bild. Dazu muss ich eventuell noch sagen, dass die Bilder aus dem Internet heruntergeladen sind, da mir die ursprünglichen Firmen die Bilder nicht geben konnten.
    Mind. Auflösung ist 1000x1000 Pixel.

    2. Bei mir ist Wordpress total langsam. Wenn ich ein Produkt erstellen/bearbeiten möchte, dauert es jedesmal ca. 10 Sek. bis ich in resp. aus dem Bearbeitungsmodus des Produktes bin. Dazu kommt noch das jedesmal ca. 2-3 Mal "Error 503 Service not available" kommt.

    Ist das normal, dass das etwas schleppender geht?

    Das Theme das ich drauf habe ist Shoppistic.

    Falls ich jetzt etwas gar nicht oder nur spärlich angegeben habe bitte ich um Entschuldigung und werde ich so bald wie möglich nachreichen.

    Ich hoffe auf baldige Hilfe
    Timo

    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren


  • Die Produktbilder auf meiner Website sind scharf, wenn ich dann allerdings mit der Maus drüber hover, womit mir das erste Bild in der Galerie angezeigt wird (welches immer das gleiche wie das Produktbild ist) ist dieses völlig verpixelt.

    Ich komm nicht drauf wiso, denn es ist das genau gleiche Bild. Dazu muss ich eventuell noch sagen, dass die Bilder aus dem Internet heruntergeladen sind, da mir die ursprünglichen Firmen die Bilder nicht geben konnten.
    Mind. Auflösung ist 1000x1000 Pixel.

    Beispiel
    Das Original Bild ist 1000 x 1000 Pixel und ... erkennbar.
    https://frameshop.ch/wp-content/upl…2b6a9afbe9.jpeg

    Bei der Veröffentlichung wird dein Bild dann verkleinert (300 x 300 px) und 'optimiert'
    Das Ergebnis ist dann ein Bild mit Kompressionsartefakten
    https://frameshop.ch/wp-content/upl…0x300-lqip.jpeg

    Erklärung von Kompressionsartefakten https://de.wikipedia.org/wiki/Kompressionsartefakt


    2. Bei mir ist Wordpress total langsam. Wenn ich ein Produkt erstellen/bearbeiten möchte, dauert es jedesmal ca. 10 Sek. bis ich in resp. aus dem Bearbeitungsmodus des Produktes bin. Dazu kommt noch das jedesmal ca. 2-3 Mal "Error 503 Service not available" kommt.

    Dein von WordPress erstelltes 300 x 300 Bild ist ... wie das Original Bild... erkennbar
    https://frameshop.ch/wp-content/upl…e9-300x300.jpeg

    Am Dateinname kann man erkennen, dass du ein Bild optimierer verwendest.
    11_[COLOR=#bfbfbf]nicht_seo_optimierter_blödsinn[/COLOR]_fbe9--[COLOR=#ff99cc]gefolgt-von-datei-größe[/COLOR]-300x300[COLOR=#ff0000]-lqip[/COLOR].jpeg

    Dieser wird vermutlich die lange Zeit benötigen.

    Mit offenen Augen träumen

  • Hallo @r23

    Vielen Dank für deine ausführliche Antwort.

    Beispiel
    Bei der Veröffentlichung wird dein Bild dann verkleinert (300 x 300 px) und 'optimiert'
    Das Ergebnis ist dann ein Bild mit Kompressionsartefakten
    https://frameshop.ch/wp-content/upl…0x300-lqip.jpeg

    Ist die Schlussfolgerung davon, dass ich die Bilder mit einer Grösse von 300x300px hochladen soll?
    Oder muss ich irgendwo die Bildverkleinerung und Optimierung anpassen?
    Eine Info am Rande, die Bilder waren vor dem Bild optimierer schon von Kompressionsartefakten geprägt.


    Am Dateinname kann man erkennen, dass du ein Bild optimierer verwendest.
    11_[COLOR=#bfbfbf]nicht_seo_optimierter_blödsinn[/COLOR]_fbe9--[COLOR=#ff99cc]gefolgt-von-datei-größe[/COLOR]-300x300[COLOR=#ff0000]-lqip[/COLOR].jpeg

    Dieser wird vermutlich die lange Zeit benötigen.

    Dadurch und WPoptimize wurden die Ladezeiten meiner Website erheblich kürzer. Jedoch hatte dies keinen Effekt auf das "Admin-Tool" wenn man dem so sagen kann. Die Ladezeiten im Tool wurden allerdings auch nicht markant länger.


  • Ist die Schlussfolgerung davon, dass ich die Bilder mit einer Grösse von 300x300px hochladen soll?
    Oder muss ich irgendwo die Bildverkleinerung und Optimierung anpassen?

    Ich würde auf die Bildoptimierung verzichten oder, wenn möglich, sinnvolles verwenden.
    hier eine Übersicht von WordPress Plugins.
    https://fastwp.de/magazin/bilder-in-wordpress-optimieren/

    Ich verwende auf meinem System -
    https://github.com/google/guetzli
    oder
    https://github.com/mozilla/mozjpeg/


    Eine Info am Rande, die Bilder waren vor dem Bild optimierer schon von Kompressionsartefakten geprägt.

    eine original Datei hatte ich ja verlinkt... Das Bild ist unscharf! es wurde nur verkleinert ohne zu schärfen... ein typischer Fehler von PHP Umgebungen, die mit der gd-lib arbeiten. Per se ist das Bild mit den Schärfeverlauf nicht optimal. Da Bilder für die Kaufentscheidung sehr wichtig ist - würde die Bilder neu rendern oder eben neu fotografieren (lassen).


    Dadurch und WPoptimize wurden die Ladezeiten meiner Website erheblich kürzer. Jedoch hatte dies keinen Effekt auf das "Admin-Tool" wenn man dem so sagen kann. Die Ladezeiten im Tool wurden allerdings auch nicht markant länger.

    WPoptimize kenne ich nicht und verwende ich nicht
    https://kinsta.com/de/blog/optimiert-bilder-fur-web/

    Mit offenen Augen träumen

  • Hallo Zusammen

    Vielen Dank für eure Antworten.

    Die Links zur Bildeoptimierung sind gute Abend-Lektüren werde ich mir Mal durchlesen.

    @ManfredKunz88 meinst du die Version von Wordpress zu aktualisieren?

    Edit:
    Ich habe jetzt bei einem Produkt die Bilder auf ein Minimum herunterskaliert, so dass die Bilder noch ca. 50-150 KB hatten, brachte nichts.
    Auch nicht, wenn ich die Bildoptimierer ausschalte....

    Habe ich einfach etwas falsch verstanden oder bin ich komplett veblödet?

    Einmal editiert, zuletzt von Time-O (18. Januar 2020 um 00:16)

  • Also ich habe mir das auch angesehen und meinen Lösungsansatz solltest du einmal versuchen ;-)

    Nachfolgenen Code in die Zusätzlichen CSS eingeben (im Dashboard unter Design > Customizer > Zusätzliche CSS)

    Code
    .woocommerce .products .product:hover .product_second_img {
        opacity: 0;
    }

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:


  • Habe ich einfach etwas falsch verstanden oder bin ich komplett veblödet?

    Änderungen an "Bildoptimierer" haben keine Auswirkungen auf bestehende Bilder sondern nur an zukünftigen Bildern. Deine bestehenden / vorhandenen Bilder mit der Endung '300x300-lqip.jpeg' sind halt Schrott
    https://frameshop.ch/wp-content/upl…0x300-lqip.jpeg

    Da hilft nur austauschen, neu generieren... oder auf diese Version verzichten! Die WordPress Version ohne die lqip.jpeg Endung
    https://frameshop.ch/wp-content/upl…e9-300x300.jpeg

    ist ja vorhanden.

    Mit offenen Augen träumen

  • Deine bestehenden / vorhandenen Bilder mit der Endung '300x300-lqip.jpeg' sind halt Schrott


    Das wird ab einer Browserbreite von weniger als 1270px erst richtig unschön! Da werden die Bilder mit 300px auf 566,35px hochscaliert, das ist natürlich kein Vorteil!
    Hochwertige Kopter-Frames und grottige Bilder, bei den ersten 8 Bildern 6 abgeschnitten .... und das auf der Startseite - deine Geschäftsauslage!

    nothing is as easy as it looks. --- Wenns gefällt - gibts dafür einen Button ;)
    Manchmal komme ich mir wie eine Suchmaschine vor ....:rolleyes:

  • Vielen Dank für die vielen Anworten.

    @SEpp55 dein Lösungsansatz hat funktioniert, vielen lieben Dank, endlich Gute Bilder :).

    @r23 auch dir möchte ich für deine Bemühungen danken.

    Zum zweiten Problem, von einem Kollegen habe ich erfahren, dass Wordpress so langsam ist, soll am Host liegen.
    Also mehr oder weniger auch geköst. ;)

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!