Auszeichnen von Webseiten

Diese Seite wurde entfernt aus den Fotografie-Informationen und steht nun hier. Datum der Veröffentlichung: 22.11.2006.

Auszeichnen heißt, HTML-Tags (Kennzeichen) auf einer Webseite unterzubringen. Ein HTML-Tag ist Text, der in spitzen Klammern (<>) steht und eine besondere Bedeutung hat, zum Beispiel: Dies ist der Titel der Seite, das eine Überschrift, jenes ein Bild.


Abgesehen von den notwendigen Tags, damit der Webbrowser das gewünschte anzeigt, hat sich das Ausnutzen weiterer Eigenschaften der HTML-Tags für mich im Laufe der Zeit als nützlich erwiesen für das:

  • Aussehen der Seiten
  • Automatisieren

Aussehen der Seiten

Dank CSS kann ich weitgehend bestimmen, wie meine Seiten aussehen. HTML ist eine Textauszeichnungs-Sprache und hat eine begrenzte Anzahl an Tags. Für jedes dieser Tags kann ich bestimmen, wie der Text aussieht, der damit ausgezeichnet ist. Eine Überschrift der ersten Ebene ist mit dem h1-Tag ausgezeichnet. Der Titel dieser Seite sieht im Quelltext so aus: <h1>Auszeichnen von Webseiten</h1>. Mit CSS kann ich nun festlegen, dass alles was mit h1 ausgezeichnet ist, 1,25 mal größer geschrieben ist in Dunkelblau auf hellblauem Hintergrund.

Von den weiteren Möglichkeiten der Tags sind die Attribute class und id nützlich. Damit lege ich fest, ein Textabschnitt gehört zu einer bestimmen Klasse oder ist ein eindeutiges Element auf dieser Seite. Zum Beispiel haben die Tutorials Links (URLs), die in einem Abschnitt mit der Bedeutung Thema-Navigation stehen (Klasse sectionnav). Jeder Link darin dient zum Navigieren innerhalb eines bestimmen Themas, zum Beispiel Bilder archivieren. Überschriften, die im sectionnav-Abschnitt stehen, sind anders formatiert als Überschriften der gleichen Ebene im Inhalt.

Ich überlege: Wozu dient ein bestimmter Text (Inhalt, Link, …)? Davon ausgehend zeichne ich ihn zusätzlich mit einer Klasse aus oder einer ID, sofern er nur einmal vorkommen darf. Diese Auszeichnung dient nicht der Formatierung – für etliche Klassen habe ich keine definiert – sondern sie gibt dem Text Bedeutung, die Computerprogramme, zum Beispiel Webbrowser, nutzen können.

Automatisieren

Unter Automatisieren verstehe ich: Ein Computerprogramm erledigt ohne mein Hinzutun wiederkehrende Arbeiten. Die Programme schreibe ich. Manchmal sind es Bash-Skripte, manchmal umfangreichere Programme in den Programmiersprachen C, C++, Java oder Perl. Dank dieser Programme kann ich mich hauptsächlich auf den Inhalt konzentrieren (Außerdem bereitet mir das Programmieren Spaß).

Bestimmte Links sind ausgezeichnet mit rel="Typ". Diese benutze ich insbesondere für mehrseitige Artikel, zum Beispiel Tutorials:

  • rel="start": Erste mehrerer Seiten eines Themas
  • rel="next": Nächste Seite
  • rel="prev": Vorherige Seite
  • rel="contents": Inhaltsverzeichnis
  • rel="chapter": Kapitel (auf dem Site nicht benutzt)
  • rel="section": Abschnitt
  • rel="subsection": Unterabschnitt (auf dem Site nicht benutzt)

Somit ist klar, was das Ziel eines Links ist und ein Programm kann alle Seiten zum Beispiel eines Tutorials herauszufinden sowie deren Reihenfolge, zum Beispiel für Druckversionen.

Ein weiteres Beispiel sind die Links in den Änderungen-Seiten: Sie enthalten Elemente, die mit der Bedeutung Neu ausgezeichnet sind (der Artikel ist neu hinzugekommen) oder mit Navigation und so weiter. Dank der Auszeichnung kann mein Programm, das die RSS-Daten bereitstellt, leicht und treffsicher herausfinden, was der neueste Artikel ist. Es ließe sich auch mittels eines Computerprogramms feststellen, wieviele Artikel in einem Zeitraum neu veröffentlicht wurden, in welchem Verhältnis neue zu modifizerten Artikeln stehen und so weiter. Nebenbei könnten die verschiedenen Bedeutungen unterschiedlich eingefärbt werden.

Das Automatisieren funktioniert nur fehlerfrei, wenn der HTML-Code keine Fehler enthält. Das ist auch die beste Versicherung für die Zukunft, sollen Jahre später die Seiten noch angezeigt werden, in ein anderes Format konvertiert (HTML, XHTML, XML neuerer Versionen) oder in eine Datenbank gespeichert (Content-Management-System). Außerdem sehen sie so in allen Browsern gleich aus, sofern diese CSS beherrschen.

Fazit

Umfangreiches Auszeichnen ist ein Schritt in Richtung Semantic Web und Voraussetzung für die Automatisierung sowie Formatierung von Webseiten. Es profitieren der Webautor, der weniger erledigen muss, sowie die Leser, denen Dienste wie RSS angeboten werden können sowie bessere Navigation und Suchergebnisse.

Kommentieren