HTML-Attribut: rel

Das rel-Attribut definiert die Beziehung zwischen einer verlinkten Ressource und dem aktuellen Dokument. Es ist gültig bei <link>, <a>, <area>, und <form>. Die unterstützten Werte hängen vom Element ab, auf dem das Attribut verwendet wird.

Die Art der Beziehungen wird durch den Wert des rel-Attributs festgelegt, das, falls vorhanden, einen Wert haben muss, der eine ungeordnete Menge von eindeutigen, mit Leerzeichen getrennten Schlüsselwörtern ist. Anders als ein class-Name, der keine Semantik ausdrückt, muss das rel-Attribut Tokens enthalten, die sowohl für Maschinen als auch für Menschen semantisch valide sind. Die aktuellen Registrierungen für die möglichen Werte des rel-Attributs sind das IANA Link Relation Registry, der HTML Living Standard und die frei bearbeitbare existing-rel-values page im microformats-Wiki, wie vom Living Standard vorgeschlagen. Wird ein rel-Attribut verwendet, das in keiner der drei oben genannten Quellen vorhanden ist, erzeugen einige HTML-Validatoren (wie der W3C Markup Validation Service) eine Warnung.

Die folgende Tabelle listet einige der wichtigsten existierenden Schlüsselwörter auf. Jedes Schlüsselwort innerhalb eines durch Leerzeichen getrennten 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ächstgelegenen übergeordneten Abschnitt. Nicht erlaubt Link Nicht erlaubt
canonical Bevorzugte URL für das aktuelle Dokument. Link Nicht erlaubt Nicht erlaubt
dns-prefetch Weist den Browser an, die DNS-Auflösung für die Herkunft der Zielressource vorzeitig durchzuführen. Externe Ressource Nicht erlaubt Nicht erlaubt
external Das referenzierte Dokument gehört nicht zur gleichen Website wie das aktuelle Dokument. Nicht erlaubt Annotation Annotation
expect Erlaubt, dass die Seite render-blocked wird, bis die wesentlichen Teile des Dokuments geparst sind, sodass sie konsistent gerendert wird. Link Nicht erlaubt Nicht erlaubt
help Link zu kontextsensitiver Hilfe. Link Link Link
icon Ein Symbol, das das aktuelle Dokument darstellt. Externe Ressource Nicht erlaubt Nicht erlaubt
license Gibt an, dass der Hauptinhalt des aktuellen Dokuments durch die Urheberrechtslizenz des referenzierten Dokuments 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 Weist den Browser an, das Skript vorab zu laden und es im Modul-Map des Dokuments für eine spätere Auswertung zu speichern. Optional können auch die Abhängigkeiten des Moduls vorab geladen werden. Externe Ressource Nicht erlaubt Nicht erlaubt
next Gibt an, dass das aktuelle Dokument Teil einer Serie ist und 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 Hilfsbrowserkontext ist, wenn der Hyperlink einen solchen erstellen würde (d. h. hat einen geeigneten target-Attributwert). Nicht erlaubt Annotation Annotation
noreferrer Kein Referer-Header wird enthalten sein. Hat zusätzlich denselben Effekt wie noopener. Nicht erlaubt Annotation Annotation
opener Erstellt einen Hilfsbrowserkontext, wenn der Hyperlink ansonsten einen obersten Browsing-Kontext erstellen würde, der kein Hilfsbrowserkontext ist (d. h. hat "_blank" als target-Attributwert). 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 Benutzeragent eine Verbindung zu der Herkunft der Zielressource vorzeitig herstellen soll. Externe Ressource Nicht erlaubt Nicht erlaubt
prefetch Gibt an, dass der Benutzeragent die Zielressource vorab holen und zwischenspeichern soll, da sie höchstwahrscheinlich für eine nachfolgende Navigation benötigt wird. Externe Ressource Nicht erlaubt Nicht erlaubt
preload Gibt an, dass der Benutzeragent die Zielressource vorzeitig holen und zwischenspeichern muss für die aktuelle Navigation gemäß dem potenziellen Ziel, 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 Benutzeragent die Zielressource vorab holen und so verarbeiten soll, dass in Zukunft eine schnellere Reaktion geliefert werden kann. Externe Ressource Nicht erlaubt Nicht erlaubt
prev Gibt an, dass das aktuelle Dokument Teil einer Serie ist und das vorherige Dokument in der Serie das referenzierte Dokument ist. Link Link Link
privacy-policy Gibt einen Link zu Informationen über die Datenschutzpraktiken, die für das aktuelle Dokument gelten. Link Link Nicht erlaubt
search Gibt einen Link zu einer Ressource, die verwendet werden kann, um das aktuelle Dokument und seine verwandten Seiten zu durchsuchen. Link Link Link
stylesheet Importiert ein Stylesheet. Externe Ressource Nicht erlaubt Nicht erlaubt
tag Gibt ein Tag (identifiziert durch die angegebene Adresse) an, das auf das aktuelle Dokument zutrifft. Nicht erlaubt Link Nicht erlaubt
terms-of-service Link zur Vereinbarung oder Nutzungsbedingungen zwischen dem Anbieter des Dokuments und den Benutzern, die das Dokument nutzen möchten. 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üsselwort-Attributwerte sind diese Werte nicht groß- und kleinschreibungsempfindlich.

Das rel-Attribut hat keinen Standardwert. Wenn das Attribut weggelassen wird oder wenn keiner der Werte im Attribut unterstützt wird, dann hat das Dokument keine besondere Beziehung zur Zielressource, außer dass ein Hyperlink zwischen beiden besteht. In diesem Fall, bei <link> und <form>, wenn das rel-Attribut fehlt, keine Schlüsselwörter hat oder wenn nicht ein oder mehrere der oben genannten, durch Leerzeichen getrennten Schlüsselwörter, dann erstellt das Element keine Links. <a> und <area> erstellen dennoch Links, aber ohne definierte Beziehung.

Werte

alternate

Zeigt 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 Dokumentsprache unterscheidet, zeigt es eine Übersetzung an.

  • Mit einem type-Attributwert von "application/rss+xml" oder "application/atom+xml" erstellt es einen Hyperlink, der auf einen Syndikationsfeed 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, dessen Natur durch die hreflang und type-Attribute angegeben wird.

    • Wenn hreflang zusammen mit alternate angegeben wird und der Wert von hreflang sich von der aktuellen Dokumentsprache unterscheidet, zeigt dies an, dass das referenzierte Dokument eine Übersetzung ist.
    • Wenn type zusammen mit alternate angegeben wird, zeigt dies an, dass das referenzierte Dokument ein alternatives Format ist (z. B. 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

Zeigt 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> zeigt es an, dass das verlinkte Dokument (oder mailto:) Informationen über den Autor des nächsten <article>-Vorfahren bereitstellt, falls vorhanden, ansonsten über das gesamte Dokument.

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

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

bookmark

Relevant als rel-Attributwert für die <a> und <area> Elemente. Gibt einen Permalink für das nächstgelegene vorfahren <article>-Element an, falls vorhanden. Gibt bei Abwesenheit eines Vorfahren-<article>-Elements einen Permalink für den Abschnitt an, mit dem das verlinkende Element am engsten verbunden ist.

canonical

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

dns-prefetch

Relevant für das <link>-Element sowohl im <body> als auch im <head>, weist den Browser an, die DNS-Auflösung für die Herkunft der Zielressource vorzeitig durchzuführen. Nützlich für Ressourcen, die der Benutzer wahrscheinlich benötigt, hilft es, die Latenz zu reduzieren und damit die Leistung zu verbessern, wenn der Benutzer die Ressourcen tatsächlich aufruft, da der Browser die DNS-Auflösung für die Herkunft der angegebenen Ressource bereits durchgeführt hat. Siehe dns-prefetch, beschrieben in resource hints.

external

Relevant für <form>, <a>, und <area>, zeigt an, dass das referenzierte Dokument nicht Teil der aktuellen Website ist. Dies kann mit Attributselektoren verwendet werden, um externe Links so zu stylen, dass der Benutzer erkennt, dass die aktuelle Website verlassen wird.

expect Experimentell

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

Hinweis: Weitere Informationen finden Sie in Stabilizing page state to make cross-document transitions consistent.

help

Relevant für <form>, <link>, <a>, und <area>, das help-Schlüsselwort zeigt an, dass der verlinkte Inhalt kontextsensitive Hilfe bietet, die Informationen für das übergeordnete Element des Elements, das den Hyperlink definiert, und seine Kinder bereitstellt. Wird es innerhalb eines <link> verwendet, gilt die Hilfe für das gesamte Dokument. Bei Verwendung mit <a> und <area> und wenn es unterstützt wird, ist der Standard-cursor help statt pointer.

icon

Gültig mit <link>, die verlinkte Ressource stellt das Symbol dar, eine Ressource zur Darstellung 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 deren media, type, und sizes Attribute, um das am besten geeignete Symbol auszuwählen. Wenn mehrere Symbole gleichermaßen geeignet sind, wird das zuletzt genannte verwendet. Wenn das am besten geeignete Symbol später als ungeeignet befunden wird, zum Beispiel weil es ein nicht unterstütztes Format verwendet, geht der Browser zum nächstbesten über und so weiter.

Hinweis: Das crossorigin Attribut wird für rel="icon" in Chromium-basierten Browsern nicht unterstützt. Siehe den offenen Chromium-Issue.

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

Hinweis: Der shortcut-Link-Typ wird oft vor icon gesehen, aber dieser Link-Typ ist nicht konform, ignoriert und Webautoren dürfen ihn nicht mehr verwenden.

license

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

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

Hinweis: Obwohl erkannt, ist das Synonym copyright inkorrekt und muss vermieden werden.

manifest

Web App Manifest. Erfordert die Verwendung des CORS-Protokolls für Fetching aus externen Quellen.

modulepreload

Nützlich für verbesserte Leistung, und relevant für das <link> überall im Dokument, festlegen von rel="modulepreload" weist den Browser an, das Skript (und Abhängigkeiten) vorzeitig abzurufen und im Modul-Map des Dokuments für eine spätere Auswertung zu speichern. modulepreload Links können sicherstellen, dass das Netzwerkabrufen mit dem Modul bereit (aber nicht ausgewertet) im Modul-Map durchgeführt ist, 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. Bei Verwendung in einem <link> dürfen 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 weist Suchmaschinen-Spider an, die Link-Beziehung zu ignorieren. Die nofollow-Beziehung kann anzeigen, dass der Besitzer des aktuellen Dokuments das referenzierte Dokument nicht unterstützt. Es wird oft von Suchmaschinenoptimierern verwendet, die vorgaukeln, dass ihre Link-Farmen keine Spam-Seiten sind.

noopener

Relevant für <form>, <a>, und <area>, erstellt einen obersten Browsing-Kontext, der kein Hilfsbrowserkontext ist, wenn der Hyperlink einen solchen erstellen würde (d. h. hat einen geeigneten target-Attributwert). Mit anderen Worten, es lässt den Link 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 Referrer unbekannt (kein Referer-Header wird enthalten sein) und erstellt einen obersten Browsing-Kontext, als ob noopener auch gesetzt wäre.

opener

Erstellt einen Hilfsbrowserkontext, wenn der Hyperlink ansonsten einen obersten Browsing-Kontext erstellen würde, der kein Hilfsbrowserkontext ist (d. h. hat "_blank" als target-Attributwert). Effektiv 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 im Voraus eine Verbindung zur verlinkten Website öffnen soll, ohne private Informationen preiszugeben oder Inhalte herunterzuladen, so dass beim Folgen des Links die verlinkten Inhalte schneller abgerufen werden können.

prefetch

Gibt an, dass der Benutzeragent den Zielressource vorab holen und zwischenspeichern soll, da sie höchstwahrscheinlich für eine Folge-Navigation benötigt wird. Siehe prefetch für weitere Informationen.

preload

Gibt an, dass der Benutzeragent die Zielressource vorzeitig holen und zwischenspeichern muss für die aktuelle Navigation gemäß dem potenziellen Ziel, das durch das as-Attribut (und die mit dem entsprechenden Ziel verbundene Priorität) angegeben ist. Siehe die Seite für den preload Wert.

prerender Veraltet Nicht standardisiert

Gibt an, dass der Benutzeragent die Zielressource vorab holen und so verarbeiten soll, dass in Zukunft eine schnellere Reaktion geliefert werden kann, zum Beispiel durch Abrufen seiner Unterressourcen oder durch etwas Rendern.

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 auf ein vorheriges Dokument in der Serie verweist.

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

privacy-policy

Gültig für <a>, <area>, und <link> Elemente, zeigt der privacy-policy Wert an, dass das referenzierte Dokument die Datenschutzerklärung ist, die die Praktiken zur Datenerhebung und -nutzung 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, auf der Website und in verwandten Ressourcen entworfen ist, ein Link zu einer Ressource bereithält, die zur Suche verwendet werden kann.

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

stylesheet

Gültig für das <link> Element, importiert es eine externe Ressource zur Verwendung als Stylesheet. 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 anzugeben.

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

Wenn zusammen mit dem alternate Schlüsselwort verwendet, definiert es ein alternatives Stylesheet. In diesem Fall geben Sie einen nicht leeren title an.

Das externe Stylesheet wird nicht verwendet oder sogar heruntergeladen, wenn das Medium nicht mit dem Wert des media Attributs übereinstimmt.

Erfordert die Verwendung des CORS-Protokolls für Fetching aus externen Quellen.

tag

Gültig für die <a>- und <area>-Elemente, gibt es ein Tag an (identifiziert durch die angegebene Adresse), das auf das aktuelle Dokument zutrifft. Der Tag-Wert gibt an, dass der Link auf ein Dokument verweist, das ein auf dieses befindliches Dokument zutreffendes Tag beschreibt. Dieser Link-Typ ist nicht für Tags innerhalb einer Tag-Wolke gedacht, da diese Tags auf eine Gruppe von Seiten zutreffen, während der tag Wert des rel-Attributs für ein einzelnes Dokument ist.

terms-of-service

Gültig für <a>, <area>, und <link> Elemente, zeigt der terms-of-service Wert an, dass das referenzierte Dokument die Nutzungsbedingungen sind, die die Vereinbarungen zwischen dem Anbieter des aktuellen Dokuments und den Benutzern beschreiben, die das bereitgestellte Dokument nutzen möchten.

Nicht-standardisierte Werte

apple-touch-icon

Gibt das Symbol einer Webanwendung auf einem iOS-Gerät an.

Spezifikationen

Specification
HTML Standard
# linkTypes
HTML Standard
# attr-hyperlink-rel
HTML Standard
# attr-form-rel

Browser-Kompatibilität

html.elements.link.rel

BCD tables only load in the browser

html.elements.a.rel

BCD tables only load in the browser

html.elements.area.rel

BCD tables only load in the browser

html.elements.form.rel

BCD tables only load in the browser

Siehe auch