Bilder laden erst bei Mausbewegung

Hallo,
du verwendest Elementor Pro und in der developer Console (Aufruf mit F12 bei Chrome) sieht man einige Fehler.
Das Problem solltest du zunächst lösen.

Wir können dir allerdings bei gekauften Themes (hier Enfold) oder Plugins (hier Elementor Pro) so gut wie gar nicht helfen, weil sie uns nicht zur Verfügung stehen. Wir müssten sonst bei jeder Frage erst einmal das entsprechende Theme oder Plugin kaufen, uns dort einarbeiten und dann kostenlos den Support anbieten, für den du beim Kauf eigentlich bezahlt hast. Du solltest dich in dem Fall an die Entwickler wenden. Lies bitte auch mal in der FAQ II, 1b zu diesem Thema.

Viele Grüße
Hans-Gerd

Hi Hans-Gerd,
vielen Dank erstmal für Deine schnelle Rückmeldung.

An den Problemen aus der Konsole bin ich dran.

Ich habe mal testweise das Theme geändert, auf Twenty Twenty, da besteht das Problem auch, also kann ich das Theme schonmal ausschließen, oder?

Irgendwann galt als Richtwert, dass eine Website nicht größer als 1 Megabyte sein sollte. Inzwischen haben wir mehr Bandbreite, aber 42 Megabyte für eine einzige Webseite sind dann doch recht üppig.

Google’s Page Speed gibt zwar für diese Webseite sehr gute Werte aus, reklamiert aber eine „sehr große Netzwerknutzlast“ und eine „übermäßige DOM-Größe“ mit 1.148 Elementen – bei der Kombination von Multipurpose-Theme und Elementor Page Builder nicht wirklich überraschend. Da hilft dann auch ein Cache-Plugin wie WP-Rocket nicht viel.

In Firefox und Chrome werden mir für sehr lange Zeit nur Header und Footer angezeigt und als Besucher habe ich zunächst den Eindruck, die Website ist kaputt. Als Besucher wechsele ich in solchen Fällen schnell auf andere Webseiten. Irgendwann werden die Bilder dann aber doch noch angezeigt und der beschriebene Fehler „Bilder laden erst bei Mausbewegung“ ist in beiden Browsern nicht reproduzierbar.

Fotografen möchten natürlich gerne ihr Portfolio vorzeigen und der Wunsch, möglichst viele Fotos auf einer Seite zu präsentieren ist nachvollziehbar, wirkt sich aber hier besonders unglücklich aus, weil erst alle Bilder zur Darstellung in einer Galerie abgerufen werden – der Lazy-Load-Effekt, mit dem die Bilder nach und nach geladen werden, geht dabei verloren. Wahrscheinlich hättest du mit einem Galerie-Widget von Elementor Pro schnellere Ladezeiten. Ansonsten gilt nach meinem persönlichen Empfinden „Weniger ist mehr“ – ein Viertel der Bilder bei einer qualitativen Selektion erscheint mir zielführender zu sein, sofern die Galerie nicht als Grundlage für Bildbestellungen verwendet werden muss.

Die Abmessungen der Bilder (Original: 1152 x …) scheinen mir OK zu sein, die Dateigröße (bis zu 700 kb) ist trotzdem zu hoch. Da für die Darstellung im Web EXIF-Daten und Farbprofil nicht benötigt werden, kann die Dateigröße reduziert werden – zur Not muss am Kompressionsfaktor gearbeitet werden.
(Bei einer auf Full-HD reduzierten Bildgröße, Entfernen von Farbprofil und EXIF-Daten und Kompressionsstufe 51% kann ich das Bild ChristinaBjoern-425.jpg von 443 auf 81 kb verkleinern.)

Die Verwendung des neuen Formats WebP ist vielleicht auch eine Option. In hoher Qualität und ohne Metadaten erhalte ich eine Dateigröße von 121 kb, 30% der ursprünglichen Größe. Mit dem Plugin Performance Lab erfolgt die Umwandlung nach Aktivierung in den Plugin-Einstellungen für neu hochgeladene Fotos automatisch.

 

This site will teach you how to build a WordPress website for beginners. We will cover everything from installing WordPress to adding pages, posts, and images to your site. You will learn how to customize your site with themes and plugins, as well as how to market your site online.

Buy WordPress Transfer