Italiano

Strumenti per sviluppatori · HTML WYSIWYG editor

Una breve storia di WYSIWYG: da Bravo di Xerox PARC agli editor di browser

· Sfondo

html contenutomodificabile flusso di lavoro dello sviluppatore

Una sequenza dalla modifica visiva del documento a una superficie modificabile del contenuto del browser
Illustrazione vettoriale originale ToolAcre

Traccia la modifica di ciò che vedi è ciò che ottieni dai sistemi di ricerca degli anni '70 attraverso il desktop publishing e i costruttori di pagine Web fino agli editor modificabili dei contenuti in ogni browser.

Prima di WYSIWYG, formattavi alla cieca: si apre con flussi di lavoro di markup e stampa e spiega perché l'editing visivo era rivoluzionario

Prima dell'editing visivo, gli autori spesso scrivevano codici di controllo o markup e visualizzavano il risultato formattato in un secondo momento. Il ritardo ha reso il layout iterativo: modifica le istruzioni, esegui nuovamente il rendering, confronta e ripeti. Mostrare la formattazione durante la composizione ha accorciato il ciclo e ha cambiato ciò che i non specialisti si aspettavano dal software di documentazione.

Questo articolo evita deliberatamente i primi e le date esatte che il repository non fornisce in modo indipendente. Il suo scopo è spiegare la linea di progettazione dietro una superficie di modifica del browser, non certificare una cronologia storica completa. Le pietre miliari nominate necessitano di riferimenti di archivio prima della pubblicazione come storia effettiva del prodotto.

I primi sistemi di documenti visivi stabilirono l'idea; questo repository non fornisce una cronologia Bravo

I sistemi di ricerca associati a Xerox PARC sono ampiamente discussi nelle storie di WYSIWYG e la cartella di lavoro si chiama Bravo. Nessuna fonte del repository qui fornita ne verifica la data, il set di funzionalità o la priorità rispetto ai contemporanei, quindi questi dettagli vengono omessi anziché parafrasati come fatti.

La pietra miliare concettuale difendibile è una visualizzazione bitmap abbinata alla manipolazione diretta di documenti formattati. Lo schermo divenne un'approssimazione attiva dell'output piuttosto che semplicemente un luogo in cui digitare comandi. Quella relazione tra la formattazione visibile e la struttura sottostante definisce ancora i compromessi degli editor moderni.

L'editing visivo ha raggiunto i desktop dei consumatori; i traguardi esatti del prodotto richiedono fonti di archivio esterne

La cartella di lavoro successiva nomina Xerox Star, MacWrite e desktop publishing. La sequenza e l'influenza esatte richiedono fonti oltre questa base di codice. Ciò che si può dire senza invenzioni è che il personal computer grafico ha reso la composizione visiva familiare a un pubblico molto più ampio e ha collegato l'editing con i caratteri, la spaziatura e il layout della pagina.

Quel modello desktop incoraggiava le aspettative di pagine stabili e dispositivi di output controllati. Il contenuto Web in seguito ha complicato la promessa perché un frammento HTML può soddisfare molti fogli di stile, larghezze e preferenze dell'utente. La frase “quello che vedi” è diventata meno letterale man mano che la pubblicazione si è spostata da pagine simili a carta a documenti reattivi.

I creatori di pagine degli anni '90 hanno messo in luce il visual webauthoring e il suo compromesso con il markup

I costruttori di pagine Web visive hanno introdotto la composizione diretta in HTML e sono stati associati ai wrapper generati e al markup di presentazione. Ancora una volta, la cartella di lavoro nomina prodotti particolari senza prove di repository per una reputazione o una sequenza temporale dettagliate. Questo articolo limita il punto al duraturo compromesso ingegneristico.

Uno strumento visivo deve tradurre i gesti in un albero e in una corda. Se ottimizza per l'aspetto immediato, può emettere una presentazione locale che resiste alla riprogettazione successiva. Se limita l’output, la fedeltà visiva alla fonte diminuisce. ToolAcre sceglie un sottoinsieme semantico vincolato e mostra l'origine filtrata.

La modifica si sposta nella pagina: spiega come contenteditable ha portato WYSIWYG nei browser e nelle piattaforme CMS

Contenteditable del browser ha spostato l'host di modifica in un normale elemento di pagina. Il browser può gestire i segni di accento circonflesso, le selezioni, la digitazione e la cancellazione mentre il codice dell'applicazione fornisce controlli e legge innerHTML. ToolAcre segue quel modello e attualmente invia le azioni della barra degli strumenti tramite execCommand deprecato.

L'applicazione aggiunge quindi limiti che l'host di modifica nativo non fornisce: intercettazione incolla, pulizia della fonte, rapporto di rimozione, conteggio di caratteri e parole, estrazione di testo normale, copia, download e un'anteprima inerte. Questa stratificazione spiega perché contenteditable da solo non è un prodotto completo.

Il movimento contrario favorisce fonti vincolate e editing strutturato, senza una sequenza temporale del prodotto di origine

Il markup leggero e gli editor strutturati rispondono allo stesso problema relativo alla qualità dell'output in modo diverso. Limitano ciò che gli autori possono esprimere o archiviare, quindi restituiscono un risultato controllato. Il libro di esercizi richiede un contromovimento storico, ma nessuna fonte qui supporta una data, una richiesta di adozione o una sequenza causale denominata.

Il paragone utile è architettonico. Una fonte vincolata può essere facile da differenziare e trasformare, mentre una superficie visiva abbassa la barriera alla formattazione. ToolAcre combina il disegno visivo con HTML visibile, ma non offre collaborazione, un modello di documento o comandi deterministici tra browser.

Ciò che questo non copre: una sequenza temporale prodotto per prodotto o il desktop publishing che va oltre la sua influenza sul web

Questo articolo non fornisce una cronologia prodotto per prodotto, non attribuisce credito a un'invenzione, non cita ricercatori né tratta il desktop publishing al di là di un'ampia influenza. Tali omissioni sono intenzionali perché non sono state fornite fonti d'archivio. L'implementazione dell'editor può verificare il comportamento attuale, non la priorità storica.

Inoltre, non sostiene che gli editor visivi producano necessariamente un markup errato. La qualità dell'output dipende dal modello e dalla policy di editing. Qui, gli alias e le liste consentite riducono la variazione dopo la mutazione del browser, mentre la modalità sorgente consente allo scrittore di rivedere ciò che rimane. Altri redattori possono scegliere strutture diverse.

Conclusione: la vecchia tensione è ancora il problema di progettazione: riassume la comodità visiva rispetto all'output pulito e come l'editor HTML WYSIWYG di ToolAcre risolve il problema consentendoti di vedere il markup prodotto dalle tue modifiche

La vecchia tensione sopravvive: il controllo visivo diretto aiuta gli autori, mentre l'output strutturato e duraturo aiuta i sistemi e i futuri manutentori. Un editor credibile rende visibile la traduzione e ammette dove il rendering dipende dal browser e dal contesto di destinazione.

ToolAcre è un piccolo esempio contemporaneo. Formatta una nota usa e getta, esamina il HTML filtrato e confronta l'anteprima con la fonte. L'esercizio dimostra il lignaggio senza trasformare un profilo storico privo di fonti in falsa precisione o affermare che questa implementazione risolve ogni compromesso WYSIWYG.