Analyse des rel-Attributs in HTML

Analyse des rel-Attributs in HTML

Da ich festgestellt habe, dass einige Klassenkameraden diesen Artikel auf Weibo erneut gepostet und gesammelt haben, habe ich mir diesen beiläufig übersetzten Artikel noch einmal angesehen. Später habe ich festgestellt, dass w3cschools.com.cn bereits eine entsprechende chinesische Übersetzung hat, daher werde ich diesen Artikel hier weiter verbessern, um ihn wertvoller zu machen. Die Idee, dieses Dokument zu übersetzen, kam mir zuerst aus dem Artikel http://vanessa.b3log.org/research-a-rel-value. Ich fand heraus, dass das rel-Attribut viele ungewöhnliche semantische Werte hat. Der ursprüngliche Artikel konzentrierte sich auf die Auflistung der Verwendungsszenarien dieser Attributwerte. Ich hielt es für sehr wichtig, das rel-Attribut auf diese Weise zu verstehen.

Beispiel

Links mit dem rel-Attribut:

<a rel="external" href="http://www.xxoo.com/">ooxx</a>

Browserunterstützung

Das rel-Attribut wird von allen gängigen Browsern unterstützt.

注:瀏覽器渲染時會忽略此屬性,然而搜索引擎可以從它獲得更多的信息(a標簽僅在href屬性存在時有效)。

Definition und Verwendung

Das rel-Attribut gibt die Beziehung zwischen dem aktuellen Dokument und dem verknüpften Dokument an.

Grammatik

<a rel="value">

Unterschiede zwischen HTML 4.01 und HTML 5

Gelöschte Werte: Anhang, Kapitel, Inhalt, Copyright, Glossar, Index , Abschnitt, Anfang, Unterabschnitt.

Neue Werte: Archiv, Autor, Lesezeichen, Extern, Erste, Index , letzte, Lizenz, Nofollow, Noreferrer, Suche, Seitenleiste, Tag, oben.

Eigenschaftswert
Wert beschreiben Szenario | Beispiel HTML4.01 HTML5
Anhang Link zur Anhangsseite des Dokuments
wechseln Link zu einer alternativen Quelle (z. B. Druckseite, Übersetzung, Spiegel) Konfigurieren Sie das Atom der Website und fügen Sie den Head-Tag ein
Verknüpfungssymbol Verknüpfungssymbol Geben Sie kleine Symbole für Titelleiste, Adressleiste und Favoritenleiste an
Archiv Link zum Dokumentensatz oder zu historischen Daten <link rel='archives' href='http://www.ooxx.com/2012/07' />
Autor Link zum Autor des Dokuments Geben Sie den Autor des Dokuments im Head-Tag an.
kanonisch Autorität, Vorbild

Teilen Sie der Suchmaschine mit, welche der doppelten oder ähnlichen Seiten auf der aktuellen Website vom Webmaster gecrawlt und aufgenommen werden soll.

<link rel="canonical" href="http://xxoo.com/" />
  • Der kanonische Attributwert erscheint normalerweise im rel-Attribut.
  • Referenz-URL: http://www.xxoo.com/xhtml/rel_canonical/
  • Aus funktionaler Sicht kann Canonical als Hilfsfunktion der permanenten 301-Umleitung verstanden werden.
  • Canonical kann entweder mit relativen oder absoluten Links verwendet werden, absolute Links werden jedoch empfohlen.
  • Google definiert „kanonisch“ wie folgt: „Eine kanonische Seite ist die bevorzugte Version einer Reihe von Seiten mit sehr ähnlichem Inhalt.“
  • kanonisch: Chinesische Bedeutung von „Modell“
Stylesheet Das externe Stylesheet des Dokuments <link rel="stylesheet" href="base.css">
heim Link zur Homepage der Site <link href="http://www.ooxx.com" rel="home" />
Erste Link zum ersten Dokument der Sammlung <link rel="first" href="index.html">
Start Link zur ersten Seite des aktuellen Dokuments <link rel="start" href="about:blank">
nächste Link zum nächsten Dokument in der Sammlung <link rel="next" href="about:blank">
Zurück Link zum vorherigen Dokument in der Sammlung <link rel="chapter" href="about:blank">
zuletzt Link zum letzten Dokument der Sammlung <link rel="last" href="index.html">
hoch Bietet einen Link zu einem Dokument. Dieses Dokument stellt den Kontext des aktuellen Dokuments bereit.
suchen Link zum Dokumentationssuchtool
Seitenleiste Link zum Dokument, das in der Seitenleiste des Browsers angezeigt werden soll
Inhalt Link zum Inhaltsverzeichnis des aktuellen Dokuments Wird normalerweise in der Seitenleiste des Hauptinhalts des Dokuments platziert und ist praktisch, um zwischen Themen auf der aktuellen Seite zu springen.
Index Link zum Index des aktuellen Dokuments
Glossar Link zum aktuellen Dokumentenglossar
Copyright Link zur Copyright- oder Datenschutzseite für das aktuelle Dokument Copyright unten auf der Website
Kapitel Link zu einem Abschnitt aus dem aktuellen Dokument
Abschnitt Link zu einem Abschnitt in der Dokumentationsliste
Unterabschnitt Verlinkt zu einem Unterabschnitt der aktuellen Dokumentliste. (Ein Abschnitt kann mehrere Unterabschnitte haben.)
Kopf Link zum obersten Dokument in der Sammlung
Inhaltsverzeichnis Link zum Sammlungsverzeichnis
Elternteil Link zum Quelldokument oben
Kind Link zum Quelldokument unten
helfen Link zur Hilfedokumentation <link rel="help" href="http://www.xxoo.net/help.html" />
Lesezeichen Permanente URL zum Lesezeichensetzen Listentitel
extern Links zu externen Dokumenten Im Artikel zitierte externe Links
nicht folgen Verlinkung zu nicht autorisierten Dokumenten, z. B. bezahlte Links
Google verwendet "nofollow", um anzugeben, dass seine Suchspider dem Link nicht folgen
Verwandte Artikel auf der Site, zufällige Artikel auf der Site, Kommentarantworten, Kommentare, Browse- und Author-Links in Listen und Artikelseiten, Kommentaradressen in der Sidebar, „Home“-Link in der Homepage-Navigation, meistkommentierte Artikel, meistbesuchte Artikel
noreferrer Gibt an, dass der Browser keinen HTTP-Referrer-Header senden soll, wenn ein Benutzer diesem Hyperlink folgt.
Lizenz Link zu den Copyright-Informationen des Dokuments
Etikett Aktuelle Dokument-Tags (Schlüsselwörter) Tag-Cloud in der Sidebar, Tags in Artikeln, Tags in Listen, Tags auf Tag-Seiten
Freund Sponsor Freundliche Links, Themen von unten

由于本人水平有限,難免存在一些錯誤,看官們如果覺得有不妥或者需要補充的地方,請留言指出,謝謝!

siehe

http://www.w3schools.com/TAGS/att_a_rel.asp

http://vanessa.b3log.org/research-a-rel-value

http://www.w3school.com.cn/htmldom/prop_anchor_rel.asp

Ich muss den rel-author-Tag erwähnen

HTML-rel-kanonischer Attributwert

Die Bedeutung des Link-Tag-Rel-Attributs

Über rel="canonical" (Google Webmaster Tools)

<<:  Eine kurze Analyse von MySQL-Verbindungen und -Sammlungen

>>:  Analyse des Quellcodes des Nginx-Speicherpools

Artikel empfehlen

Die Verbindung zwischen JavaScript und TypeScript

Inhaltsverzeichnis 1. Was ist JavaScript? 2. Wofü...

So fügen Sie MySQL Indizes hinzu

Hier ist eine kurze Einführung in Indizes: Der Zw...

JavaScript-Webformularfunktion Kommunikation voller praktischer Informationen

1. Einleitung Vorher haben wir über das Front-End...

Informationen zu WSL-Konfigurations- und Änderungsproblemen in Docker

https://docs.microsoft.com/en-us/windows/wsl/wsl-...

Details zur Verwendung von „order by“ in MySQL

Inhaltsverzeichnis 1. Einleitung 2. Haupttext 2.1...

Zwei Möglichkeiten, die CSS-Priorität zu verstehen

Methode 1: Werte hinzufügen Gehen wir zu MDN, um ...

Tutorial zur Installation von MySQL8 auf Centos7

Neue Funktionen in MySQL 8: Meine persönliche Mei...

Befehlscodebeispiele für die Installation und Konfiguration von Docker

Docker-Installation Installieren von Abhängigkeit...

Der Prozess der Installation und Konfiguration von Nginx in Win10

1. Einleitung Nginx ist ein kostenloser, quelloff...