Optymalizacja strony wizualnej landing page'a

Przykład optymalizacji grafik na stronie

Optymalizacja landing page'a nie może być kompletna bez poprawek w sferze wizualnej. Grafiki ważące po kilka megabajtów nikogo już nie dziwią, podobnie jak (niestety) landing page'e kompletnie nieprzystosowane do przeglądania na smartfonach.


To dwa grzechy główne projektowania landing page'y – skupmy się więc na wyczyszczeniu landing page'y z elementów, które czynią je ociężałymi. Sprawmy, by były lekkie i wczytywały się w mgnieniu oka!

Zacznijmy od optymalizacji grafik

Zbyt duże pliki graficzne potrafią znacząco obniżyć prędkość wczytywania stron. W narzędziu PageSpeed Insights (lub innym, którego używasz do mierzenia szybkości ładowania strony) odnajdź sekcję "Largest Contentful Paint" lub podobną – ten wskaźnik mówi Ci, jak długo ładuje się największy element na landing page'u. Zwykle jest nim właśnie grafika lub wideo. Widziałem już przypadki, w których zajmowało to nawet 20 sekund!

Wyobraź sobie, że ten wielki obrazek jest główną grafiką na stronie. Zamiast więc przeglądać stronę tuż po kliknięciu, odwiedzający zostaną przywitani samym tekstem przez dobre kilkanaście sekund, zanim obrazki wreszcie się wczytają. O ile nie chcesz stracić wszystkich odwiedzających (użytkownicy zwykle nie czekają dłużej niż 5-7 sekund), musisz koniecznie popracować nad tym elementem.

Zoptymalizowane zdjęcia na stronie internetowej

Kompresja obrazków

Optymalizacja grafik bardzo często sprowadza się do kompresji. Znajdź narzędzie do kompresji plików graficznych online lub wykorzystaj Adobe Photoshop bądź CorelDRAW, jeżeli masz do nich dostęp. Kompresja znacząco zmniejszy ciężar obrazka, zachowując jego oryginalną jakość.


Możesz też zmniejszyć obrazek, w ten sposób oszczędzając nieco kilobajtów. Pamiętaj jednak, że zwykłe zmniejszenie rozmiarów doprowadzi do spadku jakości, co będzie szczególnie zauważalne, jeżeli pozwolisz użytkownikom powiększać obrazek po kliknięciu.

Sprawdź hosting klipów wideo

To zdarza się raczej rzadko, ale jeżeli masz zamiar importować filmy bezpośrednio na landing page, zdecydowanie lepiej będzie umieścić je na zewnętrznym hostingu – YouTube, Vimeo, Dailymotion czy innym. To odciąży Twój serwer i przyspieszy działanie landing page'a.

Projektowanie z uwzględnieniem urządzeń mobilnych to absolutna podstawa działania w internecie w 2021 roku. Smartfony odpowiadają za większą część ruchu w Internecie niż laptopy i komputery stacjonarne! Na szczęście większość kreatorów landing page'y pozwala stworzyć odpowiedni układ landing page'a, który można dostosować do wyświetlania na mniejszych ekranach.


W Landingi na przykład wystarczy kliknąć przycisk "Dostosuj" podczas pracy w widoku mobilnym, by zoptymalizować wygląd landing page'a pod kątem poprawnego wyświetlania na smartfonach i tabletach. Warto jednak upewnić się przed publikacją i sprawdzić, czy na pewno automatyczne rozwiązanie poukładało wszystkie elementy tak, jak sobie to wyobrażaliśmy.


Możesz też sprawić, że niektóre elementy widoczne na wersji desktopowej landing page'a, nie będą się wyświetlały na smartfonach (i vice versa) – to dobry sposób, by dodatkowo odciążyć wersję mobilną, która powinna wczytywać się jeszcze szybciej niż desktopowa.

Zwróć uwagę na responsywność

Usuń niepotrzebne elementy

Choć wielu marketerów ma dobre intencje, przy landing page'ach łatwo przedobrzyć. Pamiętaj, że Twoja strona ma przekazać informacje i doprowadzić do konwersji – zachowaj więc na landing page'u tylko te elementy, które faktycznie mogą w tym pomóc.


Jeżeli koniecznie chcesz przekazać więcej informacji, może warto stworzyć drugi landing page, który skierujesz do innych odbiorców?

Ludzie w internecie nie mają zbyt wiele czasu na przyglądanie landing page'y (pamiętaj, że czas poświęcony na scrollowanie Twojego landing page'a mógł być czasem poświęconym na scrollowanie memów, doceń to). Upewnij się więc, że wszystkie najistotniejsze informacje znajdą się na górze strony, a najlepiej na pierwszym widocznym ekranie, gdzie nie trzeba jeszcze scrollować, by dotrzeć do dalszych treści.


Co oprócz nagłówka powinno się znaleźć w sekcji otwierającej? Wartość (dlaczego odwiedzający tu są i co na tym zyskają), wezwanie do działania oraz formularz lub przycisk, który do niego prowadzi.


Podsumowując: jeżeli przyjrzysz się dokładnie, z pewnością znajdziesz na swoim landing page'u elementy, które nie są niezbędne. Usuń je: nikt za nimi nie zapłacze, a ich brak może poprawić efektywność Twojego landing page'a.


Jeżeli chcesz, aby odwiedzający uzyskali szczegółowe informacje na temat produktu (na przykład jeżeli sprzedajesz skomplikowany produkt lub usługę), zbuduj landing page, którego celem będzie nawiązanie kontaktu z odwiedzającym. Gdy zostawi swój numer, skontaktuj się z nim i poprowadź rozmowę, opowiadając mu o wszystkim, co istotne. Dzięki temu, że zdobyłeś wcześniej jego uwagę, będzie Ci znacznie wiele łatwiej.

Wady krótkich landing page'y? Brak!

Podziel się opinią i zdobądź darmową Checklistę!

Daj nam znać, co sądzisz o Akademii Landing Page, a my w zamian wyślemy Ci użyteczną checklistę.

Dzięki niej szybko sprawdzisz, czy Twój landing page jest gotowy do działania!

POBIERZ
ZA DARMO

Podsumowanie

1. Zoptymalizuj wszystkie grafiki na landing page'u...

2. ...ale przedtem upewnij się, że naprawdę potrzebujesz ich wszystkich...

3. ...i usuń te, które nie przeszły testu.

4. Zastosuj powyższą zasadę do wszystykich elementów landing page'a.

5. Skróć landing page tak, by jego przejrzenie lub przeczytanie nie zajmowało zbyt wiele czasu.

Stwórz efektywne treści na landing page!

Następna lekcja

Akademia Landing Page

Więcej lekcji

Co dalej?

W lekcji piątej opowiemy o optymalizacji treści. Słowa mają moc, ale nie wtedy, gdy jest ich za dużo i stają się nic nieznaczącą papką. Stworzymy razem proste, zrozumiałe i angażujące teksty na landing page!