Ogni web designer e programmatore ha bisogno di un buon editor di pagine web per creare e modificare codice HTML, CSS e JavaScript. Blocco note (Windows) e TextEdit (Mac) sono ottimi strumenti per iniziare, ma man mano che acquisirai più esperienza, vorrai utilizzare uno strumento più solido e conveniente.
Ci sono centinaia di ottimi editor tra cui scegliere, ma molti di loro sono a pagamento. E se non si vuole violare il copyright e il budget non ha i fondi per acquistare un prodotto commerciale? Questo articolo esplora alcuni ottimi editor gratuiti.
- Editor WYSIWYG. Questi sono editor grafici che ti permettono di costruire un layout di pagina e impostare stili visivamente, come nel noto elaboratore di testi MS Word. Sono uno strumento utile per creare progetti di pagine, anche se, come sa ogni web designer esperto, il codice dovrà comunque essere modificato per ottenere un ottimo risultato.
- Editori di testo.È uno strumento per modificare direttamente il codice HTML e CSS. Alcuni editor sono di uso generale e non dispongono di opzioni speciali per supportare il codice web. Altri sono specializzati nell'utilizzo di linguaggi Web come HTML, CSS, JavaScript e PHP e dispongono di proprietà integrate per l'inserimento rapido di tag HTML, proprietà CSS e così via. Molti di questi editor consentono di visualizzare una pagina Web in una finestra separata.
KompoZer (Windows, Mac, Linux)
KompoZer è un'ottima scelta se hai bisogno di un editor visivo con un budget limitato
Komodo Edit è un buon editor, facile da imparare, ma potente ed estensibile
Sebbene sia un editor generico, supporta HTML e CSS e dispone di una proprietà di completamento automatico contestuale per i tag HTML e le proprietà CSS, nonché una raccolta di inserimenti di codice per vari elementi HTML. Per ottenere il massimo da Komodo, devi installare l'estensione HTML Toolkit, che contiene funzionalità meravigliose come la chiusura automatica dei tag, l'anteprima CSS e un generatore di testo temporaneo.
Komodo Edit ti consente di visualizzare le pagine modificate in qualsiasi browser installato o di utilizzare il browser integrato in una finestra separata, in modo da poter modificare e vedere il risultato delle modifiche allo stesso tempo.
L'editor ha una funzione integrata per caricare file sul sito (FTP, FTPS, SFTP o SCP) e puoi anche raggruppare i tuoi file usando l'opzione Project Manager.
Funzionalità molto utile Codice> Seleziona Blocca... Evidenzia il blocco HTML principale corrente, come l'elemento div o ul attualmente chiuso. Una funzione molto comoda quando è necessario selezionare un'intera sezione di una pagina per la copia o lo spostamento.
Komodo Edit ha molte funzioni potenti e utili, come l'uso di espressioni regolari per trovare/sostituire, la possibilità di eseguire comandi esterni e così via. Fortunatamente, l'editor ha anche un buon sistema di aiuto che rende facile padroneggiare tutta la potenza di Komodo Edit.
Aptana Studio (Windows, Mac, Linux)
Aptana Studio è un ambiente di sviluppo di applicazioni web integrato completo con una vasta gamma di plugin. Anche se puoi usarlo solo come editor di codice HTML / CSS / JavaScript
Notepad ++ è un ottimo sostituto del Blocco note di Windows. Sebbene non abbia lo stesso set di opzioni degli altri editor, è ottimo per modificare HTML, CSS, JavaScript e altri file di codice.
PSPad è un altro editor generico per Windows con molte funzioni utili per i programmatori HTML e CSS
jEdit è un editor di testo multipiattaforma con potenti comandi macro e funzionalità plug-in. Installa il plugin XML se devi modificare le pagine web
TextWrangler è un editor leggero per tutti gli usi. Nonostante la mancanza di funzionalità speciali per lo sviluppo web, può essere utilizzato per lavorare con le pagine web.
Vim è decisamente difficile da imparare, ma se lo superi, non vorrai più tornare indietro!
Il nonno degli editor di testo per programmatori Vim (discendente diretto dell'editor vi) è un editor di testo open source basato su console. È installato dall'editor predefinito su quasi tutte le versioni di Unix, inclusi Linux e Mac OS X. L'editor è disponibile anche per l'uso su Windows e molti altri sistemi.
Vim non è un sistema che puoi installare e iniziare a usare subito senza mai doverci occupare. La maggior parte dei comandi di modifica include combinazioni strane come wq e /. Ha anche tre modalità di modifica: modalità inserti in cui viene inserito il testo; visivo modalità per la selezione del testo; e comando modalità di immissione dei comandi. Questa funzionalità è un retaggio di Unix dai tempi in cui non c'erano finestre o mouse.
Perché è entrato nella lista? Una volta che lo padroneggi, sarai convinto della sua velocità e potenza. Con pochi comandi, puoi fare qualcosa in pochi secondi che può richiedere minuti in altri editor.
Esiste un gran numero di macro e plug-in Vim che semplificano il lavoro con codice HTML, CSS e JavaScript, inclusi l'evidenziazione della sintassi, il completamento automatico, HTML Tidy e l'anteprima del browser. Ecco un ampio elenco di link utili:
- Completamento automatico di Vim Omni
- Modifica HTML/XHTML in Vim
- home page
Frase (Mac)
Fraise è un editor intuitivo per Mac, con funzionalità sufficienti per l'editing web
Come TextWrangler e gedit, Fraise è un meraviglioso editor leggero che è un piacere da usare. È un fork dell'editor. È relativamente nuovo e non dispone di un server web adeguato. Attualmente è supportato solo su Mac OS X 10.6 (Snow Leopard), ovvero se stai utilizzando la versione 10.5 dovrai scaricare Smultron.
Fraise ha alcune fantastiche opzioni di modifica del web:
- Evidenziazione del codice per HTML, CSS, JavaScript, PHP e molti altri linguaggi di programmazione.
- Chiudi tag (Comando-T) per chiudere il tag corrente. Questo fa davvero risparmiare tempo quando si inseriscono gli elenchi.
- Comoda anteprima con browser integrato (usando WebKit), con l'opzione Live Update molto conveniente? che aggiorna il browser non appena il markup e il CSS sono cambiati nella pagina in fase di modifica.
- Opzione di ricerca avanzata che supporta la ricerca/sostituzione utilizzando le espressioni regolari.
- Supporto per blocchi per l'inserimento rapido di tag HTML e proprietà CSS.
- Alcuni comandi utili per la manipolazione del testo, come la convalida dell'HTML e la conversione dei caratteri in elementi HTML.
Vale la pena esplorare Fraise se utilizzi un Mac e desideri un editor pratico con più opzioni rispetto a TextEdit integrato.
Se vuoi sviluppare siti web devi procurarti un editor HTML. Certo, puoi usare un normale blocco note, ma è improbabile che sia conveniente. È importante notare che gli editor HTML devono eseguire due attività importanti, l'evidenziazione del codice e il completamento automatico. Naturalmente, sono benvenute anche funzioni aggiuntive, ad esempio vari temi. Ci sono molte di queste funzioni aggiuntive. Per ora, diamo un'occhiata ad alcuni editor HTML gratuiti che fanno un ottimo lavoro con le attività di cui sopra.
Editor di codice gratuito - Blocco note del programmatore
Questo editor offre un'interfaccia moderna di due tipi, chiara e scura. Inoltre, l'evidenziazione della sintassi è molto buona, i colori sono ben scelti. Penso che questo editor soddisferà tutte le tue esigenze.
Editor HTML - SynWrite
SynWrite è un fantastico editor con una vasta gamma di funzionalità. L'idea alla base di questo editor era di catturare tutti i vantaggi di altri editor HTML in un prodotto di qualità. La sua funzionalità può essere notevolmente ampliata con plugin aggiuntivi scritti in Python. Oltre alle funzioni standard, SynWrite permette di modificare immediatamente più parti di codice contemporaneamente:
Questa funzione ti farà risparmiare molto tempo.
Editor HTML gratuito - PlainEdit.NET
Questo editor può aprire più file contemporaneamente, possono anche essere aggiunti plugin che espandono in modo significativo le funzioni dell'editor, inclusi i temi. Inoltre, puoi aggiungere e modificare il testo utilizzando le espressioni regolari, anche in quei documenti che non sono attualmente aperti. Vale la pena notare che PlainEdit può funzionare anche da una chiavetta USB.
Blocco note ++
Questo editor è un classico. È molto popolare in tutto il mondo. Notepad ++ ha tutto ciò che dovrebbe avere un editor di testo. L'interfaccia può essere personalizzata secondo i tuoi desideri e i plugin gratuiti ti aiuteranno ad espandere le funzionalità dell'editor.
Editor gratuito - jEdit
Questo editor può aprire e modificare quasi tutti i file. Facilita notevolmente il compito di aprire più file contemporaneamente. Eventuali funzionalità mancanti possono essere integrate con una varietà di plug-in.
Fuori dalla scatola, jEdit viene fornito con funzioni necessarie integrate, ad esempio, piegatura del codice, marcatura di tag ed elementi, un file manager e molte altre funzioni.
Testo sublime 2
È l'editor più popolare tra i programmatori e gli sviluppatori web. Nessun altro editor come questo ha avuto un tale trionfo come Sublime Text 2. È elogiato da molti programmatori. L'editor è profondamente personalizzabile attraverso diverse risoluzioni e file JSON.
Per questo popolare editor, puoi trovare vaste librerie di documentazione, sia ufficiale che non ufficiale. I tutorial di Sublime Text 2 possono essere trovati ovunque.
Sublime Text 2 è parzialmente gratuito con una licenza di $ 70.
Nuovo editor - Parentesi
Brackets è un moderno editor open source con alcune interessanti funzionalità. Funziona con Adobe Creative Cloud per portare colori, caratteri e altro da un file PSD. Può anche estrarre i livelli come immagini. Molto comodamente
Sfortunatamente Adobe Creative Cloud è un servizio a pagamento.
Questo editor ha tutte le funzioni necessarie per un moderno editor di codice. Esistono molte estensioni diverse che vengono rilasciate ogni 2 o 3 settimane.
Aptana studio 3
I maggiori punti di forza dell'editor sono la sua personalizzazione, l'integrazione con Git e il terminale integrato. Aptana Studio 3 supporta i più recenti standard web come HTML5 e CSS3.
Conclusione
Esistono molti editor HTML, ma solo alcuni di essi possono essere effettivamente utilizzati. Per l'uso non quotidiano c'è Notepad++, ma per l'uso quotidiano chiaramente non basterebbe. Ci sono opzioni migliori per questo, come Sublime Text 2, che può essere personalizzato in base alle esigenze dell'utente. Curiosi di sapere quali editor scegli?
La visualizzazione del codice non è più stata a lungo una priorità per gli sviluppatori. Questo articolo fornisce un elenco di 9 editor WYSIWYG utilizzati a questo scopo. Ti consigliamo di familiarizzare con esso nel caso in cui si presenti un'attività simile durante l'implementazione del progetto.
Qual è il miglior editore del 2016?
In questa sezione dell'articolo troverai alcuni ottimi editor che renderanno il tuo lavoro più semplice e veloce. Qual è il migliore?
Scelta dell'editore: Atom.io
Molti editor sono stati creati nel corso degli anni, ma pochi sono rimasti ad alto livello o addirittura migliorati. Atom.io è usato da tutti i miei amici programmatori e lo scelgo anch'io.
Se vuoi il miglior editor HTML WYSIWYG che riduca il tempo impiegato a scrivere o modificare il codice di 10 volte, allora questo è Atom. Provalo e me ne sarai grato. Atom.io è gratuito e creato dal team di Github.
Un altro strumento encomiabile è Coda, un editor molto interessante per gli utenti Mac. Ha un'interfaccia perfetta e bella, ma costa $ 99. Al momento preferisco Atom!
Ora una panoramica del resto degli editori.
1. NicEdit
Versione demo | Scarica
NicEdit è un'alternativa agli editor visivi più voluminosi e complessi, è di piccole dimensioni. Vanta anche molte funzioni di editor essenziali e questo editor WYSIWYG online è facile da integrare nel tuo sito web.
2. TinyMCE
Versione demo | Scarica
TinyMCE è un editor HTML WYSIWYG open source scritto in JavaScript. È facile da integrare e facile da personalizzare con temi e plugin. TinyMCE è uno degli editor più "completi", offrendo funzionalità simili a MSWord.
3. CKEditor
Versione demo | Scarica
CKEditor è una versione aggiornata di FCKEditor, che in precedenza era il leader del settore. Si basava sul desiderio di correggere gli errori di FCKEditor. Il risultato è un editor visivo ad alte prestazioni che offre funzionalità di modifica alla pari di MSWord e Open Office.
4. Editor di testo RTF YUI
Versione demo | Scarica
WYSIWYG Site Editor YUI Rich è un controllo dell'interfaccia Yahoo che trasforma un semplice riquadro di testo in un editor WYSIWYG completamente funzionale. Lo strumento è disponibile in diverse versioni di vari livelli di difficoltà e con diverse funzioni, ma in ognuna di esse gli autori riescono a raggiungere un'ottima ergonomia ( senza l'ingombro di pulsanti che ingombrano l'interfaccia).
5. MarkItUp!
Versione demo | Scarica
Markitup è un plug-in jQuery che ti consente di trasformare aree di testo in editor di markup a tua scelta. Sintassi HTML, Wiki e BBcode sono solo alcune delle opzioni supportate. Markitup non è un editor WYSIWYG, ma ciò non significa che non offra tutte le funzionalità di cui hai bisogno. È anche compatto e facile da usare.
6. Casella di testo libera
Versione demo | Scarica
FreeTextBox è un editor HTML WYSIWYG online appositamente progettato per ASP.NET. L'aspetto dell'editor è molto simile a Microsoft Word. La versione gratuita non implementa diverse funzioni avanzate, ma il set disponibile è più che sufficiente per un lavoro a tutti gli effetti.
7. MooEditable
Versione demo | Scarica
MooEditable fornisce funzionalità semplici ma potenti basate su una libreria JavaScript ben scritta. Se sei un fan di Mootools, non dovresti avere problemi con questo.
8. OpenWysiwyg
Versione demo | Scarica
OpenWYSIWYG è un semplice editor WYSIWYG multi-browser con tutte le funzionalità di cui hai bisogno. Ha una bellissima interfaccia utente che include pop-up e pulsanti. Una delle sue caratteristiche distintive è l'implementazione di alta qualità del lavoro con i tavoli. Allo stesso tempo, OpenWYSIWYG non è ancora supportato in Google Chrome.
9.jHtmlArea
Versione demo | Scarica
jHtmlArea è un altro editor WYSIWYG progettato come plugin per la popolare libreria jQuery. È facile da usare e contiene solo le opzioni più essenziali. Ciò rende molto facile personalizzare tutti i suoi componenti, dall'aspetto alla lingua.
Un editor HTML è la prima cosa di cui hai bisogno per iniziare a creare pagine web usando HTML e CSS. Ci sono molti editor HTML gratuiti là fuori e sceglierne uno può essere un compito arduo.
L'HTML è abbastanza semplice e quindi puoi iniziare a lavorare sulle tue pagine web utilizzando un semplice editor di testo come Blocco note, WordPad o altro. Puoi anche andare oltre e utilizzare uno degli editor più potenti come Coffecup, Notepad ++, Brackets, Notetab o BlueGriffon. Il vantaggio dell'utilizzo di editor più avanzati e funzionali è che ottieni più strumenti che possono velocizzare notevolmente il markup e il processo di creazione dei contenuti.
Sia che tu stia cercando di creare blog e articoli che siano ben formattati per essere letti dai browser, o stia pianificando di costruire un sito web completamente funzionale utilizzando HTML e CSS, la scelta dell'editor giusto aumenterà notevolmente la tua produttività. Gli sviluppatori web professionisti dedicano molto tempo alla scelta dell'editor e degli strumenti che meglio si adattano alle loro esigenze e aumentano la produttività.
Quale editor HTML gratuito è adatto a te?
La risposta a questa domanda dipende interamente dalle tue esigenze, dal prodotto che intendi creare utilizzando l'HTML, dal tuo attuale livello di conoscenza di questo linguaggio di markup se intendi semplicemente imparare. Poiché la maggior parte di questi editor sono gratuiti, puoi restringere l'elenco a 2-3, provare le loro funzionalità di base e quindi decidere quale ti piace di più.
Inoltre, quasi tutti gli editor elencati in questo articolo sono supportati su più sistemi operativi, inclusi Windows, Linux e Mac, quindi non devi preoccuparti della compatibilità.
Nota che la maggior parte delle tue esigenze editoriali può essere facilmente soddisfatta da Notepad ++ per Windows, Brackets per Mac (questo editor è supportato anche per Linux e Windows) o Coffecup e Notetab. Tuttavia, se hai intenzione di creare un sito Web complesso, dovresti scegliere un IDE completo come Eclipse.
D'altra parte, se vuoi solo giocare con HTML e CSS, ci sono numerosi editor online al tuo servizio dove puoi scrivere codice HTML e vedere subito il risultato.
Diamo un'occhiata ai 10 migliori editor HTML facili da usare, ricchi di funzionalità e popolari tra gli sviluppatori web.
1. Blocco note ++ (miglior editor HTML gratuito per Windows)
notepad-plus-plus.org Questo editor è disponibile solo per gli utenti Windows, quindi se hai un Mac o Linux, scorri verso il basso. Notepad ++ è il miglior editor HTML gratuito che puoi installare sul tuo computer Windows. A prima vista sembra molto semplice, ma è uno degli editor più complessi e allo stesso tempo facili da usare.
La maggior parte delle grandi capacità di Notepad ++ sono fornite da plug-in di terze parti, tra cui PreviewHTML, plug-in di tag HTML per l'evidenziazione dei tag, Tidy2 per il rientro e molti altri.
Le caratteristiche principali di Notepad ++ sono un'interfaccia tabulare per lavorare con più file contemporaneamente, piegatura ed evidenziazione della sintassi molto semplici, GUI personalizzabile (con una versione minimalista), tabelle con un pulsante di chiusura, tabelle verticali, multilinguismo (ovvero, puoi personalizzare l'interfaccia in inglese, francese, spagnolo e cinese, oltre a 80 altre lingue).
Notepad ++ è stato sviluppato da Don Ho e rilasciato nel 2003. È gratuito sia per uso personale che commerciale ed è distribuito sotto la GNU General Public License.
Per gli utenti Mac, Brackets è un'ottima alternativa a Notepad ++, che tratteremo in seguito.
2. Staffe (gratuite per Mac, Windows e Linux)
Brackets è un altro strumento di sviluppo web e modifica HTML popolare e affidabile. A differenza di Notepad ++, questo editor è supportato per Mac, Ubuntu, Debian e Windows. È anche gratuito per uso personale e commerciale (licenza MIT).
Brackets è facile da usare e ha molte estensioni per migliorarne la funzionalità. Estensioni popolari:
- Emmet - Velocizza la scrittura di codice CSS e HTML;
- Beutify - Formatta file HTML, CSS e JavaScript.
- Convalida W3C: verifica la validità del codice HTML.
Brackets è un bellissimo editor con un design moderno e minimalista. Le modifiche apportate al codice vengono visualizzate immediatamente nel browser. Puoi apportare modifiche al codice CSS o HTML e vedere come cambiano l'aspetto del sito in tempo reale.
Leggi qui le parentesi quadre - Editor per HTML: parentesi
3. Coffecup (esiste sia la versione gratuita che quella a pagamento)
Coffecup è probabilmente il miglior editor HTML disponibile sia in versione gratuita che commerciale. Quello gratuito non ha alcune funzionalità, ma è abbastanza complesso da essere nella nostra lista.
Le caratteristiche principali della versione gratuita includono:
- barre degli strumenti personalizzabili,
- completamento del codice per elementi, attributi e selettori,
- temi e modelli pronti all'uso,
- supporto per il formato markdown per HTML,
- Supporto FTP/SFTP,
- funzione trascina e posiziona per le immagini,
- opzione di anteprima,
- evidenziazione della sintassi,
- un dizionario dei sinonimi per trovare alternative a una parola e molto altro ancora.
La versione a pagamento non è troppo costosa. Include diverse funzionalità aggiuntive come la convalida del codice HTML e CSS, la libreria di tag, la pulizia del codice, il correttore ortografico dinamico.
Coffecup offre anche diversi moduli avanzati per lavorare in stile mobile friendly, senza la necessità di scrivere alcun codice, semplicemente utilizzando le funzioni di trascinamento della selezione. Questi moduli includono Foundation framer, Bootstrap builder e Responsive site designer.
Coffecup è sul mercato dal 1996 ed è utilizzato da liberi professionisti, startup, piccole imprese e sviluppatori web di grandi aziende. È un ottimo strumento per creare siti Web, pagine Web, newsletter, note in formato HTML, contenuti di social media.
4. NoteTab (due versioni, a pagamento e gratuita)
NoteTab è un altro editor HTML e CSS che offre funzionalità per uno sviluppo rapido. È un prodotto del software Fookes, che ha creato strumenti di accelerazione dello sviluppo negli ultimi 20 anni.
La popolarità di NoteTab è confermata dal fatto che è utilizzato in NASA, FBU, VISA, CIA Hewlett Packard, MIT.
NoteTab ha tre versioni, Light, Standard e Pro. La versione Light è distribuita gratuitamente per uso individuale. Non ha tutte le funzionalità della versione Pro, ma supporta librerie HTML5 e CSS3, bootstrap, completamento automatico HTML, unione di file in progetti, supporto HTML Tidy, HTML in testo e ha anche molti temi.
NoteTab può essere eseguito direttamente da una chiavetta USB e non ha bisogno di essere installato sul tuo computer. Per i blogger e i creatori di contenuti, questo editor supporta il conteggio delle parole e le statistiche SEO.
Puoi conoscere meglio NoteTab sul sito ufficiale.
5. Eclipse (editor HTML gratuito)
Eclipse è pesante e forse eccessivo per lo sviluppo HTML e CSS, ma può essere utilizzato con successo se non ti dispiace installare e configurare questa bestia. Questo è un ottimo strumento se prevedi di creare siti complessi con database combinati con altre fonti di dati, ecc. L'installazione potrebbe richiedere del tempo e richiedere l'installazione di plug-in aggiuntivi.
Eclipse è l'IDE open source più popolare. Questo editor è comunemente usato per Java, JavaScript, PHP, Ruby, Android e molti altri linguaggi di programmazione.
Scopri di più qui -
6. HTML in linea
Quando si tratta di modificare il codice HTML online, in un browser, niente batte HTML-online.com. Puoi iniziare subito il processo di scrittura del codice, senza scaricare e installare alcun programma, ed è gratuito.
Uno dei vantaggi di questo editor è la conversione di Word in HTML, grazie alla quale puoi copiare i tuoi contenuti da file Microsoft Word e applicarvi automaticamente il markup HTML. C'è anche il supporto per Google Docs, PDF, Excel, PowerPoint e molti altri tipi di documenti.
È un robusto editor visivo che ti aiuterà a creare la tua pagina web tenendo d'occhio le modifiche al codice nella finestra adiacente. Altre caratteristiche degne di nota sono la pulizia dell'HTML, la trasmissione di elementi della tabella ai div, le opzioni di ricerca e sostituzione.
7. BlueGriffon (licenza gratuita, base e EPUB)
BlueGriffon proviene dalla casa di Disruptive Innovations SAS. È basato su Gecko, il motore di rendering delle pagine Web di Mozilla. BlueGriffon è un potente editor che eredita la maggior parte delle sue capacità da Netscape, Composer, Nvu e Mozilla.
BlueGriffon ha tre varianti, la prima è gratuita, la seconda è distribuita con licenza base e la più potente è con licenza EPUB.
Anche la versione gratuita può fare molto. Ha skin nere e chiare, supporto per moduli audio, video e HTML5, le funzioni di modifica CSS3 includono transizioni, trasformazioni 3D e 2D, creazione SVG, tecnologia WYSIWYG, gestore di caratteri google, gestore di caratteri scoiattolo di caratteri, supporto per il formato markdown, interfaccia utente in oltre 20 lingue.
Puoi scaricare e installare BlueGriffon su Windows, Linux Ubuntu e OS X sul tuo Mac. Puoi saperne di più sul sito -
8. Emacs con plugin
www.gnu.org Emacs è uno degli editor più amati di tutti i tempi. È gratuito (licenza GNU). Emacs è un editor di codice generico che puoi personalizzare in base alle tue esigenze. L'inclusione di plugin liberamente ridistribuibili lo trasforma in un potente editor di codice con ricche funzionalità.
Quando si tratta di modificare HTML, Emacs offre la modalità HTML, che rende la modifica del codice molto semplice. Leggi di più qui - Emacs
9. Atomo
atomo.io Atom è un editor di testo ricostruibile dagli sviluppatori di GitHub. La sua popolarità sta crescendo molto rapidamente. Questo editor è gratuito sia per uso personale che commerciale (licenza MIT). La comunità degli sviluppatori monitora costantemente l'arricchimento dell'editor con nuove funzionalità.
Come posso trasformare Atom in un editor HTML gratuito?
Atom viene fornito con tutte le funzionalità di base necessarie per modificare il codice, ma per renderlo un editor HTML completamente funzionante, è necessario installare pacchetti aggiuntivi. Tra questi ci sono Emmet, atom-html-preview, Autocomplete-plus, Atom-color-highlight, Autocomplete-CSS, linter, minimap, haml e jade.
Atom è supportato per Windows, Ubuntu (Debian Linux), Fedora (dalla versione 22), Mac e Red Hat Linux. È più adatto per lo sviluppo web che per la scrittura di contenuti in quanto è più orientato al codice e necessita di un piccolo ritocco.
10. Comunità di Visual Studio
Visual Studio Community è un IDE completamente funzionale di Microsoft ed è gratuito per tutti. Visual Studio offre funzionalità di modifica HTML e CSS preconfigurate che possono essere ulteriormente migliorate con le estensioni.
Estensioni popolari che vale la pena menzionare sono frammenti HTML, HTMLHint, supporto HTML CSS, Intellisense per il nome della classe CSS.
Come Eclipse, la community di Visual Studio è una scelta eccellente per siti complessi e altamente scalabili che richiedono molte tecnologie.
Conclusione
Il linguaggio di markup HTML è utilizzato ovunque. Esistono molti editor HTML creati molto tempo fa, ma comunque al passo con i tempi e abbastanza adatti allo sviluppo web. Ma ce ne sono altri che già mancano di funzionalità e produttività. Stanno emergendo nuovi editor come Brackets e Atom per consentire la modifica efficiente del codice.
La maggior parte degli editor elencati in questo articolo ha le proprie caratteristiche, ma hanno uno scopo: creare pagine web. Aumentano la velocità di sviluppo e aiutano a semplificare il codice, tenendo conto della possibilità della sua scalabilità.
Dai un'occhiata più da vicino alle opzioni menzionate in questo articolo, scrivi le tue esigenze chiave, restringi l'elenco a un paio di editor, provali uno e determina quale ti piace di più. Troverai sicuramente almeno un buon editor HTML per Linux, Mac e Windows.
Il miglior kit software di editor HTML online in tempo reale con anteprima visiva dinamica istantanea in tempo reale e editor WYSIWYG in linea che utilizza CKEditor e funzionalità di pulizia del markup. Include un visualizzatore HTML, un editor, un compressore, un abbellitore e un facile formattatore. È impossibile creare codice non valido con questo strumento.
Come usare l'editor HTML?
Attiva lo scorrimento automatico. I due editor scorreranno insieme quando questa opzione è abilitata.
Regola la dimensione del carattere in base alle tue preferenze.
Esegui tutte le opzioni che sono selezionate nelle impostazioni (vedi l'icona a forma di ingranaggio sopra).
Altre importanti funzioni di modifica
Puoi provare queste funzionalità dell'editor HTML per esercitarti e massimizzare la tua efficienza di codifica.
- Convertitore di documenti- Per convertire qualsiasi documento visivo come Excel, PDF, Word in HTML, incolla semplicemente il documento nell'editor visivo e il markup verrà visualizzato immediatamente sulla destra.
- Editor di testo online- Componi documenti, proprio come in un rich text editor. Usa il pannello di controllo per includere immagini, tabelle, titoli, elenchi e altri elementi nel tuo foglio.
- Copia incolla- L'editor non ti permetterà di salvare i documenti. Per questo devi copiare il codice generato in un file di testo vuoto, cambiarne l'estensione in .html e aprilo in a programma di navigazione in rete.
- Lavora con le tabelle- Utilizzando il pannello dell'editor WYSIWYG puoi creare una tabella di qualsiasi dimensione in soli 2 click. C'è un'opzione di pulizia per convertirli in tag DIV con stile.
- Annullare- Entrambi gli editor hanno questa funzione che consente di riportare il documento a uno stato precedente, ad es. prima che sia stata eseguita la pulizia.
- Demo interattiva- Fai un tour in 4 passaggi attraverso le funzionalità facendo clic su Tour veloce elemento del menu. Impara come usare il redattore e sperimenta con il testo dimostrativo.
Non dimenticare mai:
- Fai un backup prima di utilizzare questo strumento per assicurarti di poter sempre tornare al documento originale.
- Controlla sempre il tuo codice prima di pubblicarlo su un sito web live.
- Questo editor non salva o invia mai il tuo documento, tutte le operazioni vengono eseguite sul tuo computer locale.
- Come la maggior parte dei siti Web, questo utilizza i cookie.
Stile tabella div
Assicurati di applicare il codice CSS di seguito quando pubblichi tabelle convertite in elementi div. Prova lo styler di tabelle online interattivo che può generare griglie sia da div che da elementi di tabella. Questi sono entrambi supportati da questo editor.
Tieni presente che i nomi delle classi da noi utilizzati sono leggermente diversi da quelli utilizzati da DivTable.com.
.rTabella (display: tabella; larghezza: 100 % ;) .rTableRow (display: table-row;) .rTableHeading (background-color: #ddd; display: table-header-group;) .rTableCell, .rTableHead (display: table-cell; padding: 3 px 10px; bordo: 1 px solido # 999999; ) .rTableHeading (display: table-header-group; background-color: #ddd; font-weight: bold;) .rTableFoot (display: table-footer-group; font-weight: bold; background-color: #ddd; ) .rTableBody (display: table-row-group;)Clicca e copia il codice dal campo sottostante: .rTable (display: table; width: 100%;) .rTableRow (display: table-row;) .rTableHeading (background-color: #ddd; display: table-header-group ;) .rTableCell, .rTableHead (display: table-cell; padding: 3px 10px; border: 1px solid # 999999;) .rTableHeading (display: table-header-group; background-color: #ddd; font-weight: grassetto ;) .rTableFoot (display: table-footer-group; font-weight: bold; background-color: #ddd;) .rTableBody (display: table-row-group;)
