HTML_Generator
| 9.4.2009 | HTML_Generator |
|
|
|
TPL2HTML - Mein kleiner Homepage-Generator für Linux und WindowsDamit ist diese Homepage gemacht, die Sie jetzt gerade im Browser haben. Man ist etwas eingeschränkt in der Gestaltung, aber dafür geht das Schreiben und Einbauen sehr schön schnell, und man kann sich auf das Wesentliche konzentrieren. Ich habe ihn mir geschrieben, weil ich auf meinen Seiten relativ oft Änderungen oder Ergänzungen einbaue, und weil ich die verfügbaren HTML-Editoren nicht mag. Entweder sind sie nur für Windows, oder sie laufen nicht stabil, oder sie kosten mich zuviel Zeit mit Herumklicken. Außerdem erzeugen die meisten ein schreckliches HTML voller Fehler. ("tpl" steht für "Template", das heißt "Schablone" oder "Vorlage", weil vom Generator aus gesehen die tpl-Dateien die Vorlagen sind für die späteren HTML-Dateien.) Der Quelltext dieser Seite (die .tpl-Datei) heißt hier "tpl2.tpl.txt", damit sie vom Browser ohne Probleme angezeigt wird. Außerdem ist sie nicht ganz aktuell, aber man sieht, wie es geht: tpl2.tpl.txt Im Browser stören natürlich die überlangen Zeilen ganz enorm, aber im Texteditor gibt es "weichen Zeilenumbruch" (z.B. in gnp oder in notepad.exe), damit ist das Editieren kein Problem.
Download für Linux und WindowsDer Website-Generator ist geschrieben in Pascal, kompiliert mit "Free Pascal": http://www.freepascal.org/ Im Tarball enthalten sind die Quelltexte, sowie Executables für Linux und Windows. Dokumentation gibt es noch keine. Diese Seite hier, das ist zur Zeit die einzige Dokumentation.
Hinweis für Windows-User:Die Beispieldateien (*.tpl, *.cfg, *.html) sind unter Linux geschrieben und haben am Zeilenende nur ein Linefeed-Zeichen. Texteditoren unter Windows erwarten aber die Kombination Carriage-Return und Linefeed. Man kann die Dateien mit "Word" öffnen und wieder "als Text" abspeichern. Dann stimmen die Zeilenenden.
Man legt folgende Verzeichnisse und Dateien anMan hat für jedes HTML-Projekt (d.h. für jede Homepage, die natürlich meistens aus mehreren Seiten besteht) ein Verzeichnis (Ordner). (Der Ordner für das Projekt "HTML-Generator" heißt "tpl2html2".) Darin gibt es ein Verzeichnis "tpl" für die Inhalte, ein Verzeichnis "pix" für Bilder und Downloaddateien, und ein (leeres) Verzeichnis "html". Außerdem hat man eine Konfigurationsdatei für das Projekt:
Das Executable ("tpl2html-2" bzw. "tpl2html-2.exe") tut man in ein Verzeichnis, das im "Suchpfad" liegt, z.B. in /usr/local/bin bzw. c:\windows oder man kann es auch im Projektverzeichnis lassen. Die Konfigurationsdatei eines ProjektesDie Konfigurationsdatei (tpl2html-2.cfg) enthält die Struktur der Homepage (das ist die Navigationsleiste auf der linken Seite), die Farben, Schriftarten, Schriftgrößen, Hintergrundbilder, den Seitenkopf und den Seitenfuß. Dadurch sind die drei Teile oben, links und unten festgelegt. Für den Hauptteil jeder Seite hat man eine eigene Datei mit Inhalt (*.tpl). Die Konfigurationsdatei für diese Homepage heißt hier "tpl2html-2.cfg.txt", damit der Browser sie anzeigt: tpl2html-2.cfg.txt Verwirrend sind vermutlich die Style-Header am Anfang. Ich habe im Augenblick keine Zeit, das anders zu lösen. Die Links auf die Seiten der alten Homepage, "Archiv..." sind zwar in der Konfigurationsdatei, aber es gibt keine tpl-Dateien dafür. Die Seiten habe ich damals noch direkt in HTML geschrieben. Jedes Feld, Navigationsleiste, Seitenkopf, Seitenfuß, Hauptteil kann eine Hintergrundfarbe und ein Hintergrundbild haben. Die Abgrenzungslinien werden aus kleinen Bildern gemacht, man ist also frei in der Gestaltung der Linien. Die drei Felder Navigationsleiste, Seitenkopf und Seitenfuß können auch ganz abgewählt werden, mit "navmode=off", "topmode=off", "bottommode=off". Seitenkopf und -fuß bestehen aus drei Feldern, links, mitte, rechts, die entweder aus Text (mit oder ohne Links), aus einem Bild, aus einem Leerstring oder aus einem Schlüsselwort bestehen können:
Die Option "autoanch=" bewirkt, daß alle HTML-Elemente eines bestimmten Typs (bei mir z.B. "h4") oben, am Anfang des Hauptteils noch einmal eingefügt werden, und zwar als Liste von Links auf sich selbst ("Anchor"). Der Generator funktioniert folgendermaßen===> Man wechselt in das Directory, wo sich die Konfigurationsdatei des Projekts befindet. Wenn man ihn aufruft oder doppelklickt, macht er aus jeder Datei *.tpl eine HTML-Datei in "html", und er kopiert den Inhalt des Verzeichnisses "pix" nach "html". Den Inhalt von "html" kann man dann zum Provider hochladen. Wenn ich damit arbeite, habe ich vier Fenster offen: Browser, Texteditor, Shell (Eingabeaufforderung), Filebrowser (Explorer). Eine Änderung geht dann so:
So sieht es aus: Homepage bearbeiten Die Dateien mit den Inhalten (*.tpl)Die .tpl-Dateien bestehen aus Zeilen. Das Token (Kennzeichen) am Anfang der Zeile entscheidet, was für ein HTML-Element aus der Zeile gemacht wird:
"Eine Zeile --> ein HTML-Element", das bedeutet:
(Im Generator sind auch Formulare drin, aber die zu beschreiben ist mir jetzt zu kompliziert, schau bitte im Quelltext nach: uhtmltpl.pas. Sie machen auch eigentlich nur Sinn, wenn man CGIs schreibt, aber das ist ein anderes Projekt, siehe z.B. sqaf.html ) Bilder und LinksBilder werden einfach als Dateinamen geschrieben, .jpg, .jpeg, .gif und .png werden akzeptiert. Das kleine Bild von den Verzeichnissen oben ist z.B. so geschrieben: "tpl2html2-1.png" (aber ohne Anführungsstriche). Links werden mit "@" geschrieben, oder müssen mit "http://" beginnen. Erst der Text, dann das Ziel. Es reicht auch, nur das Ziel anzugeben. Dies hier wäre z.B. ein Link: "http://www.abatz.de/", wenn man es ohne Anführungsstriche schreibt. Dies hier wäre ein Link zu einer anderen Seite dieser Homepage: "@index.html". Dies ist ein Link zu einer Download-Datei: "@tpl2html2-0.1.tgz". Dies ist ein Link mit anderem Text: "@hier klicken@http://www.abatz.de/" (zwischen "hier" und "klicken" sind in der tpl-Datei dieser Seite zwei Unterstriche, aber die sieht man hier nicht mehr, und das ist Absicht, siehe nächster Absatz). Das Programm orientiert sich an den Leerzeichen im Text. Deshalb dürfen innerhalb von Links und Dateinamen keine Leerzeichen stehen, und vorn und hinten dürfen keine Satzzeichen stehen (das ist SEHR gewöhnungsbedürftig). Wenn man unbedingt Leerzeichen im Text eines Links haben will, muß man anstelle jedes Leerzeichens zwei Unterstriche machen. Zwei Unterstriche werden zu einem "No-Break-Space". Zeichenfolgen im Text, die in etwas anderes übersetzt werden
Wie wichtig ist "gültiges HTML"?Es ist umso wichtiger, je kleiner und je unbekannter eine Homepage ist. "Gültiges HTML" bedeutet, daß die Regeln eingehalten werden, die in den von w3.org empfohlenen Spezifikationen stehen, z.B. hier: http://www.w3.org/TR/html401/ Ein normaler Browser akzeptiert auch ungültiges HTML. Er versucht zu raten, was wohl gemeint war, und so stellt er es dann dar. Die verschiedenen Browser verhalten sich beim Raten nicht genau gleich. Je größer die Abweichungen vom Standard sind, umso verschiedener werden die verschiedenen Browser die Seite anzeigen. Die Webseiten von großen Firmen und bekannte Zeitungen enthalten meistens mehr oder weniger zahlreiche Abweichungen vom Standard. Die User besuchen ihre Seiten - wegen des bekannten Namens - trotz fehlerhafter Webseiten. Den Luxus kann ich mir nicht leisten. Ich freue mich schon, wenn im Schnitt 200 Besucher pro Tag kommen. Die möchte ich nicht verscheuchen, z.B. mit weißen Seiten, nicht existierenden Bildern, verrutschtem Layout, Fehlermeldungen, usw. Nach meiner ganz persönlichen Theorie könnten die Sicherheitslöcher in Mozilla und Internet Explorer zu einem gewissen Teil auch daher kommen, daß die Programmierer immer darauf achten müssen, daß auch fehlerhaftes HTML noch irgendwie angezeigt wird. Wenn es ihnen erlaubt wäre, z.B. fehlerhafte HTML-Tags einfach zu ignorieren und gar nicht darzustellen, wären die Algorithmen wahrscheinlich viel unkomplizierter und es würden sich weniger Programmierfehler einschleichen. (Dann würde von den meisten großen Websites im Browser wohl nicht viel übrig bleiben.) Beispiele für HTML-Seiten mit und ohne FehlerIch habe die folgenden URLs nur mal so aus Spaß eingegeben in: http://validator.w3.org/ Die Seiten sollen hier nicht inhaltlich bewertet werden, sondern nur zeigen, daß es zahlreiche fehlerhafte, aber auch zahlreiche fehlerfreie Seiten gibt. Außerdem soll an den Beispielen gezeigt werden, daß fehlerhaftes HTML für eine ansprechende Gestaltung weder notwendig noch hinreichend ist.
Beispielseiten ohne HTML-Fehler:
Fehler- und Wunschliste |
| abatz.de | Jörn Abatz - Technische Software | Impressum |
