Eine Seite für »Webmaster«

Allgemeines

Diese Seite ist für diejenigen Besucher von Interesse, die gerne näher erfahren möchten, wie die auf Atomic Eggs (Version 3.0 vom 27. August 2006 auf »www.atomic-eggs.com«) gezeigten Webseiten strukturiert sind. Nachfolgend werden Fragen zum Quelltext beantwortet, wird erklärt, wofür welcher JavaScript-Code eingesetzt wird, wie das »unmögliche Gästebuch« funktioniert, usw.

Wenn diese technische Erläuterungen Sie weniger interessieren, dürfen Sie getrost diese Seite überspringen! Auch erfordern die Erläuterungen ein Mindestmaß an Kenntnissen in den Webtechniken HTML, CSS, JavaScript, PERL und SSI. Wenn Sie gerade mit dem Erstellen von Webseiten angefangen haben, sind diese Erläuterungen möglicherweise etwas schwer verständlich. Auf ^SELFHTML finden Sie alles Notwendige, um Vertrauen in die Techniken des »Webpublishings« zu gewinnen und ihre Kenntnisse zu erweitern.

Wenn Sie in den genannten Techniken bereits erfolgreich sind, und Ihnen fällt für die eine oder andere, hier geschilderte Problemlösung eine bessere Herangehensweise ein, sind Sie herzlich eingeladen, Kontakt zu dem Autor aufzunehmen! Das Kontaktformular finden Sie am Ende des « Impressums.

Noch ein Hinweis: Diese Seite wurde »Eine Seite für ›Webmaster‹« genannt. Mit »Webmaster« sollen sich alle angesprochen fühlen, die mit Spaß an der Sache Webseiten erstellen oder gerne mit JavaScript und Perl experimentieren. Da die Bezeichnungen dafür wie »Webdesigner«, »Webautor« oder »Programmierer« mittlerweile alle »verwaschen« klingen oder nicht zutreffend genug sind, wurde absichtlich die »am Nichtssagendsten« gewählt!

^^^

Änderungen

Wenn in einem der folgenden Abschnitten Änderungen vorgenommen werden, werden diese hier dokumentiert. So können Sie nachvollziehen, was seit Ihrem letzten Besuch eventuell angepasst oder verbessert wurde.

^^^

Validität, Orthographie und Typographie

Als die ersten meiner »Seiten, die niemand braucht« entstanden sind, war es unter Webautoren kaum verbreitet, die Dokumente auf ihrer Standardkonformität zu überprüfen. Auch die Hersteller der damals üblichen Navigatoren Netscape 4.x und Internet Explorer 3 und 4 hielten sich kaum an die Vorgaben des ^W3-Konsortiums (W3C) und bauten eigene, so genannte »proprietäre« Anweisungen wie <layer>, <marquee> oder <blink> in ihre Programme ein. Die wenigen Autoren, die damals schon die Standardkonformität von Web-Dokumenten predigten, wurden sehr oft als unverbesserliche Puristen abgestempelt, welche die neuen, proprietären Möglichkeiten der Browser nicht zu schätzen wussten. Sie behielten jedoch recht.

In etwa zu Beginn des neuen Jahrtausends wendete sich das Blatt. Immer mehr Webpublisher gaben sich die für Anfänger oft anstrengende, von mir einst durch den Kakao gezogene ^Mühe, ihre Webseiten »validieren« zu lassen. Denn auch wenn die Standardkonformität kein absoluter Garant dafür ist, dass die Webseiten in jedem Browser hundertprozentig gleich aussehen, überwiegen die Vorteile. Die bösesten Überraschungen bei der Darstellung in den verschiedenen Navigatoren können somit jedenfalls vermieden werden.

Außer der Startseite (Variante »transitional«) sind alle Seiten der Ihnen vorliegenden, neuen Atomic Eggs-Version ^valide HTML 4.01-Dokumente in der Variante »strict«.

Schreiben, »wie mir die Feder gewachsen ist« lasse ich mir zwar nicht nehmen, dennoch wird bei der Redaktion der Texte auf korrekte Rechtschreibung geachtet. Vor deren Veröffentlichung werden alle Texte durch die Rechtschreibprüfung eines Textverarbeitungsprogramms »gejagt«, wodurch die größten Tippfehler schon mal auffallen und korrigiert werden können. Eine Grammatikprüfung findet ebenfalls statt, wenn auch die Treffsicherheit in den meisten Programmen sehr eingeschränkt ist – was sicher mit den vielen verschiedenen Grammatik-Regeln zusammenhängt.

Schließlich ist diese neue Atomic Eggs-Version auch der Versuch, durchgehend einige typographischen Regeln zu beachten. So wurden die auf jeder Computertastatur vorhandenen, eigentlich lediglich für Programmcode reservierten Anführungszeichen " vermieden und dafür »deutsche Guillemets« als Zitatszeichen gewählt. Auch der Gedankenstrich wird so dargestellt, dass er sich vom einfachen Bindestrich unterscheidet – wie sie hier sehen! Die Tipps wurden der Seite ^Typographie für Webautoren von Christoph Päper entnommen.

Da Autoren aber auch nur Menschen sind, und mir ein Korrekturleser (am liebsten wäre mir eine Korrekturleserin) nicht zur Verfügung steht, ist es durchaus möglich, dass hier und dort noch ein Fehlerchen auf seine Entdeckung wartet! Wenn Sie also bemerken, dass auf www.atomic-eggs.com eine Seite:

würde ich mich sehr über eine entsprechende Meldung über das « Kontaktformular freuen!

^^^

Zugang für alle!

Im WWW werden in erster Linie Informationen publiziert, auf welche die Internet-Besucher beispielsweise nach einer Suchmaschinen-Suche zugreifen können, wenn sie es wollen. Das bedeutet aber auch, sie sollten darauf zugreifen können, wann immer sie darauf zugreifen wollen. Aus diesem Grund sollte den Besuchern der Zugang zu den veröffentlichten Inhalten jederzeit möglich sein – und zwar unabhängig davon, welchen Navigator diese auf welchem Betriebssystem benutzen.

Alle Seiten der neuen Atomic Eggs-Version sehen sowohl mit als auch ohne JavaScript gleich aus (mit Ausnahme der « Toolleiste) und lassen sich im Bezug auf die Navigation auch gleich bedienen. Auch die Zusatzinformationen in den auf einigen Seiten vorkommenden °Eiboxen, die nur beim aktiviertem JavaScript aufgehen, bleiben Besuchern mit deaktiviertem JavaScript nicht vorenthalten: Diese zusätzlichen Inhalte werden dann auf einer serverseitig generierten Seite präsentiert.

Browser mit unzureichender CSS-Unterstützung werden – hier wird JavaScript vorausgesetzt – abgefangen und auf eine serverseitig generierte Seite mit dem selben Inhalt » umgeleitet: Dadurch, dass alle Seitentexte in einfache .txt-Dateien geschrieben werden, die sonst dank der Technik der » Server Side Includes « in die jeweilige Webseite eingebunden werden, greift das Perl-Script »oldies.pl« auf eben diese Textdateien zurück, um den Inhalt in einer etwas einfacheren, für alte Browser »verdaulichen« Form darzustellen: So sieht » diese Datei in dem für Oldies gedachten Layout aus.

Ohne CSS-Unterstützung, wie das beispielsweise bei Netscape 4.x der Fall ist, wenn JavaScript deaktiviert ist (die Umleitung auf die oldies.pl ist dann nicht möglich), sind die Seiten allerdings etwas unschön anzusehen, da die ansonsten fest positionierten Elemente einfach untereinander erscheinen. Es entsteht eine so genannte »Bildersuppe«. Aus diesem Grund sehen die Benutzer solch älterer Browser einen Hinweis zu Beginn jeder Seite. Im Hinweistext ermöglicht ein Link einen direkten Sprung zum tatsächlichen Inhalt und so die Bildersuppe zu überspringen: » diese Seite ohne CSS.

^^^

Server Side Includes

Alle Seiten der Domain »www.atomic-eggs.com« bedienen sich der Technik der ^Server Side Includes (SSI). Die Dateiendung aller »statischen« HTML-Dateien lautet daher .shtml. Zwar wäre es möglich gewesen, den Webserver anzuweisen, SSI auch in Dateien, die mit der Extension .html enden, zu interpretieren – diese Option wurde jedoch verworfen.

Am Quelltext der Ihnen vorliegenden Webseite können Sie nicht erkennen, dass diese SSI-Anweisungen enthält: Der Webserver liefert Ihrem Browser diese Seite genauso wie eine Seite, in welcher keine solchen Anweisungen notiert sind: Die SSI-Anweisungen werden bei Aufruf der Webseite interpretiert. Wenn Sie sich also über den Menüpunkt Ansicht/Quelltext den Source-Code dieser Seite anschauen, entdecken Sie lediglich HTML-Anweisungen und Text. Wie diese Datei cwi_3.shtml im Verzeichnis /cwi/ auf dem Webserver aussieht, sehen Sie anhand des in einer .txt-Datei kopierten » Codes.

Die erste SSI-Anweisung befindet sich in der Zeile 3:

Sie dient dazu, das Format für die Datumsausgabe zu definieren. Das in dieser Form angezeigte Datum wird im Meta-Tag <meta name="DC.Date" content="..."> eingetragen. Auf dieser Weise enthält dieses Meta-Tag immer das Datum der letzten Änderung der betroffenen Seite (last modified).

Gleich in der nächsten Zeile befindet sich die Anweisung für die Ausgabe des Programmes (Perl-Scripts), welches den größten Teil des Datei-Headers generiert: Der Titel, alle Meta-Tags und alle Navigationselemente <link rel="..." href="..."> werden so beim Aufruf der Datei serverseitig in den Quelltext hinein geschrieben (die Referenzierungen der CSS- und JavaScript-Dateien müssen aus Laufzeitgründen direkt in der Datei notiert werden – aber diese Angabe sind ohnehin in jeder Datei gleich). Die Zeilen 14, 26, 32, 36, 41 und 47 enthalten weitere SSI-Notierungen. Die letzte ruft wieder das Perl-Script auf, diesmal jedoch mit einem anderen Parameter, und bewirkt, dass die Copyright-Zeile mitsamt der Verlinkung der jeweils vorigen und nächsten Seite (rote und grüne »Leuchtdiode«) automatisch generiert wird. Alle diese Anweisungen helfen, den Arbeitsaufwand zu reduzieren, falls viele weitere Dateien hinzu kommen!

Somit sind wir bei dem Grund angelangt, warum diese Technik gewählt wurde: Neben einem geringeren Arbeitsaufwand ermöglichen Server Side Includes eine einfachere Strukturierung. Einmal angelegt, müssen in den .shtml-Dateien keine Änderungen vorgenommen werden. Alle Dateien einer Rubrik sind gleich und unterscheiden sich lediglich durch ihren Namen und durch den Namen der jeweiligen Textdateien in den entsprechenden SSI-Anweisungen! Kommt eine neue Datei hinzu (als umbenannte Kopie einer bereits bestehenden), muss nur noch die entsprechende Textdatei für den Inhalt geschrieben werden und im Perl-Script für Titel und Navigation den Namen der neuen Datei vermerkt werden!

^^^

Fortsetzung folgt...

...demnächst auf diesem Bildschirm! Nach und nach erscheinen auf dieser Seite weitere Erläuterungen!

^^^

« Sitemap