Editor HTML - HTML editor

HTML
Confronti

Un editor HTML è un programma per modificare HTML , il markup di una pagina web . Sebbene il markup HTML in una pagina Web possa essere controllato con qualsiasi editor di testo , editor HTML specializzati possono offrire comodità e funzionalità aggiuntive. Ad esempio, molti editor HTML gestiscono non solo HTML, ma anche tecnologie correlate come CSS , XML e JavaScript o ECMAScript . In alcuni casi gestiscono anche la comunicazione con server web remoti tramite FTP e WebDAV e sistemi di controllo versione come Subversiono Git . Molti programmi di elaborazione testi , progettazione grafica e impaginazione non dedicati al web design , come Microsoft Word o Quark XPress , hanno anche la capacità di funzionare come editor HTML.

Tipi di editori

Esistono due principali varietà di editor HTML: editor di testo e WYSIWYG (quello che vedi è ciò che ottieni).

Editor di testo

Gli editor di testo destinati all'uso con HTML di solito forniscono almeno l' evidenziazione della sintassi . Alcuni editor dispongono inoltre di modelli , barre degli strumenti e scorciatoie da tastiera per inserire rapidamente elementi e strutture HTML comuni . Le procedure guidate , i suggerimenti dei comandi e il completamento automatico possono aiutare con le attività comuni.

Gli editor di testo comunemente usati per HTML in genere includono funzioni integrate o integrazione con strumenti esterni per attività come il controllo della versione , il controllo e la convalida dei collegamenti , la pulizia e la formattazione del codice , il controllo ortografico, il caricamento tramite FTP o WebDAV e la strutturazione come progetto. Alcune funzioni, come il controllo o la convalida del collegamento, possono utilizzare strumenti online , che richiedono una connessione di rete.

Gli editor di testo richiedono la comprensione dell'utente dell'HTML e di qualsiasi altra tecnologia web che il progettista desidera utilizzare come CSS, JavaScript e linguaggi di scripting lato server .

Per facilitare questo requisito, alcuni editor consentono la modifica del markup in modalità più organizzate visivamente rispetto alla semplice evidenziazione a colori, ma in modalità non considerate WYSIWYG. Questi editor in genere includono l'opzione di utilizzare finestre della tavolozza o finestre di dialogo per modificare i parametri basati sul testo degli oggetti selezionati . Queste tavolozze consentono di modificare i parametri in singoli campi o di inserire nuovi tag compilando un modulo su schermo e possono includere widget aggiuntivi per presentare e selezionare opzioni durante la modifica dei parametri (come l'anteprima di un'immagine o stili di testo) o un editor di contorni per espandere e comprimi oggetti e proprietà HTML.

Editor HTML WYSIWYG

Image
Amaya 10 editor HTML

Gli editor HTML WYSIWYG forniscono un'interfaccia di modifica che ricorda il modo in cui la pagina verrà visualizzata in un browser web . Poiché l'utilizzo di un editor WYSIWYG potrebbe non richiedere alcuna conoscenza dell'HTML, è spesso più facile per un utente di computer inesperto iniziare.

La vista WYSIWYG si ottiene incorporando un motore di layout. Questo può essere scritto su misura o basato su quello utilizzato in un browser web. L'obiettivo è che, in ogni momento durante l'editing, il risultato renderizzato rappresenti ciò che verrà visto in seguito in un tipico browser web.

WYSIWYM (quello che vedi è ciò che intendi ) è un paradigma alternativo agli editor WYSIWYG. Invece di concentrarsi sul formato o sulla presentazione del documento, preserva il significato previsto di ciascun elemento. Ad esempio, le intestazioni di pagina, le sezioni, i paragrafi, ecc. sono etichettate come tali nel programma di modifica e visualizzate in modo appropriato nel browser.

Difficoltà nel raggiungimento di WYSIWYG

Un dato documento HTML avrà un aspetto incoerente su varie piattaforme e computer per diversi motivi:

Browser e applicazioni diversi renderanno lo stesso markup in modo diverso.
La stessa pagina potrebbe essere visualizzata in modo leggermente diverso in Internet Explorer e Firefox su uno schermo ad alta risoluzione, ma apparirà molto diversa nel browser Lynx di solo testo perfettamente valido . Deve essere riprodotto in modo diverso su un PDA, un televisore abilitato a Internet e su un telefono cellulare. L'usabilità in un browser vocale o braille, o tramite uno screen reader che lavora con un browser convenzionale, richiederà aspetti completamente diversi dell'HTML sottostante. Tutto ciò che un autore può fare è suggerire un'apparizione.
I browser Web, come tutti i software per computer, hanno bug
Potrebbero non essere conformi agli standard attuali. È inutile cercare di progettare pagine Web attorno a tutti i bug attuali dei browser comuni: ogni volta che esce una nuova versione di ciascun browser, una parte significativa del World Wide Web avrebbe bisogno di essere ricodificata per adattarsi ai nuovi bug e nuove correzioni. Generalmente è considerato molto più saggio progettare secondo gli standard, stare lontano dalle funzionalità "bleeding edge" fino a quando non si sistemano, e quindi attendere che gli sviluppatori del browser raggiungano le tue pagine, piuttosto che il contrario. Ad esempio, nessuno può sostenere che i CSS siano ancora "all'avanguardia" poiché ora è disponibile un supporto diffuso nei browser comuni per tutte le principali funzionalità, anche se molti WYSIWYG e altri editor non hanno ancora raggiunto del tutto.
Un singolo stile visivo può rappresentare più significati semantici
Il significato semantico, derivato dalla struttura sottostante del documento HTML, è importante per i motori di ricerca e anche per vari strumenti di accessibilità. Sulla carta possiamo dire dal contesto e dall'esperienza se il testo in grassetto rappresenta un titolo, o un'enfasi, o qualcos'altro. Ma è molto difficile trasmettere questa distinzione in un editor WYSIWYG. Rendere semplicemente un pezzo di testo in grassetto in un editor WYSIWYG non è sufficiente per dire al lettore *perché* il testo è in grassetto - cosa rappresenta semanticamente il grassetto.
I siti web moderni sono raramente costruiti in modo da rendere utile WYSIWYG
I siti Web moderni in genere utilizzano un sistema di gestione dei contenuti o altri mezzi basati su un processore di modelli per costruire pagine al volo utilizzando il contenuto archiviato in un database. Le singole pagine non vengono mai archiviate in un filesystem in quanto possono essere progettate e modificate in un editor WYSIWYG, quindi è inevitabile una forma di layout astratto basato su modelli, invalidando uno dei principali vantaggi dell'utilizzo di un editor WYSIWYG.

Markup HTML valido

HTML è un linguaggio di markup strutturato . Esistono alcune regole su come deve essere scritto l'HTML per conformarsi agli standard W3C per il World Wide Web . Seguire queste regole significa che i siti web sono accessibili su tutti i tipi e marche di computer, a persone normodotate e con disabilità, e anche su dispositivi wireless come telefoni cellulari e PDA , con le loro larghezze di banda e dimensioni dello schermo limitate. Tuttavia, la maggior parte dei documenti HTML sul Web non soddisfa i requisiti degli standard W3C. In uno studio condotto nel 2011 sui 350 siti Web più popolari (selezionati dall'indice Alexa), il 94% dei siti Web non supera i test di markup degli standard Web e di convalida del foglio di stile o applica la codifica dei caratteri in modo improprio. Anche quei documenti sintatticamente corretti possono essere inefficienti a causa di un uso non necessario della ripetizione o basati su regole che sono state deprecate da alcuni anni. Le attuali raccomandazioni del W3C sull'uso dei CSS con l'HTML sono state formalizzate per la prima volta dal W3C nel 1996 e da allora sono state riviste e perfezionate. Vedere CSS , XHTML , l'attuale raccomandazione CSS del W3C e l'attuale raccomandazione HTML del W3C .

Queste linee guida enfatizzano la separazione del contenuto (HTML o XHTML) dallo stile (CSS). Questo ha il vantaggio di fornire le informazioni di stile una volta per un intero sito, non ripetute in ogni pagina, figuriamoci in ogni elemento HTML. Da allora, i progettisti di editor WYSIWYG hanno lottato con il modo migliore per presentare questi concetti ai propri utenti senza confonderli esponendo la realtà sottostante. I moderni editor WYSIWYG ci riescono tutti in una certa misura, ma nessuno di loro ci è riuscito del tutto.

Comunque una pagina web sia stata creata o modificata, WYSIWYG o a mano, per avere successo tra il maggior numero possibile di lettori e spettatori, oltre che per mantenere il valore 'mondiale' del Web stesso, dovrebbe prima di tutto consistere di markup e codice validi. Non dovrebbe essere considerato pronto per il World Wide Web, fino a quando la sua sintassi HTML e CSS non sarà stata convalidata con successo utilizzando i servizi di validazione W3C gratuiti ( W3C HTML Validator e W3C CSS Validator ) o altre alternative affidabili.

L'accessibilità delle pagine web da parte di persone con disabilità fisiche, visive o di altro tipo non è solo una buona idea considerando l'ubiquità e l'importanza del web nella società moderna, ma è anche prevista dalla legge. Negli Stati Uniti, l' American with Disabilities Act e nel Regno Unito il Disability Discrimination Act impongono requisiti ai siti Web gestiti da organizzazioni finanziate con fondi pubblici. In molti altri paesi leggi simili esistono già o presto lo saranno. Rendere accessibili le pagine è più complesso che renderle valide; questo è un prerequisito, ma ci sono molti altri fattori da considerare. Un buon web design, che sia eseguito utilizzando uno strumento WYSIWYG o meno, deve tener conto anche di questi.

Qualunque siano gli strumenti software utilizzati per progettare, creare e mantenere le pagine Web, la qualità dell'HTML sottostante dipende dall'abilità della persona che lavora sulla pagina. Una certa conoscenza di HTML, CSS e altri linguaggi di scripting, nonché una familiarità con le attuali raccomandazioni del W3C in queste aree, aiuterà qualsiasi designer a produrre pagine web migliori, con un editor HTML WYSIWYG e senza.

Guarda anche

Riferimenti