Esempi di landing page per app mobile: sezioni dal vivo + regole dei badge | We.Inc
Sezioni originali di landing page per app mobile da modificare dal vivo: hero con mockup del telefono, funzionalità, passaggi e banda di download, con le regole ufficiali dei badge App Store e Google Play.
Una landing page per app ha un solo compito: far installare l'app alle persone giuste. Apri con cosa fa l'app in una frase, mostrala in funzione dentro la cornice di un telefono e posiziona i badge ufficiali App Store e Google Play in alto e di nuovo alla fine. Rispetta le regole di ogni store su dimensioni e spaziatura dei badge.
Le regole dei badge degli store in sintesi (verificate a ottobre 2026)
Regola
Badge App Store
Badge Google Play
Testo
Scarica su App Store
Disponibile su Google Play
Altezza minima sullo schermo
40 px
28 px
Spazio libero intorno
Un quarto dell'altezza del badge
Un quarto dell'altezza del badge
Accanto ad altri badge
Mettilo per primo; usa il badge nero
Stessa dimensione degli altri o più grande
Modifiche consentite
Nessuna: non modificarlo, inclinarlo o animarlo
Nessuna: niente ricolorazioni o riorganizzazioni
La maggior parte delle raccolte di pagine per app sono gallerie di screenshot. Questa pagina ti dà le sezioni vere e proprie in HTML e CSS puri, costruite per app inventate, più un piccolo generatore per l'hero. Gli spazi dei badge sono segnaposto perché la grafica reale deve arrivare da Apple e Google.
Inserisci nel generatore dell'hero il nome della tua app, la promessa in una riga e il colore del brand, poi copia l'HTML.
Procedi lungo gli esempi di sezione: funzionalità, come funziona e la banda di download finale.
Scarica i badge ufficiali dalle pagine marketing di Apple e Google e inseriscili negli spazi segnaposto.
Collega ogni badge direttamente alla tua scheda in quello store.
Di' cosa fa l'app prima di dire come ci si sente. Una frase come Dividi affitto e bollette con i coinquilini batte uno slogan.
Mostra schermate reali dell'app dentro la cornice del telefono. I dati di esempio vanno bene; le funzionalità inventate no.
Le linee guida di Apple chiedono un solo badge App Store per layout e lo vogliono in posizione subordinata rispetto al messaggio principale.
Sui telefoni valuta di mostrare solo il badge della piattaforma del visitatore, dato che l'altro store non può installare sul suo dispositivo.
Aggiungi su desktop un piccolo blocco con codice QR così i visitatori possono passare al telefono in un solo passaggio.
Domande frequenti
Cosa dovrebbe includere una landing page per app mobile?
Un titolo di una frase che dica cosa fa l'app, un mockup del telefono con una schermata reale, tre o quattro funzionalità scritte come risultati, una breve striscia sul funzionamento, i badge ufficiali degli store e un link all'informativa sulla privacy. Una banda di download finale ripete i badge.
Posso creare un mio pulsante App Store o Google Play?
No. Entrambe le aziende richiedono la grafica ufficiale dei badge, senza modifiche. La pagina di Apple dice di non modificare, inclinare o animare il badge, e quella di Google di non alterare i colori né riorganizzare gli elementi. Scarica i file dalle loro risorse marketing.
Quanto devono essere grandi i badge degli store?
Apple fissa un'altezza minima sullo schermo di 40 pixel per il badge App Store, e Google di 28 pixel per il badge Google Play. Quando compaiono insieme, Google chiede che il suo badge sia della stessa dimensione degli altri o più grande.
Mi serve un sito se la mia app è negli store?
Una pagina sul tuo dominio è il posto a cui puoi collegare annunci, email e post social, dove ospitare l'informativa sulla privacy e posizionarti nella ricerca web per ciò che fa l'app. Le schede negli store da sole non possono fare tutto questo.
Una struttura che funziona per la maggior parte delle app
In alto: titolo, una riga di supporto, badge e mockup del telefono. Al centro: funzionalità come risultati, poi una striscia in tre passaggi su come funziona. In fondo: i badge ripetuti con un breve motivo per installare oggi.
Mantieni la pagina breve. Un visitatore che ha deciso vuole il badge, non altro scroll.
Badge e posizionamento
Entrambi gli store chiedono uno spazio libero di un quarto dell'altezza del badge intorno alla grafica. Apple preferisce il badge nero quando compaiono insieme più badge di store e chiede che il suo venga per primo.
Usa un testo alternativo che corrisponda al testo del badge, come Scarica su App Store, così gli utenti di screen reader sentono dove porta il link.
Sezioni di landing page per app da copiare
Hero con mockup del telefono e spazi per i badge
Una cornice di telefono solo in CSS accanto al titolo. Sugli schermi stretti il telefono scende sotto il testo.
Funzionalità scritte come risultati
Ogni scheda inizia con ciò che la persona ottiene, non con il nome della funzionalità.
Come funziona in tre passaggi
I passaggi numerati fanno sembrare breve l'onboarding. Usa una lista ordinata così l'ordine viene annunciato.
Banda di download finale con spazio per il QR
Ripete i badge alla fine. Lo spazio per il QR è per i visitatori da desktop che vogliono passare al telefono.
Striscia scorrevole di schermate dell'app
Una striscia orizzontale che scorre dentro il proprio riquadro, così la pagina non scorre mai di lato.
Checklist per la landing page dell'app
Prima di pubblicare
Elemento
Dettaglio
Il titolo dice cosa fa l'app
Una frase semplice
Schermate reali nel mockup
Nessuna funzionalità che l'app non ha
Badge ufficiali, senza modifiche
Scaricati da Apple e Google
Ogni badge porta alla sua scheda nello store
Non a una homepage generica dello store
Il testo alternativo del badge corrisponde al suo testo
Per gli utenti di screen reader
Informativa sulla privacy collegata nel footer
Facile da trovare per visitatori e revisori
Badge ripetuti alla fine
Per chi legge fino in fondo
Generatore di hero per app
Inserisci un titolo, una riga di supporto e un colore dello schermo per costruire una sezione hero con una cornice di telefono in CSS e due spazi per i badge, poi copia l'HTML.
Titolo
Riga di supporto
Colore dello schermo
Pianifica la settimana in cinque minuti
Weekbird trasforma la tua lista di cose da fare in un programma sereno e realistico.
Il tuo hero per app
Copialo, poi sostituisci gli spazi tratteggiati con la grafica ufficiale dei badge.