Landing page aplikacji mobilnej: przykłady i szablon
Landing page aplikacji mobilnej: przykłady
Landing page aplikacji mobilnej: sekcje na żywo i zasady plakietek | We.Inc
Oryginalne sekcje landing page aplikacji mobilnej, które edytujesz na żywo: hero z makietą telefonu, funkcje, kroki i pasek pobierania, wraz z oficjalnymi zasadami plakietek App Store i Google Play.
Landing page aplikacji ma jedno zadanie: skłonić właściwe osoby do instalacji. Zacznij od jednego zdania o tym, co robi aplikacja, pokaż ją działającą w ramce telefonu i umieść oficjalne plakietki App Store i Google Play blisko góry oraz ponownie na końcu. Przestrzegaj zasad każdego sklepu dotyczących rozmiaru i odstępów plakietek.
Zasady plakietek sklepów w skrócie (sprawdzono w październiku 2026)
Zasada
Plakietka App Store
Plakietka Google Play
Tekst
Pobierz z App Store
Pobierz z Google Play
Minimalna wysokość na ekranie
40 px
28 px
Wolna przestrzeń wokół
Jedna czwarta wysokości plakietki
Jedna czwarta wysokości plakietki
Obok innych plakietek
Umieść ją jako pierwszą, użyj czarnej plakietki
Taki sam rozmiar jak pozostałe lub większy
Dozwolone zmiany
Żadne: nie modyfikuj, nie obracaj, nie animuj
Żadne: bez zmiany kolorów i przestawiania elementów
Większość zestawień stron aplikacji to galerie zrzutów ekranu. Ta strona daje Ci same sekcje w czystym HTML i CSS, zbudowane dla wymyślonych aplikacji, plus mały generator sekcji hero. Miejsca na plakietki to symbole zastępcze, bo prawdziwe grafiki muszą pochodzić od Apple i Google.
Wpisz nazwę aplikacji, jednozdaniową obietnicę i kolor marki w generatorze hero i skopiuj HTML.
Przejdź kolejno przez przykładowe sekcje: funkcje, jak to działa i końcowy pasek pobierania.
Pobierz oficjalne plakietki ze stron marketingowych Apple i Google i wstaw je w miejsca zastępcze.
Podlinkuj każdą plakietkę bezpośrednio do swojej strony w danym sklepie.
Powiedz, co robi aplikacja, zanim powiesz, jakie daje odczucia. Zdanie typu Dziel czynsz i rachunki ze współlokatorami wygrywa ze sloganem.
Pokaż w ramce telefonu prawdziwe ekrany aplikacji. Przykładowe dane są w porządku, wymyślone funkcje nie.
Wytyczne Apple wymagają tylko jednej plakietki App Store na układ i chcą, by była podrzędna wobec głównego przekazu.
Na telefonach rozważ pokazywanie tylko plakietki platformy odwiedzającego, bo z drugiego sklepu i tak nie zainstaluje aplikacji na swoim urządzeniu.
Dodaj na komputerach mały blok z kodem QR, aby odwiedzający mogli przejść na telefon jednym krokiem.
Najczęściej zadawane pytania
Co powinien zawierać landing page aplikacji mobilnej?
Jednozdaniowy nagłówek mówiący, co robi aplikacja, makietę telefonu z prawdziwym ekranem, trzy lub cztery funkcje opisane jako korzyści, krótki pasek „jak to działa”, oficjalne plakietki sklepów i link do polityki prywatności. Końcowy pasek pobierania powtarza plakietki.
Czy mogę zrobić własny przycisk App Store lub Google Play?
Nie. Obie firmy wymagają swoich oficjalnych grafik plakietek, bez zmian. Strona Apple mówi, by nie modyfikować, nie obracać i nie animować plakietki, a strona Google, by nie zmieniać kolorów ani nie przestawiać elementów. Pobierz pliki z ich materiałów marketingowych.
Jak duże powinny być plakietki sklepów?
Apple ustala minimalną wysokość na ekranie 40 pikseli dla plakietki App Store, a Google 28 pikseli dla plakietki Google Play. Gdy obie występują razem, Google prosi, aby jego plakietka miała taki sam rozmiar jak pozostałe lub większy.
Czy potrzebuję strony, jeśli moja aplikacja jest w sklepach?
Strona we własnej domenie to miejsce, do którego możesz linkować z reklam, e-maili i postów w mediach społecznościowych, na którym umieścisz politykę prywatności i które może pozycjonować się w wyszukiwarce na to, co robi aplikacja. Same strony w sklepach nie zrobią tego wszystkiego.
Struktura, która sprawdza się w większości aplikacji
Góra: nagłówek, jedna linia wspierająca, plakietki i makieta telefonu. Środek: funkcje jako korzyści, potem pasek „jak to działa” w trzech krokach. Dół: powtórzenie plakietek z krótkim powodem, by zainstalować dziś.
Strona ma być krótka. Odwiedzający, który już się zdecydował, chce plakietki, a nie dalszego przewijania.
Plakietki i ich umieszczenie
Oba sklepy wymagają wolnej przestrzeni wokół grafiki równej jednej czwartej wysokości plakietki. Apple woli czarną plakietkę, gdy razem pojawia się kilka plakietek sklepów, i prosi, aby jego plakietka była pierwsza.
Używaj tekstu alternatywnego zgodnego z tekstem plakietki, np. Pobierz z App Store, aby użytkownicy czytników ekranu słyszeli, dokąd prowadzi link.
Sekcje landing page aplikacji do skopiowania
Hero z makietą telefonu i miejscami na plakietki
Ramka telefonu w samym CSS obok nagłówka. Na wąskich ekranach telefon przesuwa się pod tekst.
Funkcje opisane jako korzyści
Każda karta zaczyna się od tego, co dostaje użytkownik, a nie od nazwy funkcji.
Jak to działa w trzech krokach
Ponumerowane kroki sprawiają, że onboarding wydaje się krótki. Użyj listy numerowanej, aby kolejność była odczytywana.
Końcowy pasek pobierania z miejscem na QR
Powtarza plakietki na końcu. Miejsce na QR jest dla odwiedzających na komputerach, którzy chcą przejść na telefon.
Przewijany pasek ekranów aplikacji
Poziomy pasek przewijany we własnym polu, dzięki czemu sama strona nigdy nie przewija się na boki.
Checklista landing page aplikacji
Przed publikacją
Element
Szczegóły
Nagłówek mówi, co robi aplikacja
Jedno proste zdanie
Prawdziwe ekrany w makiecie
Żadnych funkcji, których aplikacja nie ma
Oficjalne plakietki, bez zmian
Pobrane od Apple i Google
Każda plakietka linkuje do strony w swoim sklepie
Nie do ogólnej strony głównej sklepu
Tekst alternatywny plakietki zgodny z jej tekstem
Dla użytkowników czytników ekranu
Polityka prywatności podlinkowana w stopce
Łatwa do znalezienia dla odwiedzających i recenzentów
Plakietki powtórzone na końcu
Dla osób, które czytają do samego dołu
Generator sekcji hero aplikacji
Wpisz nagłówek, linię wspierającą i kolor ekranu, aby zbudować sekcję hero z ramką telefonu w CSS i dwoma miejscami na plakietki, a potem skopiuj HTML.
Nagłówek
Linia wspierająca
Kolor ekranu
Zaplanuj tydzień w pięć minut
Weekbird zamienia Twoją listę zadań w spokojny, realny plan.
Twoja sekcja hero aplikacji
Skopiuj to, a potem zastąp przerywane miejsca oficjalnymi grafikami plakietek.