Beautifier für HTML-Code für ganze Site (Ordner samt Unterordnern) gesucht

Ich sehe keinen Vorteil gegenüber HTML. Es wäre ein riesiger Zusatzaufwand, Regeln zu definieren, wie DocBook-Elemente in HTML-Elemente umgewandelt werden sollen.
Wir sprechen über eine Website. Nicht über einzelne downloadbare Dokumente.

Wir können auch anders hier in der Debatte weiterkommen:

Wie setzt Du für eine Website ein Literaturverzeichnis (System Autor Jahr) um. Mitten im Text stehen also Linktexte wie "[Schmidt 2018]", unter dem Artikel steht die entsprechende Liste, die die bibliografischen Angaben (Linkziel) enthält.
Oder Du erstellst eine komplexe Datentabelle mit THEAD, TBODY, TFOOT und CAPTION.
 
Der Punkt war: Mit welchem Editor/Werkzeug/Verfahren komplexe Semantik in HTML umsetzen?
Ein Punkt ist da bsw. auch tabellarische Darstellungen, besonders in Bezug auch auf das Responsive.

Beispiel:
Eine Universität hat für ihr eingesetztes CMS einen "Table-Code-Generator" erstellt:
https://ianrmedia.unl.edu/responsive-table-generator-tool

Weiterführend bsw. eine Art universal angedachte Lösung:
https://zurb.com/playground/responsive-tables

Demo davon:
https://zurb.com/playground/projects/responsive-tables/

Vom Ding her wäre eine Erarbeitung eines Standards für euer CMS,
welche den Zulieferern entweder eine Art Vorlage stellt, die sie mit ihrem Content ausfüllen und einreichen,
oder aber "nur" Inhalte liefern und du setzt das ins Markup um.

Normalerweise ergibt sich das inhaltliche Markup, wenn und sobald der Content via CMS-Editor angelegt wird.
Es mutet an, dass bei eurem CMS diese Ebene fehlt und du das quasi manuell übernimmst.
Vermutlich wäre imo dort ein erster Ansatz zu überdenken / zu suchen.
Zusätzlich eine Import-Option von Daten via xml usw.
 
Eins kann ich nur sagen:
Word fasse ich nicht an. DW ist Dimensionen besser für den Zweck geeignet.

Dann nimm Libre Office oder sonst was. Aber ausgrechnet HTML selbst im Code zu stricken, ist schon grenzwertig. Vorallem, da du ja sonst eigentlich sehr auf GUI und UX stehst und ich dich richtig überreden musste, mal ein paar Zeilen im Terminal einzutippen.

Aber wenn es dir so Spaß macht, kannst du es natürlich gerne tun.
 
Wir sprechen über eine Website. Nicht über einzelne downloadbare Dokumente.
Siehst Du und auch das war mir nicht klar, dass "nur" die Webseite Ziel ist. Oft werden solche Dokumente ja weiter verarbeitet (eben z.B. als PDF oder Buch).
 
@Difool

Ja, für breite Tabellen fixierte Überschriften-Spalten bzw. -Zeilen ist 'ne feine Sache für die Nutzung auf kleinen Displays.

Steht schon auf der ToDo unseres Programmierers.
Vom Ding her wäre eine Erarbeitung eines Standards für euer CMS,
welche den Zulieferern entweder eine Art Vorlage stellt, die sie mit ihrem Content ausfüllen und einreichen,
oder aber "nur" Inhalte liefern und du setzt das ins Markup um.
Es gibt einen Standard. Dass unsere Autoren "Vorlagen" ausfüllen ist praxisfern. Sie liefern halt Kuddelmuddel-Word, RTF etc.

Ich zeichne das dann korrekt und konsistent aus.
 
Wie setzt Du für eine Website ein Literaturverzeichnis (System Autor Jahr) um. Mitten im Text stehen also Linktexte wie "[Schmidt 2018]", unter dem Artikel steht die entsprechende Liste, die die bibliografischen Angaben (Linkziel) enthält.
Oder Du erstellst eine komplexe Datentabelle mit THEAD, TBODY, TFOOT und CAPTION.
Beispiel (vereinfacht):
Eine Exportvorlage für bsw. Exel für die Inhaltersteller wird erarbeitet und angelegt, mit der bei Export alle benötigten Formatierungen für einen Import in das CMS gesetzt werden.
Exportierte Datei wird via Import-Funktion des CMS oder extern in das CMS importiert und in das bestehende Framework/CSS/HTML "geschubst".
 
Aber ausgrechnet HTML selbst im Code zu stricken, ist schon grenzwertig.
Vielleicht liegt Deine Verwunderung daran, dass Du Dreamweaver nicht kennst. Er bietet für genau die hier besprochenen Zwecke ein hervorragendes Interface. Stelle Dir das Arbeiten vor wie in einem Markdown-Editor mit zwei Editorspalten, die synchron sind.
Links mit Quelltext, die rechte so wie es später angezeigt wird. Dennoch kann in der rechten Seite editiert werden. Wie in der Notiz.app.
 
Eine Exportvorlage für bsw. Exel für die Inhaltersteller wird erarbeitet und angelegt, mit der bei Export alle benötigten Formatierungen für einen Import in das CMS gesetzt werden.
Excel fordere ich als Quellformat manchmal von den Autoren ein.

Aber vergiss die Idee mit der Disziplin, dass die Autren da selber passende Excel-Formatierungen vornehmen.

Wie auch immer:
Vielleicht habt ihr die Aufgabe "Komplexe Semantik in HTML" einfach nicht. Und sobald man sie nicht hat, reicht ja jedes Feld-Wald-Wiesen-CMS, klar.
 
Es gibt einen Standard. Dass unsere Autoren "Vorlagen" ausfüllen ist praxisfern. Sie liefern halt Kuddelmuddel-Word, RTF etc.
Ich zeichne das dann korrekt und konsistent aus.
Ah, ok – das hört sich nach individuellem Ringelreihen an.
Dann würde ich eher erstmal "reinen Text", Bilder und Sonstige Dateien für Artikel schlicht in Ordnern anfordern.
Das Layout gebt ihr oder du ja vor, oder nicht?

Aber vergiss die Idee mit der Disziplin, dass die Autren da selber passende Excel-Formatierungen vornehmen.
Nee, die müssten dann lediglich die von euch angelegte Exportfunktion in ihrem Exel auswählen,
mit der dann die .xml beim Exportieren für euer CMS formatiert würde.

So zumindest hatten wir es für eine Händlersuche-Datenbank für eine Website umgesetzt.
Der Programmierer hatte eine "xml-Export-Funktion" für Exel gestrickt, die in das Händlersuche-Tool integriert
und ich habe wiederum die Ausgabe davon in die Website und in das bestehende CSS-Layout gesetzt.
edit:
So können sogar die "unbedarften" schlicht selbst ihre damit exportierten Daten hochladen (importieren)
und peng wird aktualisiert nach bestehendem Layout.
 
Dann würde ich eher erstmal "reinen Text", Bilder und Sonstige Dateien für Artikel schlicht in Ordnern anfordern.
Die Autoren verwenden meistens Word/Libreoffice. Wir nehmen, was wir kriegen. In reinem TXT wäre es auch viel zu umständlich für die Autoren Semantik zu transportieren, wie z.B. Figcaption, Betonung, Überschriftenebene, etc.
 
Vielleicht liegt Deine Verwunderung daran, dass Du Dreamweaver nicht kennst. Er bietet für genau die hier besprochenen Zwecke ein hervorragendes Interface. Stelle Dir das Arbeiten vor wie in einem Markdown-Editor mit zwei Editorspalten, die synchron sind.
Links mit Quelltext, die rechte so wie es später angezeigt wird. Dennoch kann in der rechten Seite editiert werden. Wie in der Notiz.app.

Das ist mir schon klar. So funktionieren viele CMS-Editoren. Aber warum man dann unbedingt fremden HTML-Code prettifyen und dann lektorieren und dann auch noch manuell darin coden will, entzieht sich meinem Verständnis.

Du wirst deine Gründe für deinen workflow haben, ein Tool zum formatieren von HTML hast du nun, also passt es. Ich muss es ja Gott-sei-Dank nicht tun.
 
Zuletzt bearbeitet:
Aber warum man dann unbedingt fremden HTML-Code prettifyen und dann lekotirieren und dann auch noch manuell darin coden will, entzieht sich meinem Verständnis.
Das ist doch das Normalste von der Welt. Code aus verschiedenen Quellen wird auf einen einheitlichen Stand gebracht.
Komplexe Semantik wird im Code-Editor hinzugefügt. Einfache Semantik im visuellen Editor per Tastenkürzel (Beispiel: h2)

Die Gründe sind immer gleich: Leichteres Editieren, leichteres Debuggen.

Ich behaupte ja in keiner Weise, dass mein Workflow der beste ist. Ich bin neugierig darauf, ob es bessere gäbe, daher frage ich hier.

Siehe z.B. mein Posting #41

Vielleicht liest hier ja niemand mit, der solche Aufgaben umsetzt.
 
Das ist doch das Normalste von der Welt. Code aus verschiedenen Quellen wird auf einen einheitlichen Stand gebracht.

Ich kenne das von der Seite des Progammierens. Da sind viel eher Vorgaben zum coding sytle vorhanden, die dann genau solche Dinge umfassen, die du nun manuell selbst nachpflegst. Spaces vs. Tabs, Laufweite von Tabs, Einrückungen, Klammerebenen, Variablenschreibweise, Verwendung von Frameworks etc.

Anders formatierte Quelltexte werden oft gar nicht mehr akzeptiert, was im Grunde auch vollkommen verständlich ist. Da ist es in keinster Weise das "Normalste der Welt" das sich irgendein Maintainer hinsetzt und das manuell nacharbeitet.

Aber nochmal, wenn du es so willst, ist es doch für dich ok.

Ich würde eben jene Vorgaben für die Quellen machen und würde CMS nutzen, die HTML eben kapseln und die mit Plugins und Co erweiterbar sind. Programmieren in Type script, direkt in Javascript, node, php, alles ist was anderes, als HTML-Code manuell zu prettifyen und dann zu bearbeiten. Dabei meine ich jetzt nicht, das man auch templates für HTML / Frameworks dazu braucht und verfassen / anpassen muss. Aber Literaturverzeichnisse in HTML manuell machen, ist schon hardcore.
 
  • Gefällt mir
Reaktionen: wegus
@lisanet
Vorgaben für die wechselnden individuellen Autoren sind nicht möglich, das erwähnte ich ja.

Klar wäre es schön, wenn mein Editor siteweites Formatieren könnte. Aber das funktioniert ja nun mit Hilfe prettier.io sehr gut.

Ich kann mir bei komplexer Semantik (und nur darauf liegt die Betonung) nur schwer vorstellen, dass man das in ein GUI-CMS gießen will, weil es ein extrem großer Programmieraufwand wäre.

Hier argumentiere ich im Grunde wie Du zuvor bei Deinem Hohelied auf die Kommandozeile.

Im Quellcode bin ich flexibel und durch meine Eingabehilfe im Editor auch schnell.

Zum Literaturverzeichnis:
So hardcore ist das gar nicht.
Wir verwenden dafür eigene Elemente.

Heute abend schicke ich mal ein Beispiel.

Aber wie gesagt, ich würde gerne mal jemandem über die Schulter schauen, der Texte von anderen mit hinreichend komplexer Semantik in eine Website einfügt, inklusive Lektorat.

Im Grunde ist mein bisheriges Verfahren auch dem ähnlich was LaTeXer verwenden (ich weiß nur wenig über LaTeX).

Sie können jederzeit in den Quelltext um anspruchsvolleres Markup/Layout zu realisieren. Für Einfaches schreiben sie halt im visuellen Editor.
 
Nochmal zurück zum Thema "Kommandozeilenwerkzeug". Dir @lisanet
gebührt die Ehre, dass ich den Dingern jetzt aufgeschlossen gegenüberstehe. Das ist eigentlich der beste Effekt dieses Threads.

Welche komfortablen Wege gibt es bitte, ein Kommandowerkzeug inkl. Parametern zu starten?

Was empfehlt ihr da?

Und was denkt ihr, wäre bei einem Editor ohne Plugin für prettier.io, ein guter Weg?

Arbeite ihr dann mit dem in der Doku von prettier.io erwähnten onchange?

Dazu schrieb ich ja weiter oben, dass dann leider bei jedem Reformatieren durch prettier im Editor eine Meldung erschiene "Wurde extern modifiziert, soll neu geladen werden".
Oder kann man das irgendwie umgehen/anders lösen.

Insgesamt wäre es ja praktisch Aktionen an den Vorgang des Speicherns knüpfen zu können.

Falls jemand Lust hat, was dazu zu schreiben: gern.
 
Welche komfortablen Wege gibt es bitte, ein Kommandowerkzeug inkl. Parametern zu starten?

... sich selbst ein minimales Shellscirpt zu bauen, dass in den Pfad zu legen, Terminal aufrufen, eintippen fertig.

Das ist dann genau das, was ich beschrieben habe: die Vorteile des Shell-Scripting.

Wenn du immer den gleichen Pfad für prettier, dann reicht für ein Shellscript sogar sowas banales wie

Code:
#!/bin/zsh
npx prettier --write /pfad/zur/site

Das benennst du eindeutig in z.Bsp ptf um, machst es ausführbar (chmod a+x ptf), kopierst es in den Pfad (sudo cp ptf /usr/local/bin) und kannst dann banal das Terminal öffnen und eintippen: ptf und schon wird deine site "verschönert".

Sicherheitshalber vorher noch den Pfad sicherstellen mit sudo mkdir -p /usr/local/bin

Wenn du wissen willst, was die Befehle machen: Terminal öffnen und man chmod, man cp, man mkdir eingeben und lesen. Dann bist du gewapnet und musst nicht posten "... bei mir klappt das aber nicht", sondern kannst dir deine Eingabe und die Fehlermeldung selbst durchlesen und erkennst dann sicher, woran es lag.
 
  • Gefällt mir
Reaktionen: thulium
Dazu schrieb ich ja weiter oben, dass dann leider bei jedem Reformatieren durch prettier im Editor eine Meldung erschiene "Wurde extern modifiziert, soll neu geladen werden".
Oder kann man das irgendwie umgehen/anders lösen.

Das ist der Nachteil an GUI-Programmen. Die bedienen sich eben mit der Maus.

Manche GUI-Programme haben für einige ihrer Funktionen auch ein CLI-Schnittstelle, so dass man dann dieses Befehle in das Shellscript nach dem Verschönern mit rein packt, um die gewünschte Funktion im Programm zu bewirken.

Das ist ein weiterer Vorteil der CLI. Man kann sehr einfach mehrere Arbeitsschritte miteinander verbinden, speichern und wiederverwenden. Auch über verschiedene CLI-Tools und GUI-Tools (die eine CLI-Schnittstelle bieten) hinweg. Mit GUI-Terminologie würde man sowas "Makro-Recorder" oder "Automation" oder "Kurzbefehl" nennen.
 
Gerade versuche ich in einem anderen Projekt, welches aus PHP-Dateien besteht (HTML und PHP gemischt), diese über prettier zu formatieren.
Aber es gibt offenbar keinen integrierten Parser dafür.
https://prettier.io/docs/en/options.html

Es gibt ein Plugin:
https://github.com/prettier/plugin-php/blob/main/README.md

Leider bezeichnen es die Entwickler als unstable für gemischte Inhalte:
"Formatting of files that contain mixed PHP and HTML is still considered unstable - please see open issues with the tag "inline" for details."


Mist.
 
Zuletzt bearbeitet:
Manche GUI-Programme haben für einige ihrer Funktionen auch ein CLI-Schnittstelle, so dass man dann dieses Befehle in das Shellscript nach dem Verschönern mit rein packt, um die gewünschte Funktion im Programm zu bewirken.
Der Erinnerung nach sollte DW so eine Schnittstelle haben, dazu muss ich noch recherchieren.

Was ich seit 10 Jahren in DW benutze ist ein Java-Skript, welches Ersetzen-Aktionen ausführt, wenn ich ein Dokument speichere.
Da werden z.B. named entities durch UTF-8 character ersetzt, so ein Zeug. Normalisierung.
 
Zurück
Oben Unten