HTML-Attribut: rel

Das rel Attribut definiert die Beziehung zwischen einer verlinkten Ressource und dem aktuellen Dokument. Es ist gültig in <link>, <a>, <area> und <form>, wobei die unterstützten Werte vom Element abhängen, auf dem das Attribut gefunden wird.

Die Art der Beziehungen wird durch den Wert des rel Attributs bestimmt, das, wenn vorhanden, einen Wert haben muss, der eine ungeordnete Menge von einzigartigen, durch Leerzeichen getrennten Schlüsselwörtern ist. Im Gegensatz zu einem class Namen, der keine Semantik ausdrückt, muss das rel Attribut Token enthalten, die sowohl für Maschinen als auch für Menschen semantisch gültig sind. Die aktuellen Register für mögliche Werte des rel Attributs sind das IANA Link Relation Registry, der HTML Living Standard und die frei editierbare existing-rel-values page im Mikroformat-Wiki, wie vorgeschlagen von der Living Standard. Wenn ein rel Wert, der in keiner der drei obigen Quellen vorhanden ist, verwendet wird, werden einige HTML-Validatoren (wie der W3C Markup Validation Service) eine Warnung generieren.

Die folgende Tabelle listet einige der wichtigsten existierenden Schlüsselwörter auf. Jedes Schlüsselwort innerhalb eines leerzeichengetrennten Wertes sollte innerhalb dieses Wertes einzigartig sein.

rel Wert Beschreibung <link> <a> und <area> <form>
alternate Alternative Darstellungen des aktuellen Dokuments. Link Link Nicht erlaubt
author Autor des aktuellen Dokuments oder Artikels. Link Link Nicht erlaubt
bookmark Permalink für den nächsten umgebenden Abschnitt. Nicht erlaubt Link Nicht erlaubt
canonical Bevorzugte URL für das aktuelle Dokument. Link Nicht erlaubt Nicht erlaubt
compression-dictionary Link zu einem Kompressions-Wörterbuch, das für die Komprimierung zukünftiger Downloads von Ressourcen auf dieser Seite verwendet werden kann. Link Nicht erlaubt Nicht erlaubt
dns-prefetch Sagt dem Browser, dass er die DNS-Auflösung für den Ursprung der Zielressource präventiv durchführen soll. Externe Ressource Nicht erlaubt Nicht erlaubt
external Das referenzierte Dokument gehört nicht zur gleichen Seite wie das aktuelle Dokument. Nicht erlaubt Annotation Annotation
expect Ermöglicht, dass die Seite render-blocked werden kann, bis die wesentlichen Teile des Dokuments geparst sind, sodass es konsistent dargestellt wird. Link Nicht erlaubt Nicht erlaubt
help Link zu kontextsensitiver Hilfe. Link Link Link
icon Ein Symbol, das das aktuelle Dokument repräsentiert. Externe Ressource Nicht erlaubt Nicht erlaubt
license Gibt an, dass der Hauptinhalt des aktuellen Dokuments durch die im referenzierten Dokument beschriebene Lizenz abgedeckt ist. Link Link Link
manifest Web App Manifest. Link Nicht erlaubt Nicht erlaubt
me Gibt an, dass das aktuelle Dokument die Person repräsentiert, der der verlinkte Inhalt gehört. Link Link Nicht erlaubt
modulepreload Sagt dem Browser, dass er das Skript präventiv laden und im Modul-Map des Dokuments speichern soll, um es später zu evaluieren. Optional können auch die Abhängigkeiten des Moduls geladen werden. Externe Ressource Nicht erlaubt Nicht erlaubt
next Gibt an, dass das aktuelle Dokument Teil einer Serie ist und dass das nächste Dokument in der Serie das referenzierte Dokument ist. Link Link Link
nofollow Gibt an, dass der ursprüngliche Autor oder Herausgeber des aktuellen Dokuments das referenzierte Dokument nicht unterstützt. Nicht erlaubt Annotation Annotation
noopener Erstellt einen obersten Browsing-Kontext, der kein Hilfsbrowsing-Kontext ist, wenn der Hyperlink entweder von diesen beiden erstellt würde (d.h. wenn er einen geeigneten target Attributswert hat). Nicht erlaubt Annotation Annotation
noreferrer Es wird kein Referer-Header enthalten sein. Zusätzlich hat dies die gleiche Wirkung wie noopener. Nicht erlaubt Annotation Annotation
opener Erstellt einen Hilfsbrowsing-Kontext, wenn der Hyperlink ansonsten einen obersten Browsing-Kontext erstellen würde, der nicht ein Hilfsbrowsing-Kontext ist (d.h. wenn "_blank" als target Attributwert gesetzt ist). Nicht erlaubt Annotation Annotation
pingback Gibt die Adresse des Pingback-Servers an, der Pingbacks an das aktuelle Dokument verarbeitet. Externe Ressource Nicht erlaubt Nicht erlaubt
preconnect Gibt an, dass der User-Agent präventiv eine Verbindung zum Ursprung der Zielressource herstellen soll. Externe Ressource Nicht erlaubt Nicht erlaubt
prefetch Gibt an, dass der User-Agent die Zielressource präventiv abrufen und zwischenspeichern soll, da sie wahrscheinlich für eine nachfolgende Navigation benötigt wird. Externe Ressource Nicht erlaubt Nicht erlaubt
preload Gibt an, dass der User-Agent die Zielressource präventiv abrufen und zwischenspeichern muss, um sie gemäß dem potenziellen Ziel zu nutzen, das durch das as Attribut (und die mit dem entsprechenden Ziel verbundene Priorität) angegeben ist. Externe Ressource Nicht erlaubt Nicht erlaubt
prerender Gibt an, dass der User-Agent die Zielressource präventiv abrufen und sie in einer Weise verarbeiten soll, die dazu beiträgt, in der Zukunft eine schnellere Antwort zu liefern. Externe Ressource Nicht erlaubt Nicht erlaubt
prev Gibt an, dass das aktuelle Dokument Teil einer Serie ist und dass das vorhergehende Dokument in der Serie das referenzierte Dokument ist. Link Link Link
privacy-policy Gibt einen Link zu Informationen über die Datenverarbeitungs- und Nutzungspraktiken, die auf das aktuelle Dokument zutreffen. Link Link Nicht erlaubt
search Gibt einen Link zu einer Ressource an, die verwendet werden kann, um im aktuellen Dokument und seinen verwandten Seiten zu suchen. Link Link Link
stylesheet Importiert ein Stylesheet. Externe Ressource Nicht erlaubt Nicht erlaubt
tag Gibt ein Tag an (durch die angegebene Adresse identifiziert), das auf das aktuelle Dokument zutrifft. Nicht erlaubt Link Nicht erlaubt
terms-of-service Link zur Vereinbarung oder den Nutzungsbedingungen zwischen dem Anbieter des Dokuments und den Nutzern, die das Dokument verwenden wollen. Link Link Nicht erlaubt

Das rel Attribut ist relevant für die <link>, <a>, <area> und <form> Elemente, aber einige Werte sind nur für eine Teilmenge dieser Elemente relevant. Wie alle HTML Schlüsselwortattributwerte sind diese Werte nicht groß- und kleinschreibungssensitiv.

Das rel Attribut hat keinen Standardwert. Wenn das Attribut weggelassen wird oder wenn keiner der Werte im Attribut unterstützt wird, hat das Dokument keine besondere Beziehung zur Zielressource, abgesehen davon, dass es einen Hyperlink zwischen den beiden gibt. In diesem Fall, bei <link> und <form>, wenn das rel Attribut fehlt, keine Schlüsselwörter hat oder wenn nicht eines oder mehrere der oben aufgeführten durch Leerzeichen getrennten Schlüsselwörter vorhanden sind, dann erstellt das Element keine Links. <a> und <area> werden trotzdem Links erstellen, aber ohne eine definierte Beziehung.

Wert

alternate

Gibt eine alternative Darstellung des aktuellen Dokuments an. Gültig für <link>, <a> und <area>, die Bedeutung hängt von den Werten der anderen Attribute ab.

  • Mit dem stylesheet Schlüsselwort auf einem <link>, erstellt es ein alternatives Stylesheet.

    html
    <!-- a persistent style sheet -->
    <link rel="stylesheet" href="default.css" />
    <!-- alternate style sheets -->
    <link
      rel="alternate stylesheet"
      href="highcontrast.css"
      title="High contrast" />
    
  • Mit einem hreflang Attribut, das sich von der Sprachversion des Dokuments unterscheidet, zeigt es eine Übersetzung an.

  • Mit dem type Attributswert "application/rss+xml" oder "application/atom+xml" erstellt es einen Hyperlink, der auf einen Syndizierungs-Feed verweist.

    html
    <link
      rel="alternate"
      type="application/atom+xml"
      href="posts.xml"
      title="Blog" />
    
  • Andernfalls erstellt es einen Hyperlink, der auf eine alternative Darstellung des aktuellen Dokuments verweist, deren Art durch die hreflang und type Attribute angegeben wird.

    • Wenn hreflang zusammen mit alternate angegeben ist und der Wert von hreflang sich von der Sprache des aktuellen Dokuments unterscheidet, zeigt es an, dass das referenzierte Dokument eine Übersetzung ist.
    • Wenn type zusammen mit alternate angegeben ist, zeigt es an, dass das referenzierte Dokument ein alternatives Format ist (wie ein PDF).
    • Die hreflang und type Attribute können beide zusammen mit alternate angegeben werden.
    html
    <link
      rel="alternate"
      href="/fr/html/print"
      hreflang="fr"
      type="text/html"
      media="print"
      title="French HTML (for printing)" />
    <link
      rel="alternate"
      href="/fr/pdf"
      hreflang="fr"
      type="application/pdf"
      title="French PDF" />
    
author

Gibt an, dass das referenzierte Dokument weitere Informationen über den Autor des aktuellen Dokuments oder Artikels bereitstellt. Relevant für <link>, <a> und <area> Elemente.

Mit <a> und <area> gibt es an, dass das verlinkte Dokument (oder mailto:) Informationen über den Autor des nächstgelegenen <article> Vorfahren, falls vorhanden, bereitstellt, andernfalls über das gesamte Dokument.

Mit <link> repräsentiert es den Autor des gesamten Dokuments.

Hinweis: Aus historischen Gründen wird der veraltete Attributswert rev="made" wie rel="author" behandelt.

bookmark

Relevanter Wert des rel Attributs für die <a> und <area> Elemente. Gibt einen Permalink für das nächstgelegene umgebende <article> Element, falls vorhanden. Falls kein Vorfahr <article> Element existiert, gibt einen Permalink für den Abschnitt, mit dem das verlinkende Element am engsten verbunden ist.

canonical

Gültig für <link>, es definiert die bevorzugte URL für das aktuelle Dokument, was Suchmaschinen hilft, doppelte Inhalte zu reduzieren.

compression-dictionary Experimentell

Gültig für <link>, es definiert ein Kompressions-Wörterbuch, das für die Komprimierung zukünftiger Downloads von Ressourcen auf dieser Seite verwendet werden kann, sodass die Download-Größen dieser Ressourcen kleiner sind als bei der Standardkomprimierung.

dns-prefetch

Relevant für das <link> Element sowohl im <body> als auch im <head>, es sagt dem Browser, dass er die DNS-Auflösung für den Ursprung der Zielressource präventiv durchführen soll. Nützlich für Ressourcen, die der Nutzer wahrscheinlich benötigt, hilft es, die Latenz zu reduzieren und damit die Leistung zu verbessern, wenn der Nutzer tatsächlich auf die Ressourcen zugreift, da der Browser die DNS-Auflösung für den Ursprung der angegebenen Ressource präventiv durchgeführt hat. Siehe dns-prefetch, wie in resource hints beschrieben.

external

Relevant für <form>, <a> und <area>, es gibt an, dass das referenzierte Dokument nicht Teil der aktuellen Seite ist. Dies kann mit Attributselektoren verwendet werden, um externe Links in einer Weise zu gestalten, die dem Nutzer anzeigt, dass er die aktuelle Seite verlassen wird.

expect Experimentell

Ermöglicht es, dass die Seite render-blocked wird, bis die wesentlichen Teile des Dokuments geparst sind, sodass sie konsistent dargestellt wird. Beachten Sie, dass Render-Blocking nur auftritt, wenn es mit dem blocking="render" Attribut ergänzt wird.

Hinweis: Siehe Stabilizing page state to make cross-document transitions consistent für weitere Informationen über dessen Verwendung.

help

Relevant für <form>, <link>, <a> und <area>, das help Schlüsselwort gibt an, dass der verlinkte Inhalt kontext-sensitive Hilfe bietet und Informationen für das Elternelement des Elementes, das den Hyperlink definiert, und dessen Kinder bereitstellt. Wenn innerhalb eines <link> verwendet, ist die Hilfe für das gesamte Dokument. Wenn in <a> und <area> eingeschlossen und unterstützt, wird der Standard-cursor help anstelle von pointer sein.

icon

Gültig mit <link>, die verlinkte Ressource repräsentiert das Symbol, eine Ressource zur Repräsentation der Seite in der Benutzeroberfläche, für das aktuelle Dokument.

Die häufigste Verwendung für den icon Wert ist das Favicon:

html
<link rel="icon" href="favicon.ico" />

Wenn es mehrere <link rel="icon"> gibt, verwendet der Browser ihre media, type, und sizes Attribute, um das geeignetste Symbol auszuwählen. Wenn mehrere Symbole gleichermaßen geeignet sind, wird das letzte verwendet. Wenn sich später herausstellt, dass das geeignetste Symbol ungeeignet ist, weil es beispielsweise ein nicht unterstütztes Format verwendet, geht der Browser zum nächstgeeigneten Symbol über und so weiter.

Hinweis: Das crossorigin Attribut wird nicht in Chromium-basierten Browsern für rel="icon" unterstützt. Siehe das offene Chromium-Problem.

Hinweis: Apples iOS verwendet diesen Linktyp nicht, noch das sizes Attribut, wie es andere mobile Browser tun, um ein Webseiten-Symbol für Web Clip oder einen Startplatzhalter auszuwählen. Stattdessen verwendet es den nicht standardisierten apple-touch-icon und apple-touch-startup-image entsprechend.

Hinweis: Der shortcut Linktyp wird oft vor icon gesehen, dieser Linktyp ist jedoch nicht konform, wird ignoriert und Web-Autoren sollten ihn nicht mehr verwenden.

license

Gültig in den <a>, <area>, <form>, <link> Elementen. Der license Wert zeigt an, dass der Hyperlink zu einem Dokument führt, das die Lizenzinformationen beschreibt; dass der Hauptinhalt des aktuellen Dokuments durch die im referenzierten Dokument beschriebene Urheberrechtslizenz abgedeckt ist. Wenn nicht innerhalb des <head> Elements, unterscheidet der Standard nicht zwischen einem Hyperlink, der auf einen bestimmten Teil des Dokuments oder auf das gesamte Dokument anwendbar ist. Nur die Daten auf der Seite können dies anzeigen.

html
<link rel="license" href="#license" />

Hinweis: Obwohl anerkannt, ist das Synonym copyright falsch und sollte vermieden werden.

manifest

Web-App-Manifest. Erfordert die Verwendung des CORS-Protokolls für das Abrufen über verschiedene Ursprünge.

modulepreload

Nützlich für verbesserte Leistung und relevant für das <link> überall im Dokument, das Setzen von rel="modulepreload" weist den Browser an, das Skript (und die Abhängigkeiten) präventiv zu laden und es in der Modultabelle des Dokuments für eine spätere Bewertung zu speichern. modulepreload Links können sicherstellen, dass das Netzwerk-Abrufen mit dem Modul fertig ist (aber nicht ausgewertet) in der Modulkarte, bevor es notwendigerweise benötigt wird. Siehe auch modulepreload.

next

Relevant für <form>, <link>, <a> und <area>, der next Wert gibt an, dass das aktuelle Dokument Teil einer Serie ist und dass das nächste Dokument in der Serie das referenzierte Dokument ist. Wenn in einem <link> enthalten, können Browser annehmen, dass das Dokument als nächstes abgerufen wird und es als Ressourcentipp behandeln.

nofollow

Relevant für <form>, <a> und <area>, das nofollow Schlüsselwort sagt Suchmaschinen-Spidern, dass sie die Linkbeziehung ignorieren sollen. Die no-follow-Beziehung kann anzeigen, dass der Eigentümer des aktuellen Dokuments das referenzierte Dokument nicht unterstützt. Es wird oft von Suchmaschinen-Optimierern einbezogen, die vorgeben, dass ihre Linkfarmen keine Spam-Seiten sind.

noopener

Relevant für <form>, <a> und <area>, erstellt einen obersten Browsing-Kontext, der kein Hilfsbrowsing-Kontext ist, wenn der Hyperlink entweder von diesen beiden erstellt würde (d.h. hat einen geeigneten target Attributswert). Mit anderen Worten, es lässt den Link so verhalten, als ob window.opener null wäre und target="_parent" gesetzt wäre.

Dies ist das Gegenteil von opener.

noreferrer

Relevant für <form>, <a> und <area>, das Einschließen dieses Wertes macht den Referer unbekannt (es wird kein Referer-Header enthalten), und erzeugt einen obersten Browsing-Kontext, als ob noopener auch gesetzt wäre.

opener

Erstellt einen Hilfsbrowsing-Kontext, wenn der Hyperlink ansonsten einen obersten Browsing-Kontext erstellen würde, der kein Hilfsbrowsing-Kontext ist (d.h. hat "_blank" als target Attributwert). Im Wesentlichen das Gegenteil von noopener.

pingback

Gibt die Adresse des Pingback-Servers an, der Pingbacks an das aktuelle Dokument verarbeitet. Siehe die Pingback-Spezifikation.

preconnect

Bietet dem Browser einen Hinweis, dass er eine Verbindung zur verlinkten Website im Voraus herstellen soll, ohne private Informationen preiszugeben oder Inhalte herunterzuladen, sodass, wenn der Link gefolgt wird, der verlinkte Inhalt schneller abgerufen werden kann.

prefetch

Gibt an, dass der User-Agent die Zielressource präventiv abrufen und zwischenspeichern soll, da sie wahrscheinlich für eine nachfolgende Navigation benötigt wird. Siehe prefetch für weitere Informationen.

preload

Gibt an, dass der User-Agent die Zielressource präventiv abrufen und zwischenspeichern muss für die aktuelle Navigation gemäß dem potenziellen Ziel, das durch das as Attribut (und die Priorität, die dem entsprechenden Ziel zugeordnet ist) gegeben ist. Siehe die Seite für den preload Wert.

prerender Veraltet Nicht standardisiert

Gibt an, dass der User-Agent die Zielressource präventiv abrufen und sie in einer Weise verarbeiten soll, die dazu beiträgt, in der Zukunft eine schnellere Antwort zu liefern, indem er beispielsweise ihre Unterressourcen abruft oder einige Rendering-Aufgaben durchführt.

prev

Ähnlich dem next Schlüsselwort, relevant für <form>, <link>, <a> und <area>, der prev Wert gibt an, dass das aktuelle Dokument Teil einer Serie ist und dass der Link ein vorhergehendes Dokument in der Serie referenziert.

Hinweis: Das Synonym previous ist falsch und sollte nicht verwendet werden.

privacy-policy

Gültig für <a>, <area> und <link> Elemente, der privacy-policy Wert gibt an, dass das referenzierte Dokument die Datenschutzrichtlinie ist, die die Datenverarbeitungs- und Nutzungspraktiken des aktuellen Dokuments beschreibt.

Relevant für <form>, <link>, <a> und <area> Elemente, die search Schlüsselwörter zeigen an, dass der Hyperlink auf ein Dokument verweist, dessen Schnittstelle speziell für die Suche im aktuellen Dokument, der Seite und verwandten Ressourcen entwickelt wurde und einen Link zu einer Ressource bietet, die für die Suche verwendet werden kann.

Wenn das type Attribut auf application/opensearchdescription+xml gesetzt ist, ist die Ressource ein OpenSearch Plugin, das leicht zur Schnittstelle von Firefox hinzugefügt werden kann.

stylesheet

Gültig für das <link> Element, es importiert eine externe Ressource, die als Stylesheet verwendet wird. Das type Attribut ist nicht erforderlich, wenn es sich um ein text/css Stylesheet handelt, da dies der Standardwert ist. Wenn es sich nicht um ein Stylesheet des Typs text/css handelt, ist es am besten, den Typ zu deklarieren.

Während dieses Attribut den Link als Stylesheet definiert, beeinflusst die Interaktion mit anderen Attributen und anderen Schlüsselwörtern innerhalb des rel Wertes, ob das Stylesheet heruntergeladen und/oder verwendet wird.

Bei Verwendung mit dem alternate Schlüsselwort, definiert es ein alternatives Stylesheet. In diesem Fall sollte ein nicht-leerer title enthalten sein.

Das externe Stylesheet wird weder verwendet noch heruntergeladen, wenn die Medien nicht dem Wert des media Attributs entsprechen.

Erfordert die Verwendung des CORS-Protokolls für das Abrufen über verschiedene Ursprünge.

tag

Gültig für das <a> und <area> Elemente, es gibt einen Tag an (durch die gegebene Adresse identifiziert), der auf das aktuelle Dokument zutrifft. Der Tagwert gibt an, dass der Link auf ein Dokument verweist, das einen auf das Dokument anwendbaren Tag beschreibt, auf dem es sich befindet. Dieser Linktyp ist nicht für Tags innerhalb einer Tagwolke gedacht, da diese Tags auf eine Gruppe von Seiten zutreffen, während der tag Wert des rel Attributs für ein einziges Dokument gedacht ist.

terms-of-service

Gültig für <a>, <area> und <link> Elemente, der terms-of-service Wert gibt an, dass das referenzierte Dokument die Nutzungsbedingungen beschreibt, die die Vereinbarungen zwischen dem Anbieter des aktuellen Dokuments und Nutzern, die das Dokument verwenden möchten, beschreiben.

Nicht-standardisierte Werte

apple-touch-icon

Spezifiziert das Symbol für eine Webanwendung auf einem iOS-Gerät.

Spezifikationen

unsupported templ: spezifikationen

Browser-Kompatibilität

unsupported templ: kompatibilit

Siehe auch