Datei-Beziehungen
Inhaltsübersicht:
- Einbinden von Layout-Dateien
- Einbinden von inhaltlichen Dokumenten-Relationen
- Einbinden von Newsfeed-Dateien
Einbinden von Layout-Dateien
Das Einbinden von Layout-Dateien
(siehe Cascading Style Sheets)
erfolgt über das <link>-Element. Mit dem
media-Attribut können verschiedenste Medientypen
angesprochen werden.
Beispiel XHTML-Datei (Ausschnitt):
<head>
[...]
<link rel="stylesheet"
type="text/css"
href="format.css"
media="all" />
[...]
</head>
Mögliche Angaben für das media-Attribut sind:
allfür alle Medientypen,auralfür computergesteuerte, synthetische Sprachausgabe,braillefür Ausgabegeräte mit Braille-Zeile,embossedfür Braille-Drucker,handheldfür die Anzeige auf tragbaren Kleinstcomputern,printfür den Ausdruck auf Papier,projectionfür die Datenprojektion mit Beamern,screenfür die Bildschirmanzeige,ttyfür nicht-grafische Ausgabemedien undtvfür Fernseher-ähnliche Ausgabegeräte.
In HTML5 entfällt das
type-Attribut. Hinzu kommen weitere Angaben für das media-Attribut,
sog. Media Queries, um je nach Bildschirmgröße
angepasste Formatzuweisungen anzubieten, z.B.
media="only screen and (min-device-width: 481px)".
Durch das Einbinden verschiedener Formatvorlagen können nutzergruppenorientierte Layouts bereitgestellt werden (siehe Individuelle Layouts für unterschiedliche Endgeräte).
Einbinden von inhaltlichen Dokumenten-Relationen
Über das <link>-Element können auch inhaltliche
Dokumenten-Relationen gesetzt werden und so jede Seite mit der Startseite
(rel="start"), einer übergeordneten
Ebene (rel="up") und inhaltlich
vorangegangenen (rel="prev") oder
nachfolgenden (rel="next") Seiten verbunden
werden. Weiterhin können bspw.
Beziehungen zum Inhaltsverzeichnis (rel="contents"),
verschiedenen Kapiteln (rel="chapter") oder
einem Index (rel="index"), einer Hilfe,
einer Suche, Angaben zum Autor oder Copyright
und anderen Versionen des Dokumentes festgehalten werden.
Beispiel XHTML-Datei - Dokumenten-Relationen (Ausschnitt):
<link rel="start"
href="index.html"
title="Startseite" />
<link rel="up"
href="kapitel.html"
title="Eine Ebene hoch" />
<link rel="prev"
href="unterkapitel-1-1.html"
title="Unterkapitel 1.1" />
<link rel="next"
href="unterkapitel-1-3.html"
title="Unterkapitel 1.3" />
<link rel="contents"
href="sitemap.html"
title="Inhaltsverzeichnis" />
<link rel="chapter"
href="kapitel-1.html"
title="Ausgewählt: Kapitel 1" />
<link rel="chapter"
href="kapitel-2.html"
title="Kapitel 2" />
<link rel="index"
href="stichwort.html"
title="Stichwortverzeichnis" />
Darstellung im Browser
Im Browser Mozilla kann die sog. Site-Navigationsleiste (engl. Personal Toolbar) aktiviert werden, im Browser Opera die sog. Navigationsleiste (engl. Navigation Bar), in der die vorgenannten Seitennavigationselemente angezeigt werden. Text-Browser zeigen diese Beziehungen am Anfang des Dokumentes an.
Bildbeschreibung "(Site-)Navigationsleiste im Mozilla und Opera": Bildschirmfoto der Navigationsleisten im Mozilla (oben) und Opera (unten).
Für ein barrierefreies bzw. barrierearmes Webdesign ist die Angabe von Dokumenten-Relationen eine Erweiterung der üblichen Navigation. Da diese Navigationsmöglichkeit jedoch nur wenige Browser unterstützen, müssen weiterhin herkömmliche und vor allem bekannte Navigationsmechanismen und -elemente angewendet und eingesetzt werden.
Einbinden von Newsfeed-Dateien
Auch Newsfeed-Dateien
werden als Metainformationen über das
<link>-Element eingebunden (siehe nachfolgendes
Beispiel).
Beispiel XHTML-Datei - Newsfeeds (Ausschnitt):
<link rel="alternate"
type="application/rss+xml"
href="www.die-barrierefreie-website.de/news.xml"
title="News als RSS-Feed" />
Die Anzeige von Newsfeed-Dateien wird jedoch von den aktuellen Browser-Umsetzungen unterschiedlich umgesetzt und unterstützt (siehe RSS-Feeds).
Weiterführende Literatur:
- Münz, Stefan
- Professionelle Websites. Programmierung, Design und
Administration von Webseiten,
Seite 888,
Addison-Wesley Verlag, München, 2. überarbeitete Auflage 2006 (IX-Buchtipp),
ISBN 3827323703