Die effizienteste Methode zum Einbetten von Videos in WordPress

Veröffentlicht: 2024-03-04

Inhaltsverzeichnis
WordPress mit Videos: Core Web Vital-Test
Was brauchen Sie, um das Problem zu beheben?
Zusammenfassung

Erinnern Sie sich an die Zeiten, als Einwahl- und Edge-Verbindungen (2G) ein Luxus waren und das Ansehen von Videos auf YouTube unsere Geduld auf die Probe stellte?

Wenn Sie kein superschnelles Internet hätten, würden Sie auf die Wiedergabetaste Ihres Lieblingsvideos klicken, auf Pause klicken und es laden und zwischenspeichern lassen. In der Zwischenzeit gingen Sie eine Tasse Kaffee kochen. Als Sie zurückkamen, konnte das Video, wenn Sie Glück hatten, nahtlos in einem Durchgang gestreamt werden, andernfalls kam es zu Pufferung.

Aber das Beste ist jetzt, dass es nicht mehr passiert und schnelle Internetverbindungen zur neuen Normalität geworden sind. Dank der 5G-Technologie können Menschen YouTube-Videos jetzt auch in 4K-Auflösung nahtlos ansehen.

Aktuelles Szenario der Verwendung von Videos auf der Website

Aus diesem Grund ist auch das Einbetten von Videos auf Websites so weit verbreitet. Schließlich bieten Videos eine ansprechendere Möglichkeit zur Kommunikation und verbessern das Benutzererlebnis.

Manche Leute gehen noch einen Schritt weiter und verwenden Videos als gesamten Hintergrund für ihre Website, um dem Design ihrer Website ein dynamisches und optisch ansprechendes Element hinzuzufügen.

Da sich diese Strategie als wirksamer erwies, um die Aufmerksamkeit der Besucher zu fesseln und zu behalten, erwies es sich für jeden als gängige Praxis, Videos in seine WordPress-Seiten einzubetten.

Tatsache ist jedoch, dass nicht jeder es richtig macht. Die meisten von ihnen wissen nicht, wie man Videos richtig in WordPress einbettet, und verlangsamen dadurch letztendlich die Geschwindigkeit ihrer Website.

Es ist keine erfundene Aussage; Wir lassen lieber die Zahlen und Ergebnisse die Wahrheit sagen.


WordPress mit Videos: Core Web Vital-Test

Kommen wir direkt zu den Tests und Ergebnissen, ohne weiter zu schleppen oder zu prahlen.

Zu Testzwecken haben wir zunächst eine einfache und einfache WordPress-Website ohne Videos und Grafiken genommen und sie ausprobiert.

Die Ergebnisse waren wie folgt:

image 8 The Most Efficient Method To Embed Videos On WordPress
  • Sie können sehen, dass die Punktzahl 100 % betrug und ein grünes Signal angezeigt wird. Alle Kennzahlen zeigen positive Reaktionen sowohl für Mobilgeräte als auch für Desktops.

Aber als wir der Homepage der WordPress-Site ein YouTube-Video hinzufügten und den Test erneut durchführten. Die Ergebnisse waren überraschend;

image 9 The Most Efficient Method To Embed Videos On WordPress
  • Nur für ein einzelnes Video sank der Wert auf 65 %, und alle anderen Kennzahlen verhielten sich ähnlich. Sie wurde drastisch um 35 % gesenkt, ein Trend, der sich mit der Hinzufügung weiterer Videos noch verschlimmern könnte.

Jetzt fragen Sie sich vielleicht: Was ist die Lösung?


Was brauchen Sie, um das Problem zu beheben?

Der direkte Ansatz, an den Sie vielleicht denken, besteht darin, keine Videos auf der Website zu verwenden, aber das ist nicht der richtige Ansatz. Videos haben ihren Wert und verbessern auch das Benutzererlebnis der Website. Sie können sie also nicht einfach ignorieren, nur um die Geschwindigkeit Ihrer Website zu steigern.

1. Wählen Sie eine renommierte Video-Hosting-Plattform

Erstens wäre es großartig, wenn Sie Videos auf einer kostenlosen Video-Hosting-Plattform wie YouTube, Vimeo oder Wistia hosten oder hochladen würden, anstatt sie auf Ihrem Webserver zu hosten. Dadurch werden nicht nur die Ressourcen Ihres Servers geschont, sondern auch die Belastung verringert und die Servergeschwindigkeit wird nicht beeinträchtigt.

Diese Video-Hosting-Plattformen sind gut für die Videobereitstellung optimiert und können die für das Streaming von Videos erforderliche Bandbreite bewältigen.

Hinweis : Wenn Sie mit WordPress Ihre eigene Video-Tube-Website erstellen möchten, außer kostenlosen Video-Hosting-Plattformen, kann keine andere private Video-Hosting-Plattform die dedizierte Video-Hosting-Plattform von WPOven in fast allen Punkten schlagen.

2. YouTube-Videos ohne Cookies einbetten

Sie werden überrascht sein, dass es neben der standardmäßigen YouTube-Einbettung auch eine spezielle Version namens youtube-nocookie.com gibt.

Das Einbetten von YouTube-Videos aus der Standardversion bringt viele weitere unerwünschte Elemente wie Cookies, Skripte usw. mit sich, die nicht erforderlich sind. Um dies effizienter zu gestalten, hat YouTube daher die Version youtube-nocookie.com eingeführt, die leichter ist und Ihren Page-Speed-Score nicht wesentlich beeinflusst.

Hier sind einige interessante Fakten über Youtube-nocookie.com

  • Es handelt sich um eine alternative Domain zum Einbetten von YouTube-Videos.
  • Diese Domain dient der Einbettung von Videos ohne das Setzen von Cookies für Trackingzwecke.
  • Bei der regulären YouTube-Einbettung (youtube.com) können Cookies im Browser des Betrachters gesetzt werden.
  • Die Domain „youtube-nocookie.com“ bedient den einbettenden Player, ohne dass Cookies gesetzt werden.
  • Dies ist nützlich für Websites, bei denen die Privatsphäre der Benutzer im Vordergrund steht und die Verwendung von Cookies minimiert werden soll.
  • Durch die Verwendung von „youtube-nocookie.com“ wird sichergestellt, dass eingebettete Videos nicht zu einer unnötigen Nachverfolgung von Website-Besuchern beitragen.

Sie müssen lediglich die URL eines YouTube-Videos ändern, indem Sie „youtube.com“ durch „youtube-nocookie.com“ ersetzen, und schon kann es losgehen.

3. Verwenden Sie LazyLoad-Plugins

Lazy Loading ist eine der besten Techniken zur Optimierung der Website-Geschwindigkeit, indem bestimmte Elemente einer Website einfach verschoben werden. Das Plugin verzögert das Laden von Elementen wie Bildern oder Videos, bis der Benutzer zu ihnen gescrollt hat oder sie in ihre Ansicht gelangen.

So passiert es:

  • Das Lazy-Loading-Plugin scannt den Inhalt der Webseite bei der Initialisierung.
  • Es überwacht kontinuierlich den für den Benutzer sichtbaren Teil der Website.
  • Wenn Elemente, die für Lazy Loading markiert sind, im Ansichtsfenster des Benutzers angezeigt werden, löst das Plugin deren Laden aus.
  • Wenn die Benutzer das Ansichtsfenster betreten, werden Elemente dynamisch geladen, häufig mithilfe von JavaScript, ohne dass ein vollständiges Neuladen der Seite erforderlich ist.
  • Lazy-Loading-Plugins verwenden JavaScript, um Inhalte dynamisch in die Webseite zu laden, während der Benutzer mit ihr interagiert.
  • Plugins priorisieren das Laden basierend auf der Position oder Wichtigkeit des Elements und sorgen so für ein nahtloses Benutzererlebnis und reduzieren gleichzeitig die anfänglichen Ladezeiten und die Bandbreitennutzung.

Hinweis: Dieser Ansatz weist bestimmte Einschränkungen auf. Das Lazy-Load-Plugin funktioniert nicht, wenn die Videos in der ersten Falte platziert werden, funktioniert aber am besten, wenn die Videos unterhalb der ersten Falte sichtbar sind.


Lesen Sie: 22 beste Möglichkeiten, die WordPress-Leistung zu beschleunigen


4. Fassadentechnik

Der Facade-Ansatz ist eine der cleveren Möglichkeiten, die Lazy-Loading-Technik umzusetzen. Bei diesem Ansatz verwenden Sie zunächst einen statischen Bildplatzhalter anstelle des Videos. Dieses Bild ähnelt normalerweise der Miniaturansicht des Videos mit einer Überlagerung der Wiedergabetaste.

Wenn der Benutzer auf die Überlagerung der Wiedergabeschaltfläche klickt, erscheint ein Popup-Fenster und das eigentliche Video wird im selben Popup-Fenster geladen.

Zu Ihrer Information und zum besseren Verständnis finden Sie hier ein Beispiel.

Dieser Ansatz ist sehr effektiv und belastet Ihre WordPress-Site nicht mit YouTube-Videos, es sei denn, dies ist erforderlich.

Lazy Load by WP Rocket

Wenn dieser Lightbox-Ansatz nicht zu Ihnen passt, verwenden Sie ein beliebtes WordPress-Plugin namens „LazyLoad Plugin“. Es funktioniert mit oEmbed und ersetzt eingebettete YouTube- und Vimeo-Videos durch ein anklickbares Vorschaubild.


Zusammenfassung

Fassen wir nun zusammen, was wir im obigen Beitrag erwähnt haben. Zweifellos sind Videos eine der besten und interaktivsten Möglichkeiten, Informationen auszutauschen. Allerdings möchte niemand diesen Preis für die Verlangsamung seiner Website zahlen.

Aber glücklicherweise gibt es einige Tipps und Tricks, die wir bereits erwähnt haben und die Wunder für Ihre Website bewirken können, ohne Kompromisse bei der Geschwindigkeit und Leistung der Website einzugehen. Befolgen Sie also diese Tipps und steigern Sie die Geschwindigkeit Ihrer Website, um eine Punktzahl von 100 zu erreichen. Probieren Sie es einfach aus und gewinnen Sie das Rennen.