Webworking

Navigation mit Hilfe des Link-Tags

Einführung

Mit der Version 0.9.5 des Browsers Mozilla werden die Möglichkeiten aus dem HTML-Tag <link> einer etwas breiteren Öffentlichkeit deutlich; Bisher wurde dieser Tag von den bekannten Browsern Netscape, Internet Explorer und Mozilla nur in Bezug auf die Einbindung von Stylesheet-Dateien und der Dokumentdefinition genutzt. Lediglich die Browser iCab (Mac), Mosaic und der Textbrowser Lynx zeigten bisher weitere Attribute an.
Im Gegensatz zu iCab und Lynx unterstützt Mozilla jedoch alle definierten Attribute und nicht nur die, welche allgemeine Seiteinformationen enthalten. Dieser Artikel zeigt die Hintergründe und Anwendungsbeispiele für de Navigation mit <link>, oder genauer gesagt mit <link rel=“*“>.

Logische Dateibeziehungen mit <link rel=“*“>

Grundsätzlich dient <link rel=“*“> dazu, die logischen Beziehungen des aktuellen Dokumentes zu anderen Dokumenten und Objekten zu definieren. So kann definiert werden, welche Seiten zum selben Thema gehören, welche Seite als nächstes oder welche Seite zuvor aufgerufen werden sollte. Im Prinzip handelt es sich dabei um eine eigenständigen Navigation über mehrere Seiten hinweg, wie man sie normalerweise über normale Links anbietet.
Definiert werden somit Links

  • auf einen Index,
  • auf die erste und die letzte Seite,
  • auf die vorherige und die nächste Seite,
  • auf andere Kapitel,
  • auf allgemeine Seiten wie Copyright und Hilfe,
  • sowie diverse andere Seiten.

Mögliche Attribute

Die folgende Übersicht zeigt die vorhandenen Typen des Link-Attributes „rel“, mit dessen Hilfe eine Navigation möglich ist.

Typ Bedeutung
contents Beschreibt den Inhalt einer Datei
chapter Definiert ein Kapitel
section Definiert ein Abschnitt
subsection Definiert einen Unterabschnitt
appendix Definiert den Anhang
index Verweis zum Stichwort- oder Dateiverzeichnis
glossary Definiert den Glossar
copyright Angabe des Copyrights, bzw. eines Links dahin
next Nächste Seite
prev Vorherige Seite
last Letzte Seite
first oder start Erste Seite
up Verweist auf eine übergeordnete Seite. Zum Beispiel, wenn man in einem Unterabschnitt ist.
start (oder top) Wie „first“: Die erste Seite
help Verweist auf die Hilfe
bookmark Allgemeiner Lesezeichen
alternate Alternative Seite, z.B. bei anderen Sprachversionen, oder alten Versionen der selben Seite.

Jeder dieser Angaben muss zusätzlich verbunden werden mit der Angabe eines Inhaltes „content“ oder eines Verweises „href“. Wird „href“ benutzt, ist es möglich, zusätzlich den Attribut „title“ anzugeben, um das Ziel genauer zu bezeichnen.

Folgendermaßen kann dies aussehen:

<link rel="first" title="Alphabetischer Seitenindex" href="http://www.xwolf.de/toc.shtml">
<link rel="prev" title="Seitenindex" href="http://www.xwolf.de/seitenindex.shtml">
<link rel="next" title="Über XWolf" href="http://www.xwolf.de/xwolf.shtml">
<link rel="bookmark" href="http://www.xwolf.de/">
<link rel="copyright" href="http://www.xwolf.de/impressum.shtml">
<link rel="help" href="http://www.xwolf.de/xwolf.shtml">
<link rel="index" href="http://www.xwolf.de/seitenindex.shtml">
<link rel="made" href="mailto:webmaster@xwolf.de">
<link rel="search" href="http://www.xwolf.de/suchen.shtml">
<link rel="toc" href="http://www.xwolf.de/toc.shtml">

Eine genauere Beschreibung des <link>-Tags findet sich in dem HTML-Kompendium von Stefan Münz.
Eine Reihe von aufeinander aufbauenden Beispielen finden sich hier:

Warum das alles?

Wozu sollte man eigentlich diese Art der Navigation verwenden? Bisher kam man ja auch ganz gut ohne aus und wenn man ehrlich ist, ist die Hauptanwendung dieser Navigation in Seiten, die wie ein Buch oder ein Skript mit Kapiteln und Unterkapiteln geschrieben wurden.
Eine Antwort ist: Was nicht schlecht ist, macht ihre Webseite nur besser! Und nebenbei könnte man -wenn man mutig genug ist- die gesamte Sitenavigation über <link> machen.

Dynamische Linknavigation

Natürlich könnte man jetzt im Kopfteil jedes Webdokuments die <Link>-Tags manuell reintun. Aber wer mich kennt, weiß, daß ich gegenüber stupiden, wiederkehrenden Aufgaben gegenüber recht faul bin. Was liegt da näher, als ein Skript zu schreiben, welches die Tags automatisch und passend zur jeweiligen Seite dynamisch einsetzt?
Als Grundlage wird ja lediglich ein Index für die gesamte Website benötnigt, die alle Webseiten enthält und definiert, welche Seite innerhalb welchen Kontextes steht. (Wobei man damit auch ganz nebenbei gleich eine „Sitemap“ hat.)

Um es einfach zu halten, hab ich es erstmal in einer einfachen Textdatei gemacht, die ein recht simples Format besitzt:

...
0-A1-B1 Startseite XWolf Portal
0-A1-B1-URL http://www.xwolf.de/index.shtml
0-A1-B2 Neues auf XWolf
0-A1-B2-URL http://www.xwolf.de/news/index.shtml
0-A1-B2-C1 Archiv
0-A1-B2-C1-URL http://www.xwolf.de/news/archiv.shtml
0-A1-B3 Über XWolf
0-A1-B3-URL http://www.xwolf.de/xwolf.shtml
...

In der ersten Spalte wird die Hirachieebene des Dokumentes definiert. Danach folgt entweder ein „-URL“ zur Kenntzeichnung des Links, oder aber der Titel für die Seite. Die Bezeichnungen A1, B1, usw. sind dabei willkürlich gewählt. Ich trenne da nur nach dem Bindestrich. Ebenfalls irrelevant ist die Reihenfolge der Einträge, da später ohnehin nach dem Alphabet sortiert wird.

Diese Datei wird bei jeden Aufruf einer Seite eingelesen. Desweiteren wird aus dem Environment die aktuelle URL ermittelt. Somit weiß das Skript, auf welcher Seite man derzeit ist, und in welchem Kontext es innerhalb des Indizes steht.
Dies ist alles was braucht um die logische Nachbarbeziehungen zu erstellen: Welche Seite ist die nächste, welches ist die vorherige, innerhalb welcher Ebene befinden wir uns, usw.

Eingebunden wird das Skript wie folgt im Kopfteil:

<head>
    <title>XWolf CGI & Webworking: Navigation mit Hilfe des Link-Tags</title>
	<!--#include virtual="/cgi-bin/linknav.pl/head" -->
</head>

Der Skript selbst heißt linknav.pl. „/head“ ist ein Parameter, welches ich mit übergebe, um dem Skript mitzuteilen, es soll nur die Kopfteil-Informationen ausgeben.
Weitere Parameter sind „/index“ und „toc“, wobei ersteres den Seitenindex (Sitemap) generiert und letzteren den alphabetischen Index aller Seiten. Schauen Sie es sich mal an:

Wie man sieht, kann man die <Link>-Navigation sehr gut einsetzen, um seine Seiten zu strukturieren und eine alternative Navigation anzubieten.
Es bleibt jetzt nur noch zu hoffen, daß auch der MSIE diesen Tag endlich umsetzt. Anzeichen dafür sind bereits in der 5er und der 6er Version enthalten. Zeit werden würde es ja. Die <Link>-Navigation ist ein sehr alter Bestandteil von HTML. Man bedenke ja nur, daß selbst Mosaic diese Tags bereits rudimentär unterstützte.

Das Skript linknav.pl

Es handelt sich beim Skript um ein einfaches Perlskript, welches nur unwesentlich an die lokale Konfiguration angepasst werden muss: Es muß lediglich in der ersten Zeile der Perlpfad geändert werden, wenn diese bei Ihnen anderes lautet.
Etwaige Einstellungen werden in der Textdatei linknav.conf vorgenommen.

Durch die weitere Nutzung der Seite stimmst du der Verwendung von Cookies zu. Weitere Informationen

Die Cookie-Einstellungen auf dieser Website sind auf "Cookies zulassen" eingestellt, um das beste Surferlebnis zu ermöglichen. Wenn du diese Website ohne Änderung der Cookie-Einstellungen verwendest oder auf "Akzeptieren" klickst, erklärst du sich damit einverstanden.

Schließen