Pagina link in bio: una landing page per il tuo profilo

Una buona pagina link in bio è una breve landing page mobile: il tuo nome, una riga su ciò che fai, da tre a cinque pulsanti in ordine d’importanza e uno sfondo coerente col feed, perché la visita sembri continua. Quasi tutti arrivano da un telefono, direttamente dal tuo profilo, con pochi secondi di attenzione. Ogni scelta qui sotto discende da questo.

Cosa serve a una pagina link in bio, in ordine

Leggi la pagina dall’alto in basso come fa un visitatore. Vuole confermare di essere nel posto giusto, vedere cosa può fare e farlo. Tutto ciò che rallenta questi tre passi può andare.

Scrivi i pulsanti come azioni. Prenota un tavolo batte Prenotazioni; Leggi il nuovo numero batte Newsletter. Gli stessi principi valgono per ogni breve testo sui social, che il copywriting per i social tratta più a fondo.

Progettare lo sfondo

Lo sfondo è gran parte di ciò che vede un visitatore, ed è dove una pagina o somiglia a te o somiglia a ogni altro template gratuito. Progettalo prima per lo schermo di un telefono. Un fotogramma verticale 1080×1920, come una story, è una misura di lavoro sensata per l’immagine, e un colore pieno dietro copre schermi più alti e desktop.

Tieni la parte più affollata e luminosa dello sfondo lontana da dove stanno i pulsanti, di solito verso l’alto o un angolo. I pulsanti hanno bisogno di una superficie calma e uniforme dietro, altrimenti le etichette cominciano a competere col colore.

Pulsanti che sembrano toccabili

Un pulsante pieno nel colore d’accento, con gli altri in una tinta più morbida del fondo, dà all’occhio un primo tocco ovvio. Verifica che ogni etichetta abbia il contrasto con il proprio riempimento, non con la pagina: il contrasto dei colori e l’accessibilità ha i rapporti.

Costruire la tua pagina link in bio

I servizi di link in bio sono rapidi, ma una pagina sul tuo dominio è facile da costruire e tiene i visitatori sul tuo sito. Questa è una versione completa e minimale: uno sfondo sfumato a tutta altezza, una colonna centrata e un pulsante principale. Sostituisci i tuoi colori e link.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Studio Nine</title>
  <meta property="og:image" content="https://example.com/og.png">
  <style>
    html { background: #0b0a1a; }
    body {
      margin: 0;
      min-height: 100vh;
      font-family: system-ui, sans-serif;
      color: #f5f3ff;
      background: linear-gradient(180deg, #2b1055 0%, #4c1d95 30%, #1e1b4b 65%, #0b0a1a 100%);
    }
    main { max-width: 26rem; margin: 0 auto; padding: 4rem 1.25rem; text-align: center; }
    img { width: 96px; height: 96px; border-radius: 50%; }
    p { opacity: 0.85; margin: 0.5rem 0 2rem; }
    a {
      display: block;
      padding: 1rem;
      margin: 0 0 0.75rem;
      border-radius: 14px;
      background: rgba(255, 255, 255, 0.12);
      color: inherit;
      text-decoration: none;
      font-weight: 600;
    }
    a.main { background: #fbbf24; color: #1c1917; }
  </style>
</head>
<body>
  <main>
    <img src="logo.png" alt="Studio Nine">
    <h1>Studio Nine</h1>
    <p>Handmade ceramics and weekend classes in Bristol.</p>
    <a class="main" href="/classes">Book a class</a>
    <a href="/shop">Shop the new pots</a>
    <a href="/visit">Visit the studio</a>
  </main>
</body>
</html>

Se preferisci un pulsante più ricco, il CSS dei pulsanti sfumati mostra come dare al principale un po’ di profondità senza farlo gridare.

Far corrispondere la pagina al feed

Il passaggio dal profilo alla pagina deve sembrare aprire una porta nello stesso edificio. Usa i colori, i caratteri e lo sfondo che usi nei post e il visitatore non si chiede mai se è uscito. La coerenza del brand sui social tratta il sistema più ampio.

Qui uno sfondo di tua proprietà ripaga. Un Mark di Gradiently è un gradiente vivo che si renderizza a ogni misura in cui progetti, quindi post, story e sfondo della pagina possono indossare esattamente lo stesso stile, e nessun altro può esportarlo una volta che l’hai riservato. Esporta il Mark a 1080×1920 con Pro, che lo mantiene a piena misura senza filigrana, e la pagina combacia con il feed per costruzione.

L’immagine di anteprima che la gente vede quando condividi il link

Quando qualcuno invia il tuo link in un messaggio, le app mostrano una scheda di anteprima costruita con l’immagine Open Graph della pagina. Un’anteprima vuota o casuale vanifica il lavoro fatto. Progettane una a 1200×630 con il tuo nome e la promessa, usando lo stesso sfondo. I dettagli sono nella misura dell’immagine OG.

1. 1

   Controlla a larghezza da telefono

   Apri la pagina sul tuo telefono dal tuo profilo, come fanno i visitatori, non in un browser desktop.

2. 2

   Riordina i pulsanti ogni settimana

   Porta in cima ciò che conta ora e togli ciò che è finito.

3. 3

   Prova l’anteprima

   Invia il link a te stesso in un’app di messaggi e guarda la scheda che crea.