Wszystkie poradniki

15 października 2026 · 5 min czytania

Jak użyć wideo w nagłówku strony, nie spowalniając jej

Praktyczny poradnik: kompresja MP4/WebM, obrazy poster, leniwe ładowanie i unikanie ciężkich iframe'ów.

Dlaczego wideo w nagłówku często spowalnia stronę

Pełnoekranowe wideo to zwykle najcięższy plik na stronie. Osadzone odtwarzacze (iframe YouTube, Vimeo) dokładają kolejne skrypty, zanim cokolwiek się odtworzy.

To opóźnia Largest Contentful Paint i może kosztować pozycje w Google oraz użytkowników mobilnych.

Używaj natywnego tagu video z obrazem poster

Zamiast iframe'a serwuj krótki, wyciszony, zapętlony klip w natywnym elemencie <video>. Dodaj lekki obraz poster, by od razu pokazać treść.

Dodaj źródła WebM (VP9/AV1) i MP4 (H.264) - przeglądarka wybierze obsługiwany format.

Kompresuj i ładuj leniwie

Celuj w 1–3 MB na klip: 720p–1080p, 6–12 sekund, bez ścieżki audio.

Dla filmów niżej na stronie użyj preload="none" i dodawaj źródła dopiero, gdy wideo zbliża się do ekranu.