Creare layout con colonne e righe

Ogni firma email è composta da due semplici elementi costitutivi: righe e colonne. Una volta capito come funzionano insieme, puoi creare layout curati e professionali in pochi minuti. Nessuna esperienza di design richiesta.

​

Immaginala come una tabella

Immagina una semplice tabella, come un foglio di calcolo. Una riga scorre orizzontalmente lungo la firma. Una colonna divide quella riga in sezioni verticali, affiancate l’una all’altra. Combinando righe e colonne, crei una griglia. Quella griglia è lo scheletro della tua firma. Tutto ciò che vedi in una firma email ben progettata (la foto accanto al nome, le icone social allineate in fila, un banner che si estende in basso) è costruito su questa griglia.

​

Come funzionano le righe

Una riga è un contenitore orizzontale che si estende per tutta la larghezza della firma. Ogni riga si sovrappone alla successiva, dall’alto verso il basso. Pensa alle righe come ai piani di un edificio: il primo piano sta in basso e ogni nuovo piano si aggiunge sopra. Nell’editor di Scribe, puoi aggiungere una nuova riga cliccando il pulsante Aggiungi riga. Ogni riga aggiunta crea una nuova sezione orizzontale nella firma. Usi comuni delle righe: Una firma tipica ha due o tre righe. La prima riga di solito contiene le informazioni principali (foto, nome, qualifica). La seconda riga può contenere un divisore o i dati di contatto. Una terza riga può mostrare un banner della campagna o un’avvertenza legale.

​

Come funzionano le colonne

Una colonna è una divisione verticale all’interno di una riga. Quando aggiungi colonne a una riga, la dividi in sezioni affiancate. È così che puoi mettere la tua foto a sinistra e il tuo nome e titolo a destra, per esempio. Nell’editor, seleziona una riga e clicca su Aggiungi colonna per dividerla. Puoi aggiungere fino a quattro colonne in una singola riga. Ogni colonna è un contenitore a sé in cui puoi inserire blocchi di contenuto come testo, immagini, icone o Smartfields. Usi comuni delle colonne: Il layout più diffuso usa due colonne nella prima riga: una colonna stretta per la foto profilo e una più larga per nome, ruolo, azienda e contatti. È la classica firma “foto a sinistra, dettagli a destra” che vedi nella maggior parte delle email professionali.

​

Costruire il primo layout

Ecco una guida passo passo per creare un layout di firma a due colonne.

​

Schemi di layout che funzionano

Non serve reinventare la ruota. Ecco tre schemi di layout che coprono la maggior parte delle firme email professionali.

​

Schema 1: due colonne con banner a tutta larghezza

È il layout più diffuso. La prima riga ha due colonne (foto a sinistra, informazioni di contatto a destra). La seconda riga occupa tutta la larghezza e mostra un banner di campagna o una call to action. Funziona bene per i team che gestiscono campagne in firma, perché il banner ottiene la massima visibilità sotto il blocco dei contatti.

​

Schema 2: tre colonne

La prima riga usa tre colonne: foto profilo a sinistra, dettagli di contatto al centro e logo aziendale a destra. Questo schema è adatto alle aziende che vogliono una forte presenza del marchio insieme alle informazioni di contatto individuali. Mantieni la colonna centrale come la più larga, così il testo ha spazio per respirare.

​

Schema 3: righe impilate, colonna singola

Ogni riga usa una sola colonna e i contenuti si impilano in verticale. Nome e titolo nella prima riga. Informazioni di contatto nella seconda. Banner nella terza. Si ottiene un aspetto pulito e minimale che funziona particolarmente bene sui dispositivi mobili, dove lo spazio orizzontale è limitato.

​

Consigli per layout migliori

Limita le colonne a due o tre. Quattro colonne possono funzionare, ma più colonne aggiungi, più tutto appare compresso sugli schermi piccoli. Due colonne sono il punto ideale per la maggior parte delle firme. Usa una riga per ogni “sezione” della firma. Se la firma ha un blocco contatti, una barra di link social e un banner promozionale, ognuno merita la propria riga. In questo modo tutto resta ordinato e le modifiche future diventano più semplici. Rendi una colonna più larga dell’altra. Quando usi due colonne, dai più spazio alla colonna del testo che a quella dell’immagine. Una proporzione 30/70 o 25/75 di solito è la scelta migliore. Nell’editor, trascina il divisore tra le colonne per regolare il rapporto. Visualizza l’anteprima su mobile. I client email su smartphone mostrano le firme in modo diverso rispetto ai client desktop. Usa la funzione di anteprima di Scribe per verificare che colonne e righe restino ben leggibili anche su schermi più piccoli. Parti semplice e itera. Inizia con due colonne in una riga. Quando il risultato ti convince, aggiungi una seconda riga per contenuti extra. Puoi sempre aumentare la complessità in seguito, ma partire con troppe righe e colonne rende più difficile ottenere un buon risultato.

​

Cosa va dove

Se hai dubbi su quale contenuto vada in quale parte della griglia, ecco un riferimento rapido: Prima riga (due colonne): foto profilo o logo aziendale nella colonna stretta. Nome completo, ruolo, azienda, telefono, email e sito web nella colonna più larga. Seconda riga (a tutta larghezza o due colonne): icone social, link per prenotare una riunione o una riga secondaria di contatti. Terza riga (a tutta larghezza): un banner di campagna, una nota legale o un claim aziendale.

​

Passi successivi

Una volta definito il layout, puoi rifinire ogni dettaglio nell’editor. Regola font, colori, spaziature e stili delle icone per allinearli al tuo brand. Se gestisci le firme di un team, esplora Collaboratori per distribuire lo stesso layout a tutti mantenendo unici i contatti di ciascuno tramite gli Smartfield.