Artikelformat

Welche Hyperlink-Attribute gibt es?

Hyperlinks lassen nicht nur den Rückschluss auf die Qualität einer Website zu, mit den Hyperlinks bestimmst du auch die Struktur deiner eigenen Site. Hyperlinks helfen, dass sich der Besucher auf deiner Site zurechtfindet und geben dir die Möglichkeit, deinen Besuchern die Informationen zu zeigen, die du mit deiner Site präsentieren möchtest.

Vorhandene Hyperlinks setzen sich zumeist farblich von dem umgebenden Text ab und lenken somit sofort die Aufmerksamkeit des Betrachters auf sich. Voraussetzung dafür ist natürlich, dass du deine Webseite nicht mit Hyperlinks überladen hast. Bevor wir uns mit den verschiedenen Attributen eines Hyperlinks beschäftigen noch einen Hinweis zum sichtbaren Teil des Links: Du solltest dem User mit dem sichtbaren Verweistext bereits einen Hinweis geben, wohin dieser Link führt. Schlecht wäre beispielsweise, wenn du dem User einen Hyperlink mit dem Text „zurück“ präsentierst. Hier stellt sich zwangsläufig die Frage, ja wohin eigentlich zurück? Besser wäre ein Verweis mit dem Text „zurück zur Startseite“. Wenn du eine komplexere Website mit verschiedenen Themen hast, helfen auch kleine Grafiken mit Symbolen, die dem User intuitiv erklären, wohin der jeweilige Verweis-Link führt.

Sämtliche Hyperlinks in HTML haben den gleichen Aufbau. Dies macht es dem Webmaster einfach sie einzusetzen, bietet allerdings gleichzeitig auch den Nachteil, dass du Hyperlinks nur für bestimmte Aufgaben nutzen kannst. In der folgenden Auflistung erfährst du, welche Link-Attribute es gibt und was du damit machen kannst.

In alphabetischer Reihenfolge geordnet sind unter anderem folgende Attribute in einem „a“-TAG möglich: accesskey, charset, coords, href, hreflang, name, onblur, onfocus, rel, rev, shape, tabindex, target, title und type.

href

Das wohl wichtigste Attribut in einem „a“-TAG ist „href“ und zeigt sich in einem Hyperlink wie folgt:
<a href=“http://www.rankwatcher.de“>Startseite</a>. Du benötigst das Attribut „href“, um die Zieladresse zu definieren, zu der der User nach Auslösen des Hyperlinks geleitet werden soll. Dies kann eine Stelle innerhalb der selben Webseite sein, das kann eine andere Seite innerhalb des selben Web-Projektes sein oder das kann auch eine komplett andere Zielseite auf einem ganz anderen Rechner sein.

target

Das wohl häufigste Attribut das du neben „href“ in einem „a“-TAG finden dürftest wird wohl „target“ sein. Das Attribut „target“ kann um vier Werte erweitert werden (_blank, _parent, _self und _top) und bestimmt, in welchem Browser-Fenster sich die angegebene Zielseite öffnet. Ein Hyperlink mit dem Attribut „target“ zeigt sich im Quelltext beispielsweise wie folgt:

<a href=“http://www.rankwatcher.de“ target=“_blank“>Rankwatcher.de</a>.

Der target-Wert „_blank“ veranlasst, dass die Zielseite aus dem Hyperlink in einem komplett neuen Browser-Fenster geöffnet wird. Die target-Werte „_parent“, „_self“ und „_top“ sind zumeist in Webseiten mit so genannten Framesets zu finden und werden dort auch überwiegend eingesetzt. Eine Website mit einem Frameset  kannst du dir wie ein Sprossenfenster vorstellen; auf jeder „Fensterscheibe“ befinden sich verschiedene HTML-Seiten. Du kannst mit den target-Werten bestimmen, ob sich die Zielseite beim Auslösen des Hyperlinks auf der selben „Fensterscheibe“ öffnet oder ob die Zielseite auf einer anderen „Fensterscheibe“ angezeigt wird. So öffnet sich die Zielseite mit dem Wert _self auf derselben „Scheibe“, mit dem Wert _parent springt die Zielseite auf die nächst höhere Ebene (vergleichbar mit dem „Flügelfenster“) und mit dem Wert _top auf die höchste Framset-Ebene (vergleichbar mit dem „Fensterrahmen“).

title

Mit dem Attribut „title“ gibst du dem Hyperlink zusätzlich einen Namen. Dieses Attribut zeigt sich im Quelltext beispielsweise wie folgt:

<a href=“http://www.rankwatcher.de“ title=“Startseite von Rankwatcher.de“>Startseite</a>

Bei Browsern die dieses Attribut unterstützen, zeigt sich beim Überfahren mit der Maus die Beschreibung in einem farblich unterlegten Hinweisfenster, in diesem Fall „Startseite von Rankwatcher.de“. Das Attribut gibt dem User quasi vor Auslösen des Hyperlinks zusätzliche Informationen, was sich hinter diesem Link verbirgt.

name

„name“ als Attribut in einem „a“-TAG kannst du nur bei den begleitenden „a“-TAGs einsetzen, die du für Verweise innerhalb einer Seite benötigst. Diese TAGS nennen sich dann „Anker“-TAGS und bleiben auf der Webseite zumeist unsichtbar. Ein „Anker“ bestimmt die Ziel-Position eines ausgelösten Hyperlinks innerhalb der Seite und sieht im Quelltext beispielsweise wie folgt aus: <a name=“zweiterabsatz“></a>. Der auf der Webseite sichtbare Link zu diesem Anker würde im Quelltext wie folgt aussehen: <a href=“#zweiterabsatz“>Zweiter Absatz</a>.

hreflang + charset

Seit HTML 4.0 kannst du in einem Hyperlink auch angeben, in welcher Landessprache die Zielseite geschrieben ist und welcher Zeichensatz für die Zielseite gefordert wird. Derartige Hyperlinks werden üblicherweise eingesetzt wenn zu erwarten ist, dass die Webseite auch von Usern aus anderen Ländern benutzt wird. Als Wert im Attribut hreflang gibt man in der Regel das Länderkürzel an, das eine Länder-Domain kennzeichnet. Also „de“ für deutsch, „en“ für englisch, „fr“ für französisch oder „il“ für israelisch usw. Ein Hyperlink mit diesen Attributen könnte im Quelltext beispielsweise wie folgt aussehen:

< a href=“http://www.rankwatcher.de“ hreflang=“de“ charset=“iso-8559-8″>Beispiel für hreflang + charset</a>

Leider interpretieren viele Browser die Attribute hreflang und charset noch nicht. Gedacht wäre eigentlich, dass dem User beim Überfahren des Links mit der Maus ein kleines Länderfähnchen angezeigt wird. Das Attribut „charset“ könnte dem User beim Anklicken des Hyperlinks beispielsweise eine Warnung ausgeben, dass der angegebene Zeichensatz für ihn nicht verfügbar ist und fragen, ob er sich wirklich die Seite ansehen möchte.

rel + rev

Mit dem Attribut „rel“ bestimmt man einen logischen „Vorwärtsverweis“ zu einer bestimmten Zielseite, mit dem Attribut „rev“ einen logischen „Rückwärtsverweis“. Ein „rel“ Attribut könnte im Quelltext des Hyperlinks wie folgt aussehen:

<a href=“http://www.rankwatcher.de“ rel=“contents“>Inhaltsverzeichnis</a>.

Das „rev“-Attribut zu dem Wert „contents“ würde dann im Quelltext des Hyperlinks wie folgt aussehen:

<a href=“http://www.rankwatcher.de“ rev=“contents“>Zurück zum Inhaltsverzeichnis</a>.

Folgende logische Bezüge sind möglich:

a Attributte rel und rev

Wie auch bei den Attributen hreflang und charset werden die rel und rev Attribute leider nicht von allen Browsern angezeigt. Gedacht wäre beispielsweise, dass dem User beim Überfahren des Hyperlinks mit der Maus ein kleines Icon angezeigt wird, das die Zielseite symbolisiert.

accesskey

Ein Hyperlink der das Attribut „accesskey“ in sich trägt ist überwiegend auf Webseiten von Webmastern zu finden die einen Schwerpunkt auf barrierefreies Web legen, also ihre Webseite auch behinderten Menschen zugänglich machen möchten. Konkret bedeutet das Attribut „accesskey“, dass man den Hyperlink nicht nur per Mausklick sondern auch mittels Tasten-Kurzbefehle auslösen kann. Im Quelltext könnte ein Hyperlink mit dem Attribut „accesskey“ wie folgt aussehen:

<a href=“http://www.rankwatcher.de“ title=“Beispiel für accesskey“ accesskey=“c“>Beispiel für accesskey</a>.

Je nach Browser kann der Hyperlink dann mit einer bestimmten Tastenkombination ausgelöst werden. Der Internet Explorer von Microsoft erlaubt den Zugang zu accesskey-Hyperlinks per Alt-Taste, erfordert aber das zusätzliche Drücken der Enter-Taste. Netscape 6 und höher oder auch andere Mozilla-Browser rufen mit der Tastenkombination „Alt“ und dem im accesskey vorgegebenen Buchstaben die Zielseite auf. Opera 7 bietet den Zugang mittels Umschalt- und Esc Taste zur jeweiligen Zielseite.

type

Das Attribut „type“ hilft dem Web-Browser, das im Hyperlink definierte Zieldokument richtig zu interpretieren. Hierbei handelt es sich in der Regel nicht um eine html-Datei, sondern um eine Datei wie Word, Excel, Powerpoint, PDF, MIDI, RealAudio usw. Das Attribut „type“ könnte im Quelltext eines Hyperlinks beispielsweise wie folgt aussehen:

<a href=“http://www.rankwatcher.de/backlinkliste.xls“ type=“application/msexcel“>Eine Backlinkliste als Excel-Datei</a>

Sowohl der www-Server als auch der www-Browser unterhält eine Liste mit ihm bekannten Dateitypen. Beim Übertragen der Datei vom Server zum Browser wird über das HTTP-Protokoll der MIME-Type mit übertragen. Aufgrund der Liste mit MIME-Typen weiß der www-Browser, wie er die Datei zu behandeln hat. Wenn du mehr über MIME-Typen erfahren möchtest, empfehle ich dir die Ausführungen von SELFHTML.

Bewerte diesen Artikel
1 Stern2 Sterne3 Sterne4 Sterne5 Sterne

19 Bewertung(en), durchschnittlich: 5,00 von 5

Loading...

Schreibe einen Kommentar

Pflichtfelder sind mit * markiert.