 |
|
|
|
|
|
|||||
|
|
 |
|||||||||
|
|
Startseite |
BeispielDas unten abgebildete Html-Dokument soll so zerlegt werden, dass alle Textblöcke, die für alle Dokumente der Web Site identisch sind, in Include-Dateien ausgelagert werden. Ferner soll derjenige Html-Code in Include-Dateienen ausgelagert werden, der das Layout der Seite festlegt, wie zum Beispiel Farben und/oder die Breitenangaben für die Spalten der Haupttabelle. (Web Site: alle zusammengehörenden Dokumente einer Homepage)
 Das Html-Dokument vor der Zerlegung Die Style-Sheet-Spezifikationen stellen sehr anschaulich dar, welch großen Vorteil das Auslagern von Layoutangaben in eine externe Datei bringt. Ändert man dort irgendein Attribut, so ist die Änderung sofort in allen Dokumenten vorhanden. Die Style-Sheet-Technik stellt sozusagen ein "dynamisches Include" dar, da der Browser beim Öffnen eines Html-Dokumentes die Style-Sheet-Datei mit einliest und auf das geladene Html-Dokument anwendet. Durch die unten gezeigte Technik kann die-Style-Sheet-Datei statisch in den Html-Code eingebunden werden. Dabei bleiben alle Vorteile der Style-Sheet- Technik erhalten. Es existiert nur eine einzige Datei mit Style-Angaben, diese werden jedoch zur Compilezeit statisch in den Html-Code der Ausgabedatei eingebunden.  Die Style Spezifikationen obigen Dokumentes werden in die Datei "styles.hinc" ausgelagert
 Datei: "meta.hinc"
Das Auslagern von Teilen der Meta-Discription könnte sinnvoll sein, falls die gleiche Web Site in verschiedenen Sprachen erscheint. In der Datei "colors.hinc" werden die Farben von Header, Footer, Navigationsleiste und Dokumenthintergrund zentral für alle Dokumente vordefiniert.
 Datei: "colors.hinc" Die folgende Datei "layout.hinc" enthält die Definition der Haupttabelle mit der Einteilung der Spalten in Navigationsleiste und Dokumentbereich.
 Datei: "layout.hinc" Da der Header jedes Dokumentes identisch ist, bietet es sich an, auch diesen zentral in eine Include-Datei auszulagern.  Datei: header.hinc Wer schon einmal umfangreichere Web Sites gepflegt hat, wird es sehr zu schätzen wissen, die gesamte Navigation zentral für alle Html-Dateien in einer Datei zu bearbeiten.
 Datei: "navigation.hinc" Der Dokumentteil kann sehr übersichtlich in einer Include-Datei gepflegt werden. Der gesamte Html-Overhead, sowie Header, Footer und Navigation stören nicht und können auch nicht versehentlich verändert werden.  Date: "....._doc.hinc", der eigentliche Textinhalt Normalerweise ist auch der Footer bei allen Dokumenten identisch, daher wird auch dieser in eine Include-Datei ausgelagert. Innerhalb des Footers kann auch folgendes Makro zur Aktualisierung des Datums verwendet werden: "<!--DATE-->". Überall dort, wo der Html-Compiler auf diese Text-Sequenz stößt, wird diese Zeichenkette durch das aktuelle Datum im Format "dd.mm.yyyy" ersetzt.
 Datei: "footer.hinc" Bei der Hauptdatei befinden sich überall dort, wo Textblöcke in Include-Dateien ausgelagert wurden, die "#include-Direktive"
 Die Hauptdatei Nach dem Compilieren befindet sich im Ausgabe-Bereich (Public) wieder die ursprüngliche Html-Datei.
Hauptdatei nach dem Compilieren. Die Vorteile dieser Vorgehensweise liegen klar auf der Hand: Die Textblöcke eines Html-Dokumentes, die bei allen Dokumenten einer Site gleich sind, werden in eine Include-Datei ausgelagert und können zentral für alle Dokumente gepflegt werden. Besonders vorteilhaft ist dies bei Farb- oder Layout- Definitionen oder auch bei der Navigationsleiste, die sonst beim Hinzufügen eines weiteren Dokumentes bei allen bisherigen Dokumenten nachbearbeitet werden müsste. Den Mehraufwand für die Aufspaltung in Haupt- und Include-Dateien kann man bei der Anwendung der Vorlagen-Technik auf eine einzige Datei beschränken. Er ist minimal für die dabei gewonnene Übersichtlichkeit und die drastisch verringerte Pflegezeit der Dokumente. So sieht das Beispiel im Browser aus:
|
||||||||
|
