Was ist das Meta-Tag in HTML? Welche Eigenschaften gibt es?

Meta bedeutet in HTML „Meta“. Es ist ein Hilfs-Tag im Head-Bereich. Es enthält keinen Inhalt und wird verwendet, um Metainformationen über die Seite bereitzustellen, beispielsweise für Suchmaschinen und Aktualisierungshäufigkeit . Beschreibung und Schlüsselwörter; die Attribute des Meta-Tags definieren die mit dem Dokument verknüpften Name/Wert-Paare.

Das Meta-Tag in HTML ist ein Hilfs-Tag im Kopfbereich. Es wird im Allgemeinen für Seitenbeschreibungen, Schlüsselwörter und andere Metadaten verwendet Browser, Suchmaschinen usw. Es verfügt über vier Attribute: Namensattribut, http-equiv-Attribut, Inhaltsattribut und Schemaattribut.

Im Prozess des Frontend-Lernens ist das meiste Verständnis von Meta-Tags Wir werden diesen Satz sehen, wenn wir eine Website öffnen, aber wir tun es nicht Ich weiß nichts über Meta-Tags. Als nächstes werde ich dieses Label im Detail vorstellen, was hoffentlich für alle hilfreich ist.

[Empfohlener Kurs: HTML-Tutorial]

Meta-Tag-Einführung

Meta-Tag ist HTML Ein Hilfstag im Sprachkopfbereich, der häufig zum Definieren der Seitenbeschreibung, der Schlüsselwörter, des Datums der letzten Änderung und anderer Metadaten verwendet wird. Diese Metadaten werden an Browser, Suchmaschinen und andere Webdienste weitergeleitet.

Die Zusammensetzung des Meta-Tags

Meta-Tag hat zwei Attribute, nämlich das http-equiv-Attribut und das Namensattribut.

Namensattribut

Das Namensattribut wird hauptsächlich zur Beschreibung von Webseiten wie Schlüsselwörtern, Erzählungen usw. der Webseite verwendet. Der entsprechende Attributwert ist Inhalt. Der Inhalt im Inhalt ist eine spezifische Beschreibung des Namenseingabetyps, der für Suchmaschinen bequem zu crawlen ist. Das Syntaxformat des Namensattributs im

Meta-Tag lautet:

<meta name="参数" content="具体的描述">

Das Namensattribut hat die folgenden Parameter. (A-C sind häufige Attribute)

(1) Schlüsselwörter (Schlüsselwörter)

Beschreibung: Wird verwendet, um Suchmaschinen die Schlüsselwörter Ihrer Webseite mitzuteilen. Beispiel:

<meta name="keywords" content="PHP中文网">

(2) Beschreibung (Beschreibung des Website-Inhalts)

Beschreibung: Wird verwendet, um Suchmaschinen den Hauptinhalt Ihrer Website mitzuteilen. Beispiel:

<meta name="description" content="php中文网提供大量免费、原创、高清的php视频教程">

(3) Viewport (Fenster des mobilen Terminals)

Erklärung: Dieses Konzept ist relativ komplex und wird im nächsten Blogbeitrag ausführlich besprochen. Dieses Attribut wird häufig beim Entwerfen mobiler Webseiten verwendet. Viewport wurde bei der Verwendung von Frameworks wie Bootstrap und AmazeUI verwendet.

<meta name="viewport" content="width=device-width, initial-scale=1">

(4) Robots (definieren die Indexierungsmethode von Suchmaschinen-Crawlern)

Beschreibung: Robots werden verwendet, um Crawlern mitzuteilen, welche Seiten indiziert werden müssen und welche Seiten müssen nicht indiziert werden. Zu den Inhaltsparametern gehören all, none, index, noindex, follow und nofollow. Der Standardwert ist alle.

<meta name="robots" content="none">

Die spezifischen Parameter sind wie folgt:

1 none: Suchmaschinen ignorieren diese Webseite, was noindex und nofollow entspricht.
2. noindex: Suchmaschinen indizieren diese Seite nicht.
3. nofollow: Suchmaschinen durchsuchen andere Webseiten nicht weiter über den Linkindex dieser Webseite.
4. Alle: Die Suchmaschine indiziert diese Webseite und indiziert weiterhin die Links über diese Webseite, was dem Indexieren und Folgen entspricht.
5. Index: Suchmaschinen indizieren diese Webseite.
6. Folgen: Die Suchmaschine durchsucht weiterhin andere Webseiten über den Linkindex dieser Webseite.

(5) Autor (Autor)

Beschreibung: Wird verwendet, um den Autor der Webseite zu kennzeichnen:

<meta name="author" content="PHP中文网">

( 6) Generator (Webseiten-Produktionssoftware)

Beschreibung: Ein Beispiel dafür, welche Software verwendet wird, um die Webseite anzuzeigen: (Ich weiß nicht, ob es so geschrieben werden kann):

<meta name="generator" content="Sublime Text3">

(7) copyright )

Erklärung: Beispiel für die Kennzeichnung von Copyright-Informationen:

<meta name="copyright" content="PHP中文网"> //代表该网站为PHP中文网个人版权所有。

(8) revisit-after (Suchmaschinen-Crawler Wiederbesuchszeit)

Hinweis: Wenn die Seite nicht häufig aktualisiert wird, können Sie eine Crawler-Wiederbesuchszeit festlegen, um den durch Suchmaschinen-Crawler verursachten Druck auf den Server zu verringern. Wenn die Wiederbesuchszeit zu kurz ist, besuchen Crawler die Website zur definierten Standardzeit. Beispiel:

<meta name="revisit-after" content="7 days" >

(9) Renderer (Dual-Core-Browser-Rendering-Methode)

Beschreibung: Der Renderer ist für Dual-Core-Browser vorbereitet und wird zur Angabe der Standardeinstellung verwendet für Dual-Core-Browser So rendern Sie die Seite. Zum Beispiel 360-Browser. Beispiel:

<meta name="renderer" content="webkit"> //默认webkit内核
<meta name="renderer" content="ie-comp"> //默认IE兼容模式
<meta name="renderer" content="ie-stand"> //默认IE标准模式

http-equiv-Attribut

http-equiv entspricht, wie der Name schon sagt, der Rolle von HTTP. Das Syntaxformat des http-equiv-Attributs im

Meta-Tag lautet:

<meta http-equiv="参数" content="具体的描述">

Das http-equiv-Attribut hat hauptsächlich die folgenden Parameter:

(1 ) Inhaltstyp (Webseiten-Zeichensatz festlegen) (empfohlen die Verwendung der HTML5-Methode)

Beschreibung: Wird zum Festlegen des Webseiten-Zeichensatzes verwendet, um das Parsen und Rendern der Seite im Browser zu erleichtern

<meta http-equiv="content-Type" content="text/html;charset=utf-8">  //旧的HTML，不推荐

<meta charset="utf-8"> //HTML5设定网页字符集的方式，推荐使用UTF-8

(2) (Im Allgemeinen auf den neuesten Modus eingestellt, diese Einstellung ist auch in wichtigen Frameworks sehr häufig.)

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/> //指定IE和Chrome使用最新版本渲染当前页面

(3) Cache-Steuerung (geben Sie den Caching-Mechanismus an, gefolgt von Anforderungen und Antworten)

Beschreibung: Weisen Sie den Browser an, wie eine Antwort zwischengespeichert wird und wie lange sie zwischengespeichert wird

<meta http-equiv="cache-control" content="no-cache">

共有以下几种用法：

no-cache: 先发送请求，与服务器确认该资源是否被更改，如果未被更改，则使用缓存。

no-store: 不允许缓存，每次都要去服务器上，下载完整的响应。（安全措施）

public : 缓存所有响应，但并非必须。因为max-age也可以做到相同效果

private : 只为单个用户缓存，因此不允许任何中继进行缓存。（比如说CDN就不允许缓存private的响应）

maxage : 表示当前请求开始，该响应在多久内能被缓存和重用，而不去服务器重新请求。例如：max-age=60表示响应可以再缓存和重用 60 秒。

禁止百度自动转码

说明：用于禁止当前页面在移动端浏览时，被百度自动转码。虽然百度的本意是好的，但是转码效果很多时候却不尽人意。所以可以在head中加入例子中的那句话，就可以避免百度自动转码了。

<meta http-equiv="Cache-Control" content="no-siteapp" />

（4）expires(网页到期时间)

说明:用于设定网页的到期时间，过期后网页必须到服务器上重新传输。

<meta http-equiv="expires" content="Sunday 26 October 2016 01:00 GMT" />

（5） refresh(自动刷新并指向某页面)

说明：网页将在设定的时间内，自动刷新并调向设定的网址。

<meta http-equiv="refresh" content="2；URL=http://www.php.cn/"> //意思是2秒后跳转到PHP中文网

（6） Set-Cookie(cookie设定)

说明：如果网页过期。那么这个网页存在本地的cookies也会被自动删除。

<meta http-equiv="Set-Cookie" content="name, date"> //格式
<meta http-equiv="Set-Cookie" content="User=Lxxyx; path=/; expires=Sunday, 10-Jan-16 10:00:00 GMT"> //具体范例

content 属性

content 属性提供了名称/值对中的值。该值可以是任何有效的字符串。

content 属性始终要和 name 属性或 http-equiv 属性一起使用。

scheme 属性

scheme 属性用于指定要用来翻译属性值的方案。此方案应该在由 标签的 profile 属性指定的概况文件中进行了定义。

总结：meta标签的自定义属性实在太多了。所以只总结了一些常用的，希望对大家有所帮助。

Das obige ist der detaillierte Inhalt vonWas ist das Meta-Tag in HTML? Welche Eigenschaften gibt es?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!