Najskuteczniejsza metoda osadzania filmów w WordPress

Opublikowany: 2024-03-04

Spis treści
WordPress z filmami: test Core Web Vital
Czego potrzebujesz, aby to naprawić?
Streszczenie

Ach, czy pamiętacie czasy, kiedy połączenia telefoniczne i połączenia brzegowe (2G) były luksusem, a oglądanie filmów na YouTube zdawało się wystawiać na próbę naszą cierpliwość?

Jeśli nie masz superszybkiego Internetu, możesz kliknąć przycisk odtwarzania swojego ulubionego filmu, nacisnąć pauzę i pozwolić mu się załadować i buforować. W międzyczasie poszedłeś zrobić sobie filiżankę kawy. Kiedy wrócisz, jeśli będziesz miał szczęście, wideo będzie przesyłane płynnie za jednym razem lub być może będziesz musiał cierpieć z powodu buforowania.

Ale najlepsze jest to, że już się to nie zdarza, a szybkie połączenia internetowe stały się nową normalnością. Dzięki technologii 5G ludzie mogą teraz bezproblemowo oglądać filmy z YouTube nawet w rozdzielczości 4K.

Przedstawiony scenariusz wykorzystania Filmów w Serwisie

Z tego powodu popularne stało się także osadzanie filmów na stronach internetowych. W końcu filmy oferują bardziej wciągający sposób komunikacji i podniesienia komfortu użytkowania.

Niektórzy ludzie idą jeszcze dalej, wykorzystując filmy jako całe tło swojej witryny internetowej, aby dodać dynamiczny i atrakcyjny wizualnie element do projektu swojej witryny.

Ponieważ okazało się, że strategia ta jest skuteczniejsza w przyciąganiu i utrzymywaniu uwagi odwiedzających, standardową praktyką stosowaną przez każdą osobę było osadzanie filmów na swoich stronach WordPress.

Ale faktem jest, że nie każdy robi to dobrze. Większość z nich nie wie, jak prawidłowo osadzać filmy na WordPressie, co powoduje spowolnienie szybkości ich witryny.

To nie jest sfabrykowane stwierdzenie; wolimy, aby liczby i wyniki mówiły prawdę.


WordPress z filmami: test Core Web Vital

Przejdźmy od razu do testów i wyników, bez dalszego przeciągania i przechwalania się.

Najpierw do celów testowych wzięliśmy prostą i podstawową witrynę WordPress bez żadnych filmów i grafik i przetestowaliśmy ją.

Wyniki były następujące:

image 8 The Most Efficient Method To Embed Videos On WordPress
  • Możesz zobaczyć, że wynik wyniósł 100% z zielonym sygnałem, a wszystkie wskaźniki pokazują pozytywne reakcje zarówno w przypadku urządzeń mobilnych, jak i komputerów stacjonarnych.

Ale kiedy dodaliśmy film z YouTube'a do strony głównej witryny WordPress i ponownie przeprowadziliśmy test. Wyniki były zaskakujące;

image 9 The Most Efficient Method To Embed Videos On WordPress
  • Tylko w przypadku jednego filmu wynik spadł do 65%, a wszystkie pozostałe wskaźniki pozostały takie same. Został on drastycznie obniżony o 35%, a tendencja ta może się pogorszyć po dodaniu większej liczby filmów.

Teraz możesz pomyśleć, jakie jest rozwiązanie?


Czego potrzebujesz, aby to naprawić?

Bezpośrednie podejście, o którym możesz pomyśleć, polega na tym, aby nie używać żadnych filmów w witrynie, ale nie jest to właściwe podejście. Filmy mają swoją wartość, a także poprawiają komfort korzystania ze strony internetowej. Nie można więc ich po prostu zignorować tylko po to, aby zwiększyć szybkość działania witryny.

1. Wybierz renomowaną platformę hostingu wideo

Po pierwsze, byłoby wspaniale, gdybyś hostował lub przesyłał wideo na platformie hostingowej Free Video, takiej jak YouTube, Vimeo lub Wistia, zamiast hostować go na swoim serwerze internetowym. Nie tylko pozwoli to zaoszczędzić zasoby serwera, ale także zmniejszy jego obciążenie i nie wpłynie na szybkość serwera.

Te platformy hostingu wideo są dobrze zoptymalizowane pod kątem dostarczania wideo i mogą obsłużyć przepustowość wymaganą do przesyłania strumieniowego wideo.

Uwaga : jeśli chcesz stworzyć własną witrynę z kanałami wideo za pomocą WordPress, oprócz bezpłatnych platform hostingu wideo, żadna inna prywatna platforma hostingu wideo nie może pokonać dedykowanej platformy hostingu wideo WPOven pod niemal każdym względem.

2. Osadzaj filmy z YouTube bez plików cookie

Możesz być zaskoczony, gdy dowiesz się, że oprócz standardowego osadzania na YouTube dostępna jest również specjalna wersja o nazwie youtube-nocookie.com.

Osadzanie filmów z YouTube'a w wersji standardowej niesie ze sobą wiele innych niepożądanych elementów, takich jak pliki cookie, skrypty itp., które nie są wymagane. Dlatego, aby uczynić to skuteczniejszym, YouTube wprowadził wersję youtube-nocookie.com, która jest lżejsza i nie wpływa znacząco na wynik szybkości strony.

Oto kilka interesujących faktów na temat Youtube-nocookie.com

  • To alternatywna domena do osadzania filmów z YouTube.
  • Ta domena służy do osadzania filmów bez ustawiania plików cookie do celów śledzenia.
  • Regularne osadzanie na YouTube (youtube.com) może spowodować ustawienie plików cookie w przeglądarce przeglądarki.
  • Domena „youtube-nocookie.com” służy do osadzania odtwarzacza bez ustawiania żadnych plików cookie.
  • Jest to przydatne w przypadku witryn internetowych, dla których prywatność użytkowników jest priorytetem i których celem jest minimalizacja użycia plików cookie.
  • Korzystanie z „youtube-nocookie.com” gwarantuje, że osadzone filmy nie będą przyczyniać się do niepotrzebnego śledzenia osób odwiedzających witrynę.

Wszystko, czego potrzebujesz, to po prostu zmodyfikować adres URL filmu na YouTube, zastępując „youtube.com” słowem „youtube-nocookie.com” i gotowe.

3. Użyj wtyczek LazyLoad

Leniwe ładowanie to jedna z najlepszych technik optymalizacji szybkości witryny poprzez proste odroczenie niektórych elementów witryny. Wtyczka opóźnia ładowanie elementów takich jak obrazy lub filmy, dopóki użytkownik nie przewinie do nich lub nie pojawią się one w jego widoku.

Oto jak to się dzieje:

  • Wtyczka leniwego ładowania skanuje zawartość strony internetowej podczas inicjalizacji.
  • W sposób ciągły monitoruje widoczną dla użytkownika część serwisu.
  • Gdy elementy oznaczone do leniwego ładowania mają wkrótce trafić do rzutni użytkownika, wtyczka inicjuje ich ładowanie.
  • Gdy użytkownicy wchodzą do rzutni, elementy ładują się dynamicznie, często przy użyciu JavaScript, bez konieczności ponownego ładowania całej strony.
  • Wtyczki z leniwym ładowaniem wykorzystują JavaScript do dynamicznego ładowania treści na stronę internetową w trakcie interakcji użytkownika z nią.
  • Wtyczki nadają priorytet ładowaniu na podstawie pozycji lub ważności elementu, zapewniając bezproblemową obsługę użytkownika, jednocześnie skracając początkowy czas ładowania i wykorzystanie przepustowości.

Uwaga: to podejście ma pewne ograniczenia. Wtyczka leniwego ładowania nie działa, jeśli filmy są umieszczone w pierwszej części strony, ale działa najlepiej, gdy filmy są widoczne poniżej pierwszej części strony.


Przeczytaj: 22 najlepsze sposoby na przyspieszenie wydajności WordPressa


4. Technika fasadowa

Podejście fasadowe jest jednym ze sprytnych sposobów wdrożenia techniki leniwego ładowania. W tym podejściu początkowo zamiast wideo używasz elementu zastępczego obrazu statycznego. Ten obraz zazwyczaj przypomina miniaturę filmu wideo z nakładką przycisku odtwarzania.

Gdy użytkownik kliknie nakładkę przycisku odtwarzania, pojawi się wyskakujące okienko i w tym samym wyskakującym oknie rozpocznie się ładowanie samego wideo.

Dla Twojej informacji i lepszego zrozumienia, oto przykład.

To podejście jest dość skuteczne i nie obciąża Twojej witryny WordPress filmami z YouTube, chyba że jest to wymagane.

Lazy Load by WP Rocket

Jeśli to podejście lightbox Ci nie odpowiada, skorzystaj z popularnej wtyczki WordPress o nazwie „Wtyczka LazyLoad”. Działa z oEmbed i zastępuje osadzone filmy z YouTube i Vimeo klikalnym obrazem podglądu.


Streszczenie

Podsumujmy teraz to, o czym wspomnieliśmy w powyższym poście. Bez wątpienia filmy to jeden z najlepszych i najbardziej interaktywnych sposobów dzielenia się informacjami. Jednak nikt nie chce płacić takiej ceny za spowolnienie swojej witryny.

Na szczęście istnieje kilka wskazówek i trików, o których już wspominaliśmy, a które mogą zdziałać cuda dla Twojej witryny, nie wpływając negatywnie na jej szybkość i wydajność. Postępuj zgodnie z tymi wskazówkami i zwiększ prędkość swojej witryny, aby osiągnąć wynik 100. Po prostu spróbuj i wygraj wyścig.