Pierwszy ekran strony – co klient powinien zobaczyć, zanim przewinie

Pierwszy ekran to fragment strony widoczny od razu po jej otwarciu, zanim ktokolwiek przewinie w dół. Na telefonie mieści się w nim zwykle nagłówek, jedno–dwa zdania, przycisk i kawałek zdjęcia. Niewiele, ale wystarczająco, jeśli każdy z tych elementów wykonuje swoją pracę.

Osoba, która trafia na Twoją stronę z wyszukiwarki, w ciągu kilku chwil decyduje, czy jest we właściwym miejscu. Nie czyta jeszcze opisu usług ani historii firmy. Szuka potwierdzenia, że tu dostanie to, czego potrzebuje.

Trzy odpowiedzi, które musi dać pierwszy ekran

Dobry pierwszy ekran odpowiada na trzy pytania odwiedzającego:

1. Co to za miejsce? Jaka usługa, jaki specjalista, jaka firma.
2. Czy to dla mnie? Gdzie działasz, dla kogo pracujesz, czym się zajmujesz w szczególności.
3. Co mam teraz zrobić? Zadzwonić, umówić wizytę, poprosić o wycenę.

Jeśli którejś odpowiedzi brakuje, klient musi jej szukać. Część osób to zrobi, część wróci do wyników wyszukiwania i kliknie kolejną firmę.

Dla porównania: pierwszy ekran, na którym jest tylko logo i hasło „Zadbamy o Ciebie”, nie odpowiada na żadne z tych pytań. Ekran z nagłówkiem „Gabinet podologiczny w Gnieźnie”, zdaniem o tym, jak się zapisać, i przyciskiem „Umów wizytę” odpowiada na wszystkie trzy.

Tekst: nagłówek i podtytuł

Nagłówek: nazwij usługę i miejsce

Najczęstszy błąd to nagłówek, który brzmi ładnie, ale nic nie mówi. Hasła o pasji, profesjonalizmie i zdrowiu pasują do każdej firmy, więc nie wyróżniają żadnej. Porównaj:

• Przed: „Witamy na naszej stronie” – po: „Fizjoterapia ortopedyczna i pourazowa w Lesznie”.
• Przed: „Profesjonalizm, pasja, doświadczenie” – po: „Remonty łazienek pod klucz w Poznaniu i okolicach”.
• Przed: „Twój uśmiech jest dla nas najważniejszy” – po: „Gabinet stomatologiczny w Kaliszu – leczenie, protetyka, higienizacja”.
• Przed: „Uchwycimy Twoje chwile” – po: „Fotografia ślubna i reportaż rodzinny – Wielkopolska”.

Wersje „po” mogą wydawać się zwyczajne. Właśnie o to chodzi: klient od razu wie, gdzie jest. Więcej o tym, jak pisać nagłówki, które prowadzą czytelnika dalej, znajdziesz we wpisie o nagłówkach na stronie.

Podtytuł: jeden konkret, który odróżnia Cię od innych

Pod nagłówkiem jest miejsce na jedno lub dwa zdania. Nie powtarzaj w nich nagłówka innymi słowami. Dodaj informację, która pomaga podjąć decyzję. Przykłady:

• „Pierwsza wizyta trwa godzinę: wywiad, badanie i plan terapii. Przyjmuję też w soboty.”
• „Wycenę przygotowujemy po bezpłatnych oględzinach. Jedna ekipa od skucia płytek po biały montaż.”
• „Leczymy dorosłych i dzieci od 3. roku życia. Rejestracja telefoniczna od poniedziałku do piątku.”

Dobry podtytuł opisuje fakt, który da się sprawdzić. „Indywidualne podejście” nim nie jest. „Plan terapii na piśmie po pierwszej wizycie” – już tak.

Przycisk i telefon: jedno główne działanie

Na pierwszym ekranie powinien być wyraźny przycisk prowadzący do najważniejszego działania. Dla gabinetu może to być „Umów wizytę”, dla elektryka „Zadzwoń”, dla architekta wnętrz „Zapytaj o termin konsultacji”. Obok można dodać drugi, mniej wyróżniony przycisk, np. „Zobacz cennik”, ale nie więcej.

Kiedy klient często dzwoni, numer telefonu powinien być widoczny jako tekst i klikalny na telefonie. Szczegółowo o rozmieszczeniu przycisków piszemy w tekście o przyciskach „Zadzwoń” i „Umów wizytę”.

Zdjęcie: prawdziwe i niezasłaniające tekstu

Zdjęcie na pierwszym ekranie buduje nastrój, ale też niesie informację. Twarz specjalisty, wnętrze gabinetu, efekt pracy ekipy – to wszystko mówi więcej niż stockowa fotografia uśmiechniętej modelki. Klient, który zobaczy Cię na stronie, rozpozna Cię potem w drzwiach gabinetu.

Kilka zasad technicznych:

• Tekst nałożony na zdjęcie musi być czytelny – zwykle wymaga przyciemnienia zdjęcia albo jednolitego tła pod napisem.
• Na telefonie zdjęcie nie powinno zajmować całego ekranu, spychając nagłówek i przycisk poniżej krawędzi.
• Zdjęcie musi być dobrze skompresowane, bo to ono najczęściej spowalnia wczytywanie pierwszego ekranu.

Osobna uwaga o sliderach, czyli przewijających się automatycznie zdjęciach z hasłami. Kolejne slajdy pojawiają się wtedy, gdy klient już przewija stronę albo czyta coś innego, więc łatwo je przeoczyć. Jedno dobre zdjęcie i jeden nagłówek działają pewniej.

Przykład: pierwszy ekran gabinetu fizjoterapii na telefonie

Tak może wyglądać kolejność elementów od góry do dołu na ekranie smartfona:

1. Pasek z logo, ikoną menu i małą ikoną słuchawki.
2. Nagłówek: „Fizjoterapia ortopedyczna i pourazowa w Lesznie”.
3. Podtytuł: „Pierwsza wizyta trwa godzinę. Przyjmuję od poniedziałku do soboty.”
4. Przycisk główny „Umów wizytę” na całą szerokość ekranu.
5. Pod nim skromniejszy link „Zobacz cennik”.
6. Górna część zdjęcia fizjoterapeutki przy pracy, która zachęca do przewinięcia.

Na komputerze te same elementy zwykle układa się w dwóch kolumnach: tekst i przyciski po lewej, zdjęcie po prawej. Treść pozostaje ta sama, zmienia się tylko jej rozmieszczenie.

Czego na pierwszym ekranie nie umieszczać

• Okienek wyskakujących po sekundzie z zapisem na newsletter lub rabatem.
• Wideo w tle, które startuje z dźwiękiem albo długo się wczytuje.
• Animowanych liczników typu „1000 zadowolonych klientów”, jeśli nie masz na te liczby pokrycia.
• Długiego akapitu o historii firmy – na to jest miejsce niżej.
• Kilku przycisków w różnych kolorach, które konkurują o uwagę.

Pamiętaj też o banerze cookies. Na telefonie potrafi zasłonić połowę pierwszego ekranu. Warto sprawdzić, jak wygląda strona z widocznym banerem i jak szybko da się go zamknąć.

Test pięciu sekund

Najprostszy sposób, żeby sprawdzić pierwszy ekran, nie wymaga żadnych narzędzi. Pokaż stronę na telefonie osobie, która jej nie zna – znajomemu, członkowi rodziny – przez pięć sekund. Potem zabierz telefon i zapytaj:

1. Czym zajmuje się ta firma?
2. Gdzie działa?
3. Co możesz zrobić, jeśli chcesz skorzystać z usługi?

Test warto powtórzyć z dwiema–trzema osobami w różnym wieku. Jeśli każda opisze firmę innymi słowami, ale wszystkie trafią w sedno, pierwszy ekran działa. Jeśli odpowiedzi są niepewne albo ogólne, wymaga poprawek. Zwykle wystarczy zmienić nagłówek, skrócić podtytuł i wyraźniej pokazać przycisk. To niewielka praca, która porządkuje odbiór całej strony.