Strumenti per sviluppatori · HTML WYSIWYG editor
Dai tag <font> a CSS: come la formattazione web è stata spostata dal markup
· Sfondo
html css pulizia del testo
Racconta come gli attributi di presentazione HTML come font, center e align hanno lasciato il posto a CSS e perché quella storia spiega l'odierno dibattito in stile inline tra gli editori.
Presentazionale HTML nelle pagine più vecchie: qui non viene fornita alcuna dichiarazione sulla data
I frammenti di pagina più vecchi spesso esprimono l'aspetto direttamente attraverso elementi come font e center o attributi come bgcolor e align. La cartella di lavoro allega una cronologia della metà degli anni '90, ma nessuna fonte di archivio verifica tali date. L'implementazione può solo dimostrare come questo editor tratta oggi tale markup.
ToolAcre non consente il carattere o il centro e non preserva gli attributi della presentazione. I normali wrapper non supportati vengono scartati, quindi le loro parole visibili potrebbero sopravvivere mentre le istruzioni di formattazione scompaiono. Quel risultato è una bozza ripulita, non un restauro fedele di una pagina legacy.
font, center e bgcolor: presentazione nei tag: descrive gli elementi e gli attributi aggiunti dai browser per l'aspetto
Quando la presentazione vive di tag e attributi, il contenuto e il design diventano difficili da modificare in modo indipendente. Una scelta di colore ripetuta negli articoli deve essere modificata in ogni frammento e un'intestazione centrata non ha alcun significato strutturale intrinseco. La copia di tali costrutti importa anche i presupposti da un layout obsoleto.
Il markup semantico nomina ruoli come intestazione, paragrafo, elenco e citazione. Il foglio di stile di destinazione può presentare tutte le occorrenze in modo coerente. ToolAcre supporta quel vocabolario più piccolo e rimuove anche classe e stile, lasciando il sistema ricevente responsabile del proprio livello di presentazione.
CSS separa la struttura dalla presentazione; le date degli standard sono esterne alle prove del repository
CSS fornisce selettori e dichiarazioni separate dall'albero del contenuto. Questa divisione architettonica consente a una modifica di progettazione di influenzare molti documenti senza riscrivere ciascun corpo. Questo articolo non inventa una data di prima raccomandazione o una sequenza di standard perché tali affermazioni storiche richiedono specifiche esterne.
La regola pratica rimane verificabile: i frammenti copiati da ToolAcre non contengono attributi di stile o nomi di classi. Il documento completo scaricato include il foglio di stile wrapper di ToolAcre, ma CSS non è inserito nel frammento ripulito restituito da Copia HTML.
Gli elementi presentazionali sono al di fuori di questa lista consentita, senza una pretesa di cronologia degli standard di vita
Il libro di esercizi descrive la deprecazione e l'allontanamento da uno standard di vita. Questo modulo non ha un archivio di standard, quindi l'articolo si ferma alla politica attuale: gli elementi di presentazione non sono supportati e vengono scartati o rimossi in base alla loro categoria di rischio. Non fa alcuna pretesa di cronologia normativa.
Il verbale di allontanamento costituisce la prova utile. Incolla un tag di carattere attorno al testo e osserva che l'involucro viene rifiutato mentre le parole rimangono. Incolla un contenitore di stile pericoloso e il suo corpo viene rimosso intero, perché il contenuto di stile non elaborato può creare richieste e superfici di analisi oltre l'ambito di questo editor.
Gli stili in linea esistono altrove ma questo editor li rimuove
Lo stile in linea è un meccanismo di sintassi moderno, ma ToolAcre lo rifiuta completamente. Pertanto questo editor non può dimostrare un attributo di stile di "compromesso" sopravvissuto o consigliare una delle proprie modalità di output. L'unico stile autonomo viene visualizzato nel documento di anteprima generato attorno al corpo filtrato HTML.
Altri contesti, in particolare la produzione di posta elettronica, potrebbero richiedere dichiarazioni in linea. Tale requisito richiede una pipeline separata con test del client e policy CSS. Aggiungere uno stile arbitrario qui contraddirebbe l’attuale lista consentita e amplierebbe le responsabilità del disinfettante senza prove o test.
Esempio funzionante: modernizzazione di uno snippet degli anni '90: riscrive il markup del tag font come HTML semantico più una classe e confronta i due
Modernizza `<center><font color="red"><b>Maintenance</b></font></center><p align="left">Tonight</p>` scegliendo un'intestazione e un paragrafo reali. ToolAcre scarta la presentazione non supportata, mappa b su strong, rimuove align e mantiene p, ma non può dedurre che Maintenance dovrebbe essere h2.
Riscrivi il significato esplicitamente come `<h2>Maintenance</h2><p>Tonight</p>`, quindi aggiungi classi di destinazione approvate o regole del foglio di stile all'esterno dell'editor. Se all'interno di una frase si intende l'importanza, forte può essere adatto; se il grassetto fosse semplicemente il peso del carattere, non mantenere la semantica fuorviante.
Cosa non copre: dibattiti sulla metodologia CSS o stili specifici del framework
Questo articolo non mette a confronto metodologie, framework, classi di utilità o token di progettazione CSS. Non rivendica date storiche per font, CSS o transizioni di standard. Inoltre, non offre un convertitore automatizzato in grado di dedurre ruoli semantici dal markup legacy visivo.
Il filtraggio non è una prevenzione XSS universale. Il tokenizzatore scritto a mano di ToolAcre è limitato e la sua anteprima è inserita in un sandbox separato. Un server che accetta HTML legacy o generato dall'utente necessita di un disinfettante gestito basato su parser, test di migrazione e una lista consentita specifica per la destinazione.
Conclusione: scopri perché esiste la regola: riassume la cronologia e il modo in cui l'ispezione dell'output nell'editor HTML WYSIWYG di ToolAcre aiuta a mantenere la presentazione fuori dal markup
Scopri perché struttura e presentazione sono separate: il significato dovrebbe sopravvivere alla riprogettazione, mentre l'apparenza dovrebbe essere governata in modo coerente. ToolAcre impone questo confine in modo aggressivo rimuovendo sia la presentazione legacy che lo stile moderno in linea o basato su classi dai frammenti copiati.
Utilizza la vista di origine per identificare ciò che è andato perso, quindi ripristina manualmente la semantica e lo stile nella destinazione. Questo processo potrebbe non preservare il vecchio aspetto, ma produce contenuti che sono più facili da rivedere, migrare e adattare senza portare decisioni obsolete in ogni tema futuro.