Standardmetadaten-Namen

Der HTML-Standard definiert die folgenden Standardmetadaten-Namen:

• application-name: der Name der Anwendung, die auf der Webseite läuft.

  Hinweis:

  • Browser können dies verwenden, um die Anwendung zu identifizieren. Es ist unterschiedlich zum <title>-Element, das normalerweise den Anwendungsnamen enthält, aber auch Informationen wie den Dokumentnamen oder einen Status enthalten kann.
  • Einzelne Webseiten sollten keinen application-name definieren.

• author: der Name des Autors des Dokuments.

• description: eine kurze und genaue Zusammenfassung des Seiteninhalts. Suchmaschinen wie Google können dieses Feld verwenden, um das Erscheinungsbild der Webseite in den Suchergebnissen zu steuern.

• generator: die Kennung der Software, die die Seite erzeugt hat.

• keywords: für den Seiteninhalt relevante Wörter, getrennt durch Kommas.

• referrer: steuert den HTTP-Referer-Header von Anfragen, die vom Dokument gesendet werden:

  Werte für das content Attribut von <meta name="referrer">

  no-referrer	Sendet keinen HTTP-Referer-Header.
  origin	Sendet den origin des Dokuments.
  no-referrer-when-downgrade	Sendet die vollständige URL, wenn das Ziel mindestens genauso sicher ist wie die aktuelle Seite (HTTP(S)→HTTPS), sendet jedoch keinen Referrer, wenn es weniger sicher ist (HTTPS→HTTP). Dies ist das Standardverhalten.
  origin-when-cross-origin	Sendet die vollständige URL (ohne Parameter) für Anfragen mit gleicher Herkunft, sendet jedoch nur den Ursprung in anderen Fällen.
  same-origin	Sendet die vollständige URL (ohne Parameter) für Anfragen mit gleicher Herkunft. Fremde Herkunftsanfragen enthalten keinen Referrer-Header.
  strict-origin	Sendet den Ursprung, wenn das Ziel mindestens genauso sicher ist wie die aktuelle Seite (HTTP(S)→HTTPS), sendet jedoch keinen Referrer, wenn es weniger sicher ist (HTTPS→HTTP).
  strict-origin-when-cross-origin	Sendet die vollständige URL (ohne Parameter) für Anfragen mit gleicher Herkunft. Sendet den Ursprung, wenn das Ziel mindestens genauso sicher ist wie die aktuelle Seite (HTTP(S)→HTTPS). Andernfalls wird kein Referrer gesendet.
  unsafe-URL	Sendet die vollständige URL (ohne Parameter) für Anfragen mit gleicher oder fremder Herkunft.

  Hinweis:

  • Das dynamische Einfügen von <meta name="referrer"> (mit document.write() oder appendChild()) macht das Referrer-Verhalten unvorhersehbar.
  • Wenn mehrere widersprüchliche Richtlinien definiert sind, wird die no-referrer-Richtlinie angewandt.

• theme-color: gibt eine vorgeschlagene Farbe an, die Benutzeragenten verwenden sollten, um die Anzeige der Seite oder der umgebenden Benutzeroberfläche anzupassen. Das content-Attribut enthält einen gültigen CSS <color>. Das media-Attribut mit einer gültigen Medienabfragenliste kann eingeschlossen werden, um das Medium festzulegen, auf das sich die Metadaten zur Themafarbe beziehen.

• color-scheme: gibt ein oder mehrere Farbdesigns an, mit denen das Dokument kompatibel ist.

  Der Browser verwendet diese Informationen zusammen mit den Browser- oder Geräteeinstellungen des Benutzers, um zu bestimmen, welche Farben für alles verwendet werden, von Hintergründen und Vordergründen bis hin zu Formsteuerungen und Bildlaufleisten. Der Hauptzweck von <meta name="color-scheme"> besteht darin, die Kompatibilität mit und die Präferenzreihenfolge für helle und dunkle Farbmodi anzugeben.

  Der Wert der content-Eigenschaft für color-scheme kann einer der folgenden sein:

  normal

  Das Dokument kennt keine Farbdesigns und sollte mit der Standardfarbpalette gerendert werden.

  light, dark, light dark, dark light

  Ein oder mehrere vom Dokument unterstützte Farbdesigns. Ein Farbdesign mehrmals anzugeben, hat den gleichen Effekt, als würde es nur einmal angegeben. Mehrere Farbdesigns anzugeben, bedeutet, dass das erste Design vom Dokument bevorzugt wird, aber dass das zweite angegebene Design akzeptabel ist, wenn der Benutzer es bevorzugt.

  only light

  Gibt an, dass das Dokument nur den Lichtmodus unterstützt, mit einem hellen Hintergrund und dunklen Vordergrundfarben. Laut Spezifikation ist only dark nicht gültig, da die erzwungene Darstellung eines Dokuments im Dunkelmodus, wenn es nicht wirklich damit kompatibel ist, zu unlesbarem Inhalt führen kann; alle großen Browser arbeiten standardmäßig im Lichtmodus, wenn nicht anders konfiguriert.

  Zum Beispiel, um anzugeben, dass ein Dokument den Dunkelmodus bevorzugt, aber auch im Lichtmodus funktionell gerendert wird:

  html

  <meta name="color-scheme" content="dark light" />
  

  Dies funktioniert auf Dokumentebene auf dieselbe Weise, wie die CSS-color-scheme-Eigenschaft es einzelnen Elementen ermöglicht, ihre bevorzugten und akzeptierten Farbdesigns anzugeben. Ihre Stile können sich dem aktuellen Farbschema mit dem CSS-Medienmerkmal prefers-color-scheme anpassen.

Die CSS Device Adaptation-Spezifikation definiert den folgenden Metadatennamen:

• viewport: gibt Hinweise zur Größe der Anfangsgröße des Sichtfelds.

  Werte für den Inhalt von <meta name="viewport">

  Wert	Mögliche Unterwerte	Beschreibung
  width	Eine positive ganze Zahl oder der Text device-width	Definiert die Pixelbreite des Sichtfelds, bei der Sie möchten, dass die Website gerendert wird.
  height	Eine positive ganze Zahl oder der Text device-height	Definiert die Höhe des Sichtfelds. Wird von keinem Browser verwendet.
  initial-scale	Eine positive Zahl zwischen 0.0 und 10.0	Definiert das Verhältnis zwischen der Gerätebreite (device-width im Hochformat oder device-height im Querformat) und der Größe des Sichtfelds.
  maximum-scale	Eine positive Zahl zwischen 0.0 und 10.0	Definiert das maximale Vergrößerungsverhältnis. Es muss größer oder gleich dem minimum-scale sein, ansonsten ist das Verhalten undefiniert. Browsereinstellungen können diese Regel ignorieren und iOS10+ ignoriert sie standardmäßig.
  minimum-scale	Eine positive Zahl zwischen 0.0 und 10.0	Definiert das minimale Zoomniveau. Es muss kleiner oder gleich dem maximum-scale sein, ansonsten ist das Verhalten undefiniert. Browsereinstellungen können diese Regel ignorieren und iOS10+ ignoriert sie standardmäßig.
  user-scalable	yes oder no	Wenn auf no gesetzt, kann der Benutzer nicht in die Webseite hineinzoomen. Der Standardwert ist yes. Browsereinstellungen können diese Regel ignorieren, und iOS10+ ignoriert sie standardmäßig.
  viewport-fit	auto, contain oder cover	Der Wert auto beeinflusst das anfängliche Layout-Sichtfeld nicht, und die gesamte Webseite ist sichtbar. Der Wert contain bedeutet, dass das Sichtfeld so skaliert wird, dass es das größte innerhalb des Displays eingeschriebene Rechteck einfügt. Der Wert cover bedeutet, dass das Sichtfeld skaliert wird, um das Anzeigegerät auszufüllen. Es wird dringend empfohlen, die Variablen für den sicheren Bereich zu verwenden, um sicherzustellen, dass wichtige Inhalte nicht außerhalb der Anzeige landen.

  Warnung:

  Das Deaktivieren der Zoom-Funktionen durch Einstellen von user-scalable auf einen Wert von no verhindert, dass Menschen mit Sehbehinderungen den Seiteninhalt lesen und verstehen können.

  • MDN erklärt WCAG, Richtlinie 1.4-Erklärungen
  • Erläuterung des Erfolgskriteriums 1.4.4 | W3C erklärt WCAG 2.0

Namen, die im WHATWG MetaExtensions-Wiki definiert sind

Die WHATWG Wiki MetaExtensions Seite enthält eine große Anzahl nicht-standardmäßiger Metadaten-Namen, die bisher nicht formell angenommen wurden; jedoch werden einige der dort enthaltenen Namen bereits häufig in der Praxis verwendet – einschließlich der folgenden:

• creator: der Name des Schöpfers des Dokuments, wie eine Organisation oder Institution. Wenn es mehrere gibt, sollten mehrere <meta>-Elemente verwendet werden.

• googlebot, ein Synonym von robots, wird nur von Googlebot befolgt (dem Indexierungscrawler für Google).

• publisher: der Name des Verlegers des Dokuments.

• robots: das Verhalten, das kooperative Crawler oder "Roboter" mit der Seite verwenden sollten. Es ist eine kommagetrennte Liste der unten stehenden Werte:

  Wert	Beschreibung	Verwendet von
  index	Erlaubt dem Roboter, die Seite zu indexieren (Standard).	Alle
  noindex	Fordert den Roboter auf, die Seite nicht zu indexieren.	Alle
  follow	Erlaubt dem Roboter, den Links auf der Seite zu folgen (Standard).	Alle
  nofollow	Fordert den Roboter auf, den Links auf der Seite nicht zu folgen.	Alle
  all	Entspricht index, follow	Google
  none	Entspricht noindex, nofollow	Google
  noarchive	Fordert die Suchmaschine auf, den Seiteninhalt nicht zu cachen.	Google, Yahoo, Bing
  nosnippet	Verhindert die Anzeige einer Beschreibung der Seite in den Suchmaschinenergebnissen.	Google, Bing
  noimageindex	Fordert diese Seite auf, nicht als die verweisende Seite eines indizierten Bildes angezeigt zu werden.	Google
  nocache	Synonym von noarchive.	Bing

  Hinweis:

  • Nur kooperative Roboter befolgen diese Regeln. Erwarten Sie nicht, dass Sie E-Mail-Erntewerkzeuge damit verhindern können.
  • Der Roboter muss die Seite dennoch abrufen, um diese Regeln zu lesen. Um Bandbreitenverbrauch zu vermeiden, ziehen Sie in Betracht, ob die Verwendung einer robots.txt-Datei geeigneter ist.
  • Das <meta name="robots">-Element und die robots.txt-Datei dienen unterschiedlichen Zwecken: robots.txt steuert das Crawlen von Seiten und beeinflusst nicht das Indexieren oder anderes Verhalten, das vom robots-Meta gesteuert wird. Eine Seite, die nicht gecrawlt werden kann, kann dennoch indiziert werden, wenn sie von einem anderen Dokument referenziert wird.
  • Wenn Sie eine Seite entfernen möchten, funktioniert noindex, aber erst nachdem der Roboter die Seite erneut besucht hat. Stellen Sie sicher, dass die robots.txt-Datei keine erneuten Besuche verhindert.
  • Einige Werte schließen sich gegenseitig aus, wie index und noindex oder follow und nofollow. In diesen Fällen ist das Verhalten des Roboters undefiniert und kann zwischen ihnen variieren.
  • Einige Crawler-Roboter, wie Google, Yahoo und Bing, unterstützen dieselben Werte für den HTTP-Header X-Robots-Tag; dies ermöglicht es auch Nicht-HTML-Dokumenten wie Bildern, diese Regeln zu verwenden.

Andere Namen

• application-title: Wird verwendet, um die Titelleiste einer App für Webanwendungen anzupassen, die als eigenständige Apps auf unterstützenden Desktop-Betriebssystemen installiert sind. Während der Textinhalt des <title>-Elements normalerweise in Browser-Tabs angezeigt wird, wenn die App in einem Browser ausgeführt wird, kann der Metadatenname application-title verwendet werden, um einen anderen Titel für die Anwendung festzulegen, wenn sie als eigenständig installierte App ausgeführt wird.

• Viewport <meta>-Tag
• Metadaten: das <meta>-Element