Eine Sammlung gängiger Verwendungen von HTML-Meta-Tags

Eine Sammlung gängiger Verwendungen von HTML-Meta-Tags

Was ist ein Mata-Tag?
Das <meta>-Element liefert Metainformationen über die Seite, beispielsweise eine Beschreibung und Schlüsselwörter für Suchmaschinen sowie die Aktualisierungshäufigkeit.
Der <meta>-Tag wird im Kopf des Dokuments platziert und enthält keinen Inhalt. Die Attribute des <meta>-Tags definieren mit dem Dokument verknüpfte Name/Wert-Paare.
Meta ist ein Hilfstag im Kopfbereich der HTML-Sprache. Wir können Meta-Tags auf fast allen Webseiten sehen, aber sie sind auf der Browser-Anzeigeseite nicht sichtbar. Vielleicht denken Sie, diese Codes seien entbehrlich. Tatsächlich sind Meta-Tags sehr wichtig und haben praktische Auswirkungen auf Ihre Website. Beispielsweise wird die Website-Beschreibung () im Suchmaschinenindex angezeigt. Verwenden Sie beispielsweise Meta-Tags, um die Website-Kodierung auf gbk2312 oder utf-8 einzustellen. Meta-Tags legen Schlüsselwörter fest

Grundlegende Syntax

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta    Name = "Schlüsselwörter"     Inhalt = "Stichwort 1, Stichwort 2, Stichwort 3..." >   

Die Funktion von Keyword-Tags besteht darin, Suchmaschinen mitzuteilen, worum es bei den Inhalten der Website geht, um Suchmaschinen das Definieren und Indizieren der Website zu erleichtern. Schlüsselwörter werden in der englischen Eingabemethode durch Kommas getrennt und die Länge von Schlüsselwörtern beträgt im Allgemeinen nicht mehr als 100 Zeichen.
Wenn es auf unserer Website beispielsweise um das Erlernen von Webentwicklungstechnologien geht, kann die Keyword-Beschreibung folgendermaßen lauten:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta    Name = "Schlüsselwörter"     Inhalt = "HTML-Tutorial, CSS-Tutorial, Javascript-Tutorial" >   

Wenn Benutzer in Suchmaschinen nach diesen Schlüsselwörtern suchen, wird Ihre Website in den Ergebnissen angezeigt. Da jedoch viele Betrüger (Black Hat SEO) in der Anfangszeit Keyword-Stacking verwendeten, reagieren Suchmaschinen (Baidu) nicht mehr so ​​empfindlich auf Schlüsselwörter.

Beschreibung der Meta-Tag-Einstellungen
Syntax:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta    Name = "Beschreibung" Inhalt = "Beschreibung Inhalt" >   

Die Beschreibung der Webseite ist sehr wichtig und kann direkt in der Suchmaschine angezeigt werden. Wenn Sie beispielsweise die Baidu-Website öffnen und nach „Sina“ suchen, wird die folgende Seite angezeigt:

Meta-Tag zum Festlegen des Zeichensatzes
Syntax:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta   http-equiv ="Inhaltstyp" Inhalt ="text/html; Zeichensatz ="Kodierung" >   

Zu den gängigen Kodierungsformaten gehören die chinesische Kodierung (gbk2312) und die internationale Kodierung (UTF-8). gbk2312 ist die chinesische Kodierung. Wenn der Inhalt Ihrer Website vollständig auf Chinesisch ist, verwenden Sie gbk2312. UTF-8 ist universell für Text rund um die internationale Kodierung (einschließlich Chinesisch und Englisch). Der Hauptunterschied zwischen ihnen besteht darin, dass gbk2312 speziell für Chinesisch entwickelt wurde und ein chinesisches Zeichen 2 Zeichen einnimmt. UTF-8 ist universell und ein chinesisches Zeichen nimmt 3 Bytes ein. Früher waren die Netzwerkbandbreitenressourcen knapp, sodass die Verwendung der gbk2312-Kodierung Bandbreite sparen und das Öffnen von Webseiten beschleunigen konnte, aber jetzt beträgt unsere Bandbreite zu Hause 4 M und mehr und wir ignorieren die eingesparten Bytes völlig.
Beispiel:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta   http-equiv = "Inhaltstyp"   Inhalt = "Text/HTML; Zeichensatz=utf-8"   >   

Beim Surfen im Internet sind die meisten Leute schon auf verstümmelte Seiten gestoßen. Das Kodierungsformat ermöglicht dem Browser die Analyse in einem festgelegten Bearbeitungsformat. Wenn das Kodierungsformat falsch ist, erscheinen verstümmelte Zeichen. Ich schlage daher vor, die universelle UTF-8-Kodierung zu verwenden, damit alle Browser auf der ganzen Welt unsere Webseiten normal anzeigen können.

Meta-Tag zum Festlegen der automatischen Aktualisierungszeit
Syntax

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta   http-equiv ="aktualisieren" content ="Aktualisierungsintervallzeit" >   

Die Aktualisierungszeit wird in Sekunden angegeben. Beispielsweise kann die Forumseite neue Beiträge erst nach der Aktualisierung sehen. Für Seiten, die so schnell aktualisiert werden, können Sie einen automatischen Aktualisierungscode hinzufügen, um sicherzustellen, dass Sie die neueste Seite sehen können.
Beispiel:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta   http-equiv ="aktualisieren" Inhalt ="3" >   

Hier haben wir die Zeit auf 3 Sekunden eingestellt, testen Sie es bitte selbst.

Durch die Meta-Tag-Einstellung wird automatisch zu einer neuen Seite gesprungen
Syntax

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta   http-equiv ="refresh" content ="Anzahl der Sekunden zwischen Sprüngen; Url ="neue Webseitenadresse" >   

Beispiel:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta   http-equiv ="aktualisieren" Inhalt ="3; Url ="http://www.adminwang.com" >   

Wenn der Browser diese Seite öffnet, springt er nach 3 Sekunden automatisch zur Homepage unserer Website.

Meta-Tag-Einstellung zum Deaktivieren des Cache
Syntax

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta   http-equiv = "Cache-Steuerung"    Inhalt = "kein Cache"   />   

Wir wissen, dass Browser über einen Cache-Mechanismus verfügen, was bedeutet, dass beim Öffnen einer Webseite diese automatisch lokal gespeichert wird. Dies dient dazu, die zwischengespeicherten Dateien direkt aufzurufen, wenn Sie die Seite innerhalb einer bestimmten Zeitspanne erneut besuchen, um die Zugriffsgeschwindigkeit zu verbessern. Für Seiten wie Foren, die sich von Zeit zu Zeit ändern, möchten wir jedoch nicht, dass der Browser Cache-Dateien speichert. Daher können wir diesen Code hinzufügen. Es gibt noch eine weitere Verwendung in der Programmentwicklung. Wenn Sie während des Programm-Debuggings von Zeit zu Zeit die Auswirkungen von Codeänderungen überprüfen möchten, können Sie diesen Code verwenden, um den Browser-Cache zu deaktivieren.
Eine andere Schreibweise:

XML/HTML-CodeInhalt in die Zwischenablage kopieren
  1. < Meta   http-equiv = "Pragma"   Inhalt = "kein Cache"   >   

<<:  Detaillierte Schritte zum Bereitstellen von Microsoft SQL Server mit Docker

>>:  Lösung für „Spezialisierter Schlüssel war zu lang“ in MySQL

Artikel empfehlen

Detaillierte Erläuterung der logischen Architektur von MySQL

1. Gesamtarchitekturdiagramm Im Vergleich zu ande...

Details zum Schreiben von React in einem Vue-Projekt

Wir können jsx/tsx-Dateien direkt erstellen Die P...

So löschen Sie verstümmelte oder mit Sonderzeichen versehene Dateien in Linux

Aus Kodierungsgründen werden beim Hochladen oder ...

Eine kurze Analyse des MySQL-Index

Ein Datenbankindex ist eine Datenstruktur, deren ...

So konfigurieren Sie /var/log/messages im Ubuntu-Systemprotokoll

1. Problembeschreibung Heute muss ich die Systemp...

ElementUI-Komponente el-dropdown (Falle)

Auswählen und ändern: Klicken Sie, um den aktuell...

So stellen Sie die LNMP-Architektur im Docker bereit

Umweltanforderungen: IP Hostname 192.168.1.1 Knot...

Schnelles Verständnis des Vue-Routing-Navigationsschutzes

Inhaltsverzeichnis 1. Globale Wache 1. Globale Fr...