Visuale · Online · Gratuito
Editor Email HTML Online
Modifica l'email vedendo subito il risultato, e consulta il codice quando ti serve. La tela, l'anteprima mobile e l'HTML in uscita sono a un clic di distanza, nel browser, senza nulla da installare.
Modifica sulla tela, controlla il codice a parte
L'editor lavora su un unico documento con due modalità. In modalità modifica hai la tela: clicchi su un blocco e le sue opzioni compaiono a lato, nel pannello di ispezione. In modalità anteprima l'interfaccia di modifica scompare del tutto e resta solo l'email, come arriverebbe davvero, in larghezza desktop o mobile.
Da lì, le schede di output mostrano cosa viene effettivamente generato: l'HTML e il JSON che descrive il documento. È un editor visuale che non nasconde il codice, e questo conta quando chi deve inviare o controllare l'email non è la stessa persona che l'ha disegnata.
Cosa puoi metterci sulla tela
La palette dei blocchi è volutamente corta: copre quello che serve davvero in un'email e niente che finirebbe per apparire diverso da un client di posta all'altro.
- Testo ricco, con titoli 1-3, grassetto, corsivo, sottolineato e barrato, elenchi, allineamento, colore del testo e dello sfondo, link, emoji e inserimento di variabili di merge.
- Immagini, con destinazione del link e larghezza proprie.
- Bottoni, con forma, colore e testo propri.
- Contenitori e righe multi-colonna, per affiancare elementi.
- Divisori e spaziatori, per separare le sezioni.
- Una riga di social media per il footer.
Pensato per modificare in fretta, non per lottare col layout
Annulla e ripristina coprono tutta la cronologia del documento, quindi provare una disposizione diversa non costa nulla. Passare dalla vista desktop a quella mobile è un solo interruttore, non ridimensionare la finestra a mano.
Poiché il documento vive nel tuo browser, niente di tutto questo aspetta un giro di andata e ritorno verso un server: ogni clic si riflette all'istante sulla tela e nelle schede di output.
Niente da installare, nessun account da creare
È una pagina web. La apri e l'editor è già lì: nessuna app desktop, nessuna estensione, nessun modulo di registrazione tra te e la tela. Il lavoro resta nel browser ed esportarlo è solo copiare il risultato.
Serve però una finestra di almeno 960 pixel di larghezza: la palette, la tela e il pannello di ispezione stanno affiancati, e su uno schermo piccolo non ci stanno comodamente.
Quando guardare la tela e quando guardare il codice
La maggior parte del lavoro passa sulla tela: spostare blocchi, aggiustare gli spazi, cambiare un colore. Il codice serve nel momento in cui quell'email deve uscire dall'editor — incollarla nel template di un ESP, controllarla prima di un invio importante, o salvarla vicino al codice dell'applicazione che la scatena.
Non serve decidere in anticipo quale dei due ti servirà: dato che le schede di output sono sempre aggiornate con quello che c'è sulla tela, puoi progettare prima e consultare l'HTML solo alla fine, oppure controllarlo ogni pochi cambiamenti se preferisci verificare passo per passo.
Chi controlla l'email non deve essere necessariamente chi l'ha progettata: puoi condividere l'HTML esportato con qualcuno che deve solo verificare il codice, oppure lasciare che un'altra persona continui a modificare sulla tela partendo dal JSON, senza che nessuno dei due debba ricostruire nulla da zero.
Lo stesso passaggio tra modalità aiuta anche a individuare errori di design prima di esportare: un blocco con troppo padding o un colore di sfondo che non contrasta si nota molto di più in anteprima, senza l'interfaccia di modifica intorno, che guardando la tela mentre ci si lavora ancora sopra.
La combinazione delle due schede di output serve anche come controllo incrociato: se qualcosa appare diverso tra l'HTML e quello che ti aspettavi, il JSON dello stesso documento mostra esattamente quale valore ha ogni proprietà del blocco in questione, senza dover setacciare il markup generato riga per riga per trovare l'origine del problema.
Questa stessa abitudine di controllare prima di esportare è ciò che evita sorprese quando l'email arriva infine in una casella di posta reale.
Con la pratica, muoversi tra la tela e le schede di output smette di sembrare due compiti distinti e diventa un solo modo di lavorare: progettare e verificare insieme, invece di lasciare il controllo del codice per la fine.
Questo modo di lavorare a due livelli — visuale e testuale — è anche ciò che rende più semplice spiegare a qualcun altro cosa cambiare, perché il riferimento non è mai solo "quel blocco lì", ma anche il valore preciso nel documento sottostante.
Apri un'email già pronta e provala
Il modo più rapido per capire come si comporta l'editor è caricare un'email finita e iniziare a modificarla.
Domande frequenti su questo
Posso vedere l'HTML mentre modifico?
Sì. Le schede di output mostrano l'HTML e il JSON del documento in ogni momento, non solo alla fine; puoi controllarli in qualsiasi fase della modifica.
Posso incollare un HTML che ho già e trasformarlo in blocchi?
No. L'editor lavora con blocchi propri e non esiste un'importazione che trasformi un HTML esistente in blocchi modificabili. Quello che puoi incollare è del testo dentro un blocco di testo ricco.
Funziona sul cellulare da cui sto leggendo questo?
Non comodamente: serve una finestra di almeno 960px perché palette, tela e pannello di ispezione sono affiancati. Aprilo da un laptop o da un computer desktop.