Editor HTML WYSIWYG
Un editor HTML WYSIWYG ti permette di dare forma a una pagina web guardandola, mentre il programma scrive il markup. Scopri dove l'anteprima può trarti in inganno e come si confronta Mobirise, il nostro editor gratuito a blocchi, con altri cinque strumenti.
Gratis per siti personali e commerciali.
per l'app e per la sua esportazione HTML
L'app desktop di Mobirise esporta il tuo sito come file statici con ogni piano. Aprire il codice dentro l'editor richiede un piano a pagamento.
Gli editor HTML WYSIWYG in sintesi
Dati sugli editor raccolti dal team di Mobirise, ottobre 2026.
WYSIWYG sta per «what you see is what you get», cioè «ciò che vedi è ciò che ottieni». Con un editor di questo tipo lavori sulla pagina così come appare, non sul suo sorgente: clicchi su un titolo e scrivi, inserisci un'immagine o cambi un colore, e il programma scrive l'HTML e il CSS che stanno dietro a ogni azione. In questo modo si può progettare una pagina web in HTML senza digitare i tag, anche se lo schermo mostra un'anteprima fedele, non una garanzia.
Editor classici con vista di progettazione, costruttori a blocchi, designer CSS visuali ed editor di codice con anteprima dal vivo.
L'editor visuale e la sua esportazione HTML non costano nulla su Windows, Mac o Linux, e ti danno subito 200+ blocchi. Nel piano gratuito, le pagine pubblicate mostrano il branding Mobirise.
Normali pagine .html con lo stile di Bootstrap 5, accompagnate dai suoi script. Le può servire qualsiasi host che distribuisca file semplici; sul server non gira alcun codice.
Per leggere o modificare il markup serve l'estensione Code Editor, inclusa nei piani KIT, BASE e GROW e valida per singolo blocco o per l'intera pagina.
Mobirise non può caricare un sito o un template creato altrove. Pinegrow, Dreamweaver, Bootstrap Studio e CoffeeCup invece sì.
I blocchi si adattano a telefono, tablet e desktop, e puoi vedere l'anteprima di ogni larghezza. Non esiste un layout separato per il telefono.
Quale editor HTML visuale fa per il tuo lavoro
Non esiste un unico editor HTML WYSIWYG migliore in assoluto, quindi scegli in base al lavoro da fare. Per alcuni di questi compiti la risposta migliore è un concorrente, e la sua scheda lo dice.
Mobirise
Vedi il risultato finale mentre trascini i blocchi al loro posto, riscrivi i testi e regoli i parametri dei blocchi; l'app gratuita poi scrive un sito statico in Bootstrap 5. Il limite: l'HTML creato altrove non si carica, e vedere il codice richiede un piano.
Pinegrow Web Editor
Carica qualsiasi file .html esistente e mette una vista visuale dal vivo accanto al suo markup; è supportato anche Tailwind CSS. Il limite: 18 $ al mese, 149 $ all'anno o 199 $ una tantum.
Bootstrap Studio
Componenti Bootstrap in drag and drop, un editor di codice integrato e progetti offline, per 29 $ o 59 $ una tantum. Il limite: resti dentro il modello a componenti di Bootstrap.
Adobe Dreamweaver
Live View ti permette di cliccare dentro la pagina renderizzata e di cambiarne testi, immagini e classi, con il sorgente sempre al comando. Il limite: un abbonamento, 22,99 $ al mese con il piano per una sola app, e nessuna versione per Linux.
CoffeeCup HTML Editor
Un'anteprima divisa ridisegna la pagina mentre scrivi; esiste un'edizione gratuita, e la versione completa costa 29 $ una tantum. Il limite: solo Windows, e ogni tag lo scrivi tu.
Webflow
Un designer visuale basato sul CSS, con ogni breakpoint impostato a mano; per esportare il codice serve un piano a pagamento. Il limite: i pannelli rispecchiano il CSS, quindi premia chi lo conosce già.
8B AI
Scrivi una frase e ottieni il design completo di un sito; il livello gratuito ti lascia vedere l'HTML e il CSS reali che ci stanno dietro. Il limite: vive nel browser, e per andare online, esportare tutto e modificare in chat serve il piano Pro (9 $ al mese, fatturato annualmente).
Elementor
Un plugin page builder per siti WordPress. Il limite: non ottieni una cartella di HTML autonoma, perché le pagine hanno bisogno di WordPress in esecuzione sul tuo server.
Una precisazione: Mobirise è nostro, quindi considera questo elenco scritto da una parte interessata. I dettagli su ogni concorrente provengono dalle pagine di prodotto e di prezzi del suo produttore, e dove un concorrente svolge meglio un compito, lo diciamo.
Sei strumenti visuali per l'HTML a confronto
Righe scelte per chi tiene all'HTML in sé: cosa modifichi sullo schermo, quanto è aperto il codice e se i file esterni si caricano.
| Caratteristica | Mobirise | Pinegrow Web Editor | Adobe Dreamweaver | 8B AI | Bootstrap Studio | CoffeeCup HTML Editor |
|---|---|---|---|---|---|---|
| Cosa modifichi sullo schermo | La pagina stessa: blocchi trascinati, testo scritto direttamente, impostazioni per blocco | La pagina renderizzata accanto ai suoi file sorgente | Soprattutto codice; Live View permette modifiche sulla pagina renderizzata | Un design generato, rielaborato con la chat AI nel piano Pro | Componenti Bootstrap trascinati su una canvas, con un pannello del codice | Codice, con anteprima dal vivo a schermo diviso |
| Scrivere il proprio codice | Con l'estensione Code Editor (KIT, BASE, GROW), per un blocco o una pagina | Sì, con sincronizzazione bidirezionale con VS Code | Sì, è la modalità principale, con suggerimenti sul codice | Nessuna modifica manuale indicata; il livello gratuito mostra l'HTML e il CSS reali | Sì: HTML, SASS, JavaScript e JSON in un editor ispirato a VS Code | Sì; completa il codice e controlla il markup |
| Carica un sito .html esistente | No, solo i progetti avviati in Mobirise | Sì, qualsiasi sito esistente | Sì, anche le pagine Bootstrap esistenti | Non indicato dal produttore | Sì, trascinando in un progetto pagine, fogli di stile, script e immagini esistenti | Sì, file locali o pagine aperte direttamente su un server |
| Framework usato dall'HTML esportato | Bootstrap 5 | Tailwind CSS, Bootstrap o nessuno | Qualsiasi; include Bootstrap 5.3.8, 4.4.1 e 3.4.1 | Markup personalizzato proprio; niente Bootstrap | Bootstrap 5, 4 o 3 | Il tuo markup; template responsive gratuiti da cui partire |
| Funziona su | Windows, macOS (versione Apple Silicon o Intel), Linux basato su Debian, un browser, Android | Windows, macOS, Linux; anche un'edizione per browser | Windows e macOS | Solo browser | Windows, macOS, Linux | Solo Windows |
| Prezzo e fatturazione | 0 $ per l'editor e la sua esportazione HTML. Piani annuali: KIT a 149 $ sblocca Code Editor e i temi premium; BASE (199 $) e GROW (249 $) aggiungono anche siti ospitati e AI | 18 $ al mese, 149 $ all'anno o 199 $ una tantum; prova gratuita | Piano per una sola app a 22,99 $ al mese, con impegno annuale pagato mensilmente; prova gratuita | Progettare è gratis; Pro, necessario per pubblicare, costa 9 $ al mese fatturati annualmente | Pagamento unico: 29 $ Standard o 59 $ Lifetime | Edizione gratuita, oppure licenza perpetua a 29 $ che include un anno di aggiornamenti |
Dove «ciò che vedi» smette di essere vero
L'editor disegna la pagina una volta sola, sul tuo schermo. Ogni visitatore porta con sé un browser, un dispositivo e un insieme di font diversi.
Nella maggior parte degli editor visuali attuali la canvas è una vera pagina web disegnata da un motore del browser, quindi molto di ciò che vedi è autentico: gli stessi tag, gli stessi stili. Le differenze nascono dove la configurazione del visitatore si discosta dalla tua. Tre di queste colgono quasi tutti di sorpresa.
Font
Un visitatore vede il tuo font solo se la pagina lo carica dal web o lo include nel sito. Altrimenti il suo dispositivo ne usa un altro e i titoli vanno a capo in modo diverso. Controlla che il tema fornisca i propri font.
Dimensioni dello schermo
La canvas mostra una larghezza alla volta. Un titolo che sta su un laptop può andare a capo su più righe su un telefono, e una fila di colonne può impilarsi. Scorri l'anteprima su ogni larghezza prima di pubblicare.
Script
Slider, menu, moduli, mappe e video incorporati spesso si comportano in modo diverso dentro un editor, o restano in pausa di proposito. Lì considerali dei segnaposto, prova la pagina esportata in browser veri e invia un modulo di prova dall'host online.
Le quattro famiglie degli editor HTML WYSIWYG
Tutti mostrano la pagina mentre lavori. Cambia ciò che tocchi: la pagina, i blocchi pronti, le proprietà CSS o il codice.
Vista di progettazione classica
Una canvas simile a un documento sopra l'HTML, di solito accanto al codice; Live View di Dreamweaver ne è la forma attuale. Adatta a chi mantiene siti scritti a mano e vuole correggere un testo senza cercarlo fra i tag.
Costruttori a blocchi
Le pagine si compongono con sezioni o componenti già pronti, come in Mobirise o Bootstrap Studio, mentre il programma scrive il markup. Molti chiamano questo tipo un costruttore di pagine HTML. Giusto per chi vuole un sito senza codice; funzionano così anche molti costruttori di siti web facili per principianti.
Designer CSS visuali
Webflow, oppure Pinegrow sui tuoi file: dai stile agli elementi in pannelli che corrispondono alle proprietà CSS. Adatti a chi progetta già pensando in box, classi e breakpoint.
Editor di codice con anteprima dal vivo
CoffeeCup HTML Editor e i suoi simili, spesso elencati tra gli editor HTML WYSIWYG con anteprima: scrivi l'HTML e un riquadro accanto ridisegna la pagina. Vanno bene per chi impara l'HTML e per gli sviluppatori che scrivono ogni tag ma vogliono vederne subito l'effetto.
Stai creando una tua app e non un sito web? Allora l'editor che ti serve è un componente: una casella di testo formattato da incorporare in un modulo, in un CMS o in un help desk, perché i tuoi utenti possano formattare il testo. TinyMCE e CKEditor 5 sono i veterani completi, con piani cloud a pagamento e componenti aggiuntivi; Quill è un editor HTML WYSIWYG open source più leggero; TipTap è un toolkit headless costruito su ProseMirror, quindi la barra degli strumenti la progetti tu. Producono frammenti di HTML dentro il tuo prodotto, non pagine intere, ed è per questo che restano fuori dalla tabella qui sopra.
Cosa imposti in modo visuale in Mobirise e cosa richiede il codice
La maggior parte di una pagina si crea puntando e cliccando. L'estensione Code Editor copre ciò che i pannelli non prevedono.
Blocchi
Ogni pagina nell'editor è una colonna di sezioni già pronte. Aggiungine una nuova dal pannello laterale ed elimina quelle che non ti servono.
Parole e tag dei titoli
Scrivi direttamente sulla pagina. Ogni titolo accetta il tag H che scegli, quindi la struttura della pagina la decidi tu.
Foto
Clicca su una foto qualsiasi per sostituirla con la tua. Ridimensiona i file grandi prima di aggiungerli; i consigli qui sotto spiegano il perché.
Parametri dei blocchi
Il pannello dei parametri di ogni blocco imposta spaziatura, sfondo, parti visibili come il titolo o i pulsanti, e numero di colonne.
Font e colori
Lo Style Editor è il posto in cui scegli i caratteri e la tavolozza di colori usati dai blocchi.
Il codice, quando serve
Un attributo in più, una regola CSS personalizzata o un markup rielaborato passano dall'estensione Code Editor, inclusa in KIT, BASE e GROW.
Un limite da conoscere: l'HTML che imposti è lo stesso HTML che riceve ogni dispositivo. Mobirise non offre un layout solo per il telefono, e nessun elemento può essere nascosto a una sola dimensione dello schermo.
I file che ottieni da un'esportazione
Esportare dall'app desktop non costa nulla con nessun piano. Costruisci invece nel browser? Lì, scaricare il codice richiede BASE o GROW.
Pagine e immagini
Un file HTML per ogni pagina, con normali titoli, paragrafi e link, più le tue foto e la grafica del tema dentro la cartella esportata.
Stili e script
Il CSS e il JavaScript di Bootstrap 5, gli stili propri del tema, le scelte fatte nei pannelli e gli script dietro menu e slider.
Niente sul server
Niente PHP, niente database, niente pannello di amministrazione, quindi il sito funziona su qualsiasi hosting web ordinario o su GitHub Pages.
L'esportazione funziona in un solo senso. Mobirise costruisce a partire dal proprio progetto, non dall'HTML, quindi le modifiche fatte ai file esportati con un altro editor restano fuori. Fai le modifiche al codice nel Code Editor, oppure considera quelle a mano come l'ultimo passaggio.
Come tenere pulito e veloce l'HTML creato in modo visuale
Gli strumenti visuali aggiungono un po' di peso per natura. Queste abitudini lo contengono, in Mobirise o in qualsiasi altro editor.
Struttura con i titoli, non con le dimensioni
Dai a ogni pagina un solo H1, annida sotto di esso gli H2 e gli H3, e scegli ogni tag in base al suo livello nella struttura. Quanto appare grande è compito dello stile.
Riduci prima le foto
Ridimensiona ogni immagine alla larghezza massima a cui comparirà e salvala in WebP o in un JPEG ben compresso. L'originale di una fotocamera può pesare più del resto della pagina.
Dai lo stile in un posto solo
Cambiare lo stile dei pulsanti uno per uno lascia una scia di regole usate una volta sola. Imposta font e colori in modo centralizzato, nello Style Editor o nell'equivalente del tuo strumento, e il CSS resta breve.
Prova fuori dall'editor
Apri la pagina esportata in più di un browser, esegui il validatore W3C e un test di velocità come PageSpeed Insights, e correggi ciò che segnalano prima del lancio.
Un tema Mobirise o template HTML gratuiti per siti web?
Entrambi ti danno un aspetto finito fin dal primo giorno. La differenza sta in chi scrive il markup e in quali editor possono caricarlo in seguito.
Un template scaricato
Una cartella di file scritti da qualcun altro. Modificala con un editor di codice o con uno strumento visuale che apre HTML esterno, come Pinegrow, Dreamweaver, Bootstrap Studio o CoffeeCup. Leggi la licenza: alcuni template gratuiti richiedono un link di credito.
Un tema Mobirise
Una libreria di blocchi che vive dentro l'app invece di essere una cartella di file. Componi le pagine in modo visuale e l'esportazione produce l'HTML. Gli utenti gratuiti hanno 200+ blocchi in un unico tema base; KIT sblocca tutti i temi premium e le estensioni, oltre 220 in tutto.
Portare qui l'aspetto di un template
Mobirise non può aprire un template creato altrove, nemmeno uno basato su Bootstrap 5. Ricrea l'aspetto con i blocchi, oppure dai a Mobirise AI uno screenshot come prompt e modifica i quattro design che restituisce, se la licenza del template lo consente.
A chi serve Mobirise come editor HTML visuale
Mobirise è giusto per certi lavori e sbagliato per altri. Ecco come capire da che parte sta il tuo.
Una buona scelta
- Vuoi impostare le pagine in modo visuale e non scrivere mai un tag
- Ti servono file semplici per il tuo host, senza pagare un piano
- Crei siti per i clienti con blocchi coerenti e responsive
- Lavori offline su un laptop e pubblichi più tardi
- Vuoi prima una bozza AI, poi modifiche a mano nello stesso editor
Un altro strumento è meglio se
- Il tuo lavoro è correggere un vecchio sito scritto a mano o un template scaricato: Dreamweaver, Pinegrow o CoffeeCup HTML Editor
- Il tuo progetto richiede Tailwind o nessun framework: Pinegrow
- Vuoi un controllo al pixel e stili per ogni breakpoint: Webflow
- Preferisci pagare una sola volta per lavorare con Bootstrap: Bootstrap Studio
- Vuoi scrivere il codice e vederne l'anteprima gratis: l'edizione gratuita di CoffeeCup
- Il sito gira già su WordPress: Elementor
Domande sulla modifica visuale dell'HTML
Che cos'è un editor HTML WYSIWYG?
Un editor in cui modifichi una pagina web così come appare sullo schermo, mentre il programma scrive l'HTML e il CSS. La sigla promette che la pagina che modifichi è la pagina che pubblichi. In pratica le due sono vicine ma non identiche, perché font, larghezza dello schermo e script dipendono dal browser di ogni visitatore.
Mobirise è un editor HTML drag and drop?
Sì, a livello di blocchi: trascini sezioni già pronte da un pannello laterale sulla pagina, poi ci scrivi sopra. Non trascini singoli elementi in punti arbitrari; il layout nasce dai blocchi e dai loro parametri. Di più su questo modo di lavorare: costruttori di siti web gratuiti drag and drop.
Posso modificare il codice HTML in Mobirise?
Sì, una volta che hai l'estensione Code Editor, inclusa in KIT (149 $ all'anno), BASE e GROW. Mostra il markup e il CSS di un singolo blocco o dell'intera pagina. I file esportati con il piano gratuito si aprono anche in qualsiasi editor di testo, ma le modifiche fatte lì non tornano mai nel progetto.
Mobirise può aprire un template HTML che ho scaricato?
No. Un template di un marketplace o un sito scritto a mano è HTML semplice, e Mobirise lavora solo con i progetti creati al suo interno. Dreamweaver, Pinegrow, Bootstrap Studio e CoffeeCup HTML Editor caricano tutti HTML esistente; in Mobirise dovresti ricreare l'aspetto con i blocchi.
Esiste un editor HTML WYSIWYG gratuito?
Sì. L'app desktop di Mobirise non costa nulla per siti personali o commerciali, e lo stesso vale per la sua esportazione, anche se i siti gratuiti mostrano il branding Mobirise. CoffeeCup ha un'edizione gratuita del suo HTML Editor, se preferisci scrivere il codice. 8B AI genera design senza costi, anche se pubblicarli è a pagamento. Altre opzioni gratuite le confrontiamo nel nostro elenco di software gratuito per creare siti web.
L'HTML di un editor visuale è peggiore di quello scritto a mano?
Di solito è più pesante, perché gli strumenti visuali aggiungono wrapper e classi che le pagine scritte a mano non hanno. Un output basato su un framework come Bootstrap 5 resta leggibile e prevedibile; per il lato del framework, vedi il costruttore di siti web Bootstrap. Per un markup il più ridotto possibile, scrivilo tu in un editor di codice.
Esiste un editor HTML WYSIWYG offline per Mac, Windows o Linux?
Sì. L'app desktop di Mobirise ha versioni per Windows, per macOS (Apple Silicon e Intel) e per Ubuntu e altri sistemi Linux basati su Debian, e per modificare non serve alcuna connessione. Anche Bootstrap Studio, che tiene i progetti offline, e Pinegrow funzionano su tutti e tre i sistemi, mentre Dreamweaver non ha una versione per Linux e CoffeeCup HTML Editor funziona solo su Windows. Chi usa un Mac troverà più scelte nella nostra guida ai creatori di siti web per Mac.
Mobirise funziona offline?
Nell'app desktop sì: la modifica visuale, le anteprime e qualsiasi tema o blocco che hai installato continuano a funzionare senza rete. Serve una connessione per l'AI, la pubblicazione, l'accesso all'account, gli acquisti e per scaricare gli aggiornamenti o i temi che non hai ancora. Di più su questa distinzione: software per creare siti web offline.
Esiste un editor HTML WYSIWYG online per Android o iPhone?
Mobirise non ha un'app per i dispositivi Apple, ma su iPhone e iPad la sua versione online funziona in Safari o in qualsiasi altro browser mobile. Su Android, l'app Mobirise AI, che si installa da Google Play, genera design, traduce, pubblica ed esporta HTML. Anche 8B AI funziona nel browser.
Crea oggi la tua prima pagina
Inizia con l'AI nel browser o scarica l'app gratuita. In entrambi i casi è lo stesso Mobirise.