Um InternetAuftritte wartbar zu halten muss man
Inhalt,
Struktur und
Layout trennen.
InhaltsManagementSysteme, neudeutsch: ContentManagementSysteme (CMS) sollen
das Werkzeug der Wahl sein, um diese Forderung zu erfüllen.
Zope oder
OpenCMS könnten hier als
Werkzeuge in Frage kommen. Beide sind freie Software (siehe im Bereich ->Links
->AnwendungsSoftware ->CMS).
Für kleinere, vor allem informationsorientierte InternetAuftritte, die
vorwiegend "dauerhafte" Texte anbieten - wie unsere Internetseiten zum
Beispiel - dürfte der damit verbundene Einstiegs- und Wartungsaufwand für das
Werkzeug selbst den zu erzielenden Wartungsgewinn beim Inhalt selbst bei
weitem überschreiten. Ich verweise hier auf einen Artikel in der
iX 4/2003/88-91, dessen Studium einen sicher vor einer Fehlinvestition an
Zeit und Mühe bewahren kann.
Die Erstellung unserer Seiten berücksichtigt die oben zitierte, grundsätzliche
Forderung und trennt Inhalt, Struktur und Layout auf eine sehr einfache,
übersichtliche und wartungsfreundliche Art:
Das Layout ist ausgelagert in CSS-Dateien
(Cascading Style Sheets) - wie bei Inhaltsmanagmentsystemen.
Dies ermöglicht gleichzeitig durch mehrere, strukturgleiche StyleSheets mit
lediglich unterschiedlichen Werten die Eigenheiten der Browser und die
unterschiedlichen Darstellungsbedingungen so zu berücksichtigen, dass ein
immer gleiches Layout erreicht wird.
Das Layout ist funktional. Da es sich auf unserem
Server vor allem um Textdarstellungen handelt sind von besonderer Bedeutung:
die Größe der Schrift und der Schrifttyp (Lesbarkeit, Textfunktion
(Themen/Schlagwort/Inhaltsverzeichnis oder eigentlicher Text)
Einrückungen
Durchschuss (Zeilenabstand)
Die Struktur der Seiten ist in Seitenvorlagen
(Templates) vorgegeben - wie bei Inhaltsmanagmentsystemen.
Die Inhalte sind aber nicht - im Unterschied zum
Vorgehen bei Inhaltsmanagmentsystemen - in einer eigenen Datei oder
Datenbank hinterlegt.
Die Inhalte liegen in ganz normalen HTML-Seiten. Die Erstellung dieser
Seiten setzt auf den Seitenvorlagen auf. Der Inhalt wird in die vorgegebene
Struktur eingesetzt. Aber: Der Inhalt und die strukturierenden Tags sind
klar voneinander getrennt und zwar dreifach, nämlich durch Leerzeilen, durch
Einrückung und durch unterschiedliche Farbgebung (Text schwarz und damit
hervortretend).
Die zugrunde gelegte Seitenvorlage läßt sich im laufenden Editionsbetrieb
durch Tastendruck erweitern. Für alle Strukturelemete gibt es Mini-Scripts,
die beim Start des Editors an eine Taste gebunden werden. Ein Tastendruck
setzt das komplette Strukturelement ein und positioniert die Schreibmarke
an die Stelle, an der der neue Text beginnen muss.
Der scheinbar einzige Nachteil: Will man bei Änderungen an der Struktur
alle Dateien konsistent halten, muss man alle bereits vorhandenen Seiten
ändern. Dies ist aber kein Problem, da es relativ einfach zu bedienende
Werkzeuge gibt, die - über alle Dateien hinweg - die notwendigen Änderungen
(halb-)automatisiert erledigen. Die Veränderung vom Seitenvorlagen führt aber
nach den Ausführungen des oben erwähnten Artikel in der iX auch in
ContentManagementSystemen zu entsprechenden Anpassungsproblemen.
Wir erstellen also unsere Internetseiten schnell und einfach durch eine klare
Standardisierung und durch "Vorfertigung". In unserem Lager liegen Muster für
die verschiedenen Typen von Seitenkonstrukten, die man als Vorlage benutzen
kann:
Wir haben dabei folgende Ziele realisiert:
Gute Lesbarkeit
Schnelle Orientierung für den Betrachter
Schnelle Erstellung
Dies haben wir erreicht durch folgende Gegebenheiten:
Gute Lesbarkeit
Unter allen - uns bekannten - Bedingungen sehen unsere InternetSeiten
gleich aus. Auch auf neue Bedingungen können wir reagieren, ohne unsere
Seiten selbst ändern zu müssen.
Es gibt nichts Überflüssiges.
Alles hat eine Funktion: Farbe, Schrifttype, Schriftgröße,
Einrückung, Durchschuss (Abstand zwischen den Textzeilen).
Durch die völlig unkomplizierte Kontrolle über den Quelltext und
standardisierte Tags können individuelle Anpassungen an nicht
Standardsituationen in Sekunden erfolgen.
Schnelle Orientierung
Die Struktur unserer Seiten ist einfach, übersichtlich und überall
identisch:
im Kopf die Auswahlleiste für den Bereich xyz (Dateiname: "0xyz-bereich.htm")
in der linken Spalte oben die Wahl der Ebenen - nach oben und (selten)
weiter nach unten (Dateiname: "0xyz-ebenen.htm")
in der linken Spalte unten dann entweder die Wahl
-
eines Themas (Normale Bereiche) (Dateiname: "0xyz-themen.htm"),
-
eines Schlagworts (Informationssammlungen) (Dateiname: "0xyz-ihv.htm")
oder
-
eines Kapitels/Abschnitts in einem Buch (Dateiname: "0xyz-ihv.htm").
Schnelle Erstellung
Für alle Seitentypen und Konstrukte gibt fertige Vorlagen
Alle zusätzlichen Tags und Tagkonstrukte, die benötigt werden, liegen auf
Tasten
Der Text ist von den strukturienden Tags getrennt.
Die Tags und ihre Elemente werden farbig dargestellt, der Text ist
schwarz. Die Farben sind so gewählt, dass die
Elemente sofort erkennbar sind, die das Aussehen des Textes bestimmen.
Eine Bild finden Sie unten. Die Farben können Sie bei Bedarf ändern.
Alle Seiten bestehen identisch aus vier Teilen:
--------------------------------------------------------
| Bereichswahl (0xyz-bereich.htm) |
|______________________________________________________|
| | |
| | Themenfenster |
| | |
| Ebenenwahl | |
| (0xyz-ebenen.htm) | |
| | |
|___________________| |
| | |
| | |
| | |
| Themenwahl | |
| (0xyz-themen.htm) | |
| | |
| Schlagwortwahl | |
| (0xyz-ihv.htm) | |
| | |
| Kapitelwahl | |
| (0xyz-ihv.htm) | |
| | |
--------------------------------------------------------
Die Teile werden durch Frames erstellt. Es gibt drei Arten von Frame-Dateien:
"1xyz-index.htm" gibt es nur einmal je Bereich und erstellt ein Frame mit
leerem Textfeld und auch mit leerem Themenfeld, wenn es Unterbereiche gibt.
"2xyz-unterbereich-index.htm" erstellt das Frame mit dem Themenfeld des
gewählten Unterbereichs. (Kommt zur Zeit nur im Bereich "Wissen" vor.)
"3xyz-index-thema.htm" erstellt ein Frame und führt direkt zu einem bestimmten
Thema im Textbereich.
Die Struktur aller Frame-Dateien (mit Ausnahme der der Leitseite) ist
absolut identisch. Nur die Werte sind unterschiedlich.
Wir erstellen unsere HTML-Seiten mit Emacs. In dem Beitrag "HTML-Seiten -
Überall identisch dargestellt" (auch in diesem Bereich) haben wir gezeigt,
dass alle HTML-Tags von uns definiert sind und durch die css-Dateien eine
einheitliche Darstellung unter allen bisher bekannten Bedingungen möglich
ist.
Das Seitenlayout, die Grundstruktur einer Seite, gibt es "lagermäßig" fertig und
die einzelnen von uns definierten Tag-Konstrukte liegen auf Tasten. Dadurch ist
es möglich, HTML-Seiten blitzschnell zu erzeugen.
Emacs arbeitet bei uns im rudimentaren Version von html-helper-mode.el, in dem
wir nur festgelegt haben, wie unsere Tags farbig aussehen sollen. Die
Tag-Konstrukte selbst haben wir in der .emcas-Startup-Datei hinterlegt,
damit diese leicht editiert werden können.
Die Farbunterstützung selbst erfolgt durch hilit19.el. Auch in diesem
Emacsprogramm haben wir Zeilen ergänzt, was sehr einfach war. Dadurch werden
die verschiedenen Elemente farbig wiedergegeben. Das sieht so aus
Ein neuer Eintrag einer Internetadresse auf dieser Seite erfordert nur einen
Tastendruck, wenn man zuvor die Internetadresse im Kopf einer aktuellen
Browserseite markiert und mit Ctrl-C abgegriffen hat. Zum Beispiel
"www.neue-adresse.de" erzeugt:
<A HREF="http://www.neue-adresse.de" TARGET="_top">
.
(www.neue-adresse.de)</A>
Und der Cursor steht am Anfang der leeren Zeile (siehe Punkt), damit Sie dort
die gewünschte Bezeichnung der Internetseite eintragen können. Alle
Einrückungen sind immer schon vorgegeben. Der Text ist natürlich farbig wie
im obigen Bild.
Genauso wird ein eingerückter Text unter diesem Eintrag oder innerhalb eines
ganz normalen Textes mit einen Tastendruck erzeugt:
<DIV CLASS=Text1>
<DIV CLASS=Durchschuss2> </DIV>
.
</DIV>
Der Cursor, hier der kleine Punkt, steht genau an der Stelle, an der Sie den
Text einsetzen wollen.
Text und Tags sind also immer getrennt, durch Leerzeilen und durch Farbe.
Übersichtlicher gehts es wohl nicht mehr.
Und schneller auch nicht.
Und alle Seiten werden unter allen Browsern, Fenstergrößen und Betriebssystemen
- ohne jede Sichtkontrolle - in gleicher Form und ähnlicher Größe dargestellt.
Die EmacsStartupDatei ist fertig, kann aber leicht geändert werden, wenn neue
Wünsche wachwerden. Die Tastenbelegung, wie Sie in der EmacsStartupDatei
definiert ist, gibt es auch als Browserseite. Klicken Sie einmal auf "CSS
gleicht Browser aus". Dort finden Sie dann auch ein Link auf diese Seite.
Oder klicken Sie einfach hier:
CSS-Emacs-Tasten (neues Fenster)
Wenn Sie uns helfen wollen oder wenn Sie diese einfachen, aber wirkungsvollen
Möglichkeiten für sich selber nutzen wollen, schreiben Sie uns eine Email.
Wir korrespondieren dann und senden Ihnen alle Dateien, die Sie haben
möchten. Hier ist die EmailAdresse:
Hans-Josef Heck - hjh"@antispam at"mail.fsub.de
Nocheinmal zusammenfassend:
Die Erzeugung von HTML-Seiten geht so schnell,
weil es vorgefertigte Seitenstrukturen gibt, auch für verschiedene Zwecke, und
weil die selbstdefinierten HTML-Tag-Konstrukte mit einem Tastendruck in diese
Seiten eingesetzt werden können.
Die HTML-Seiten sind benutzerfreundlich, weil Text und Tags ganz deutlich
getrennt sind.
Für verschiedene Aufgaben, zum Beispiel die Übernahme eines Textes mit vielen
Abschnitten, gibt es kleine Emacsprogramme. So wird in diesem Beispiel die
"Durchsetzung" des Texts mit den Durchschuss-Tags auch wieder per
Tastendruck erledigt .
Wisiwig werden Sie auch nicht vermissen:
Zum einen, weil Sie wissen wie das Aussehen wird, was Sie gerade erzeugen.
"What you write is what you get."
Zum anderen liegt die Emacsseite auf Ihrer Browserseite und ein Klick auf
den Reload-Knopf zeigt Ihnen die gerade geschriebene Seite in Ihrem Lieblingsbrowser.
Emacsprogramme sind übrigens sehr leicht zu verstehen, weil die Emacsbefehle
normalverständliche Sprache sind. Sie sind nach dem benannt, was sie tun.
Ergänzende Hinweise bitte an:
Hans-Josef Heck - hjh"@antispam at"mail.fsub.de
