HTML - metatagi

HTML pozwala na określenie metadanych - dodatkowych ważnych informacji o dokumencie na różne sposoby. Elementy META mogą służyć do dołączania par nazwa / wartość opisujących właściwości dokumentu HTML, takie jak autor, data wygaśnięcia, lista słów kluczowych, autor dokumentu itp.

Plik <meta>tag służy do dostarczania takich dodatkowych informacji. Ten znacznik jest pustym elementem i dlatego nie ma tagu zamykającego, ale zawiera informacje w swoich atrybutach.

Możesz umieścić jeden lub więcej metatagów w swoim dokumencie w zależności od tego, jakie informacje chcesz zachować w dokumencie, ale ogólnie metatagi nie wpływają na fizyczny wygląd dokumentu, więc z punktu widzenia wyglądu nie ma znaczenia, czy dołączysz je czy nie.

Dodawanie metatagów do dokumentów

Możesz dodawać metadane do swoich stron internetowych, umieszczając znaczniki <meta> w nagłówku dokumentu, który jest reprezentowany przez <head> i </head>tagi. Metatag może mieć następujące atrybuty oprócz atrybutów podstawowych -

Sr.No Atrybut i opis
1

Name

Nazwa nieruchomości. Może być wszystko. Przykłady obejmują słowa kluczowe, opis, autora, poprawkę, generator itp.

2

content

Określa wartość właściwości.

3

scheme

Określa schemat interpretacji wartości właściwości (zgodnie z deklaracją w atrybucie treści).

4

http-equiv

Używany do nagłówków wiadomości odpowiedzi HTTP. Na przykład http-equiv można użyć do odświeżenia strony lub ustawienia pliku cookie. Wartości obejmują content-type, expires, refresh i set-cookie.

Określanie słów kluczowych

Możesz użyć tagu <meta>, aby określić ważne słowa kluczowe związane z dokumentem, a później te słowa kluczowe będą używane przez wyszukiwarki podczas indeksowania strony internetowej w celu wyszukiwania.

Przykład

Poniżej znajduje się przykład, w którym dodajemy HTML, metatagi, metadane jako ważne słowa kluczowe dotyczące dokumentu.

<!DOCTYPE html>
<html>
   
   <head>
      <title>Meta Tags Example</title>
      <meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
   </head>
   
   <body>
      <p>Hello HTML5!</p>
   </body>
   
</html>

To da następujący wynik -

Opis dokumentu

Możesz użyć tagu <meta>, aby podać krótki opis dokumentu. To znowu może być używane przez różne wyszukiwarki podczas indeksowania strony internetowej w celu wyszukiwania.

Przykład

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
      <meta name = "description" content = "Learning about Meta Tags." />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
   
</html>

Data weryfikacji dokumentu

Możesz użyć tagu <meta>, aby podać informacje o ostatniej aktualizacji dokumentu. Informacje te mogą być używane przez różne przeglądarki internetowe podczas odświeżania strony internetowej.

Przykład

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
      <meta name = "description" content = "Learning about Meta Tags." />
      <meta name = "revised" content = "Tutorialspoint, 3/7/2014" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Odświeżanie dokumentu

Tag <meta> może służyć do określenia czasu, po którym strona internetowa będzie się automatycznie odświeżać.

Przykład

Jeśli chcesz, aby Twoja strona odświeżała się co 5 sekund, użyj następującej składni.

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
      <meta name = "description" content = "Learning about Meta Tags." />
      <meta name = "revised" content = "Tutorialspoint, 3/7/2014" />
      <meta http-equiv = "refresh" content = "5" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Przekierowanie strony

Możesz użyć tagu <meta>, aby przekierować swoją stronę na dowolną inną stronę internetową. Możesz także określić czas trwania, jeśli chcesz przekierować stronę po określonej liczbie sekund.

Przykład

Poniżej znajduje się przykład przekierowania bieżącej strony na inną stronę po 5 sekundach. Jeśli chcesz natychmiast przekierować stronę, nie określaj atrybutu treści .

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
      <meta name = "description" content = "Learning about Meta Tags." />
      <meta name = "revised" content = "Tutorialspoint, 3/7/2014" />
      <meta http-equiv = "refresh" content = "5; url = http://www.tutorialspoint.com" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Ustawianie plików cookie

Pliki cookie to dane przechowywane w małych plikach tekstowych na komputerze i wymieniane między przeglądarką internetową a serwerem sieciowym w celu śledzenia różnych informacji w zależności od potrzeb aplikacji internetowej.

Możesz użyć tagu <meta> do przechowywania plików cookie po stronie klienta, a później te informacje mogą być wykorzystane przez serwer sieci Web do śledzenia osoby odwiedzającej witrynę.

Przykład

Poniżej znajduje się przykład przekierowania bieżącej strony na inną stronę po 5 sekundach. Jeśli chcesz natychmiast przekierować stronę, nie określaj atrybutu treści .

<!DOCTYPE html>
<html>
   <head>
      <title>Meta Tags Example</title>
      <meta http-equiv = "cookie" content = "userid = xyz; expires = Wednesday, 08-Aug-15 23:59:59 GMT;" />
         
   </head>
   <body>
      <p>Hello HTML5!</p>
   </body>
</html>

Jeśli nie podasz daty i godziny wygaśnięcia, plik cookie jest uważany za sesyjny i zostanie usunięty, gdy użytkownik wyjdzie z przeglądarki.

Note- Możesz zapoznać się z samouczkiem dotyczącym PHP i plików cookie, aby uzyskać szczegółowe informacje na temat plików cookie.

Ustawianie nazwy autora

Możesz ustawić nazwisko autora na stronie internetowej za pomocą metatagu. Zobacz przykład poniżej -

Przykład

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
      <meta name = "description" content = "Learning about Meta Tags." />
      <meta name = "author" content = "Mahnaz Mohtashim" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Określ zestaw znaków

Możesz użyć tagu <meta>, aby określić zestaw znaków używany na stronie internetowej.

Przykład

Domyślnie serwery i przeglądarki internetowe używają kodowania ISO-8859-1 (Latin1) do przetwarzania stron internetowych. Poniżej znajduje się przykład ustawienia kodowania UTF-8 -

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
      <meta name = "description" content = "Learning about Meta Tags." />
      <meta name = "author" content = "Mahnaz Mohtashim" />
      <meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>

Aby strona statyczna była wyświetlana z tradycyjnymi chińskimi znakami, strona internetowa musi zawierać tag <meta> w celu ustawienia kodowania Big5 -

<!DOCTYPE html>
<html>

   <head>
      <title>Meta Tags Example</title>
      <meta name = "keywords" content = "HTML, Meta Tags, Metadata" />
      <meta name = "description" content = "Learning about Meta Tags." />
      <meta name = "author" content = "Mahnaz Mohtashim" />
      <meta http-equiv = "Content-Type" content = "text/html; charset = Big5" />
   </head>
	
   <body>
      <p>Hello HTML5!</p>
   </body>
	
</html>