HTML - metatags
O HTML permite especificar metadados - informações adicionais importantes sobre um documento de várias maneiras. Os elementos META podem ser usados para incluir pares de nome / valor que descrevem propriedades do documento HTML, como autor, data de validade, uma lista de palavras-chave, autor do documento, etc.
o <meta>tag é usada para fornecer essas informações adicionais. Esta tag é um elemento vazio e, portanto, não possui uma tag de fechamento, mas carrega informações em seus atributos.
Você pode incluir uma ou mais meta tags em seu documento com base nas informações que deseja manter em seu documento, mas em geral, meta tags não afetam a aparência física do documento, portanto, do ponto de vista da aparência, não importa se você incluir eles ou não.
Adicionando metatags aos seus documentos
Você pode adicionar metadados às suas páginas da web, colocando tags <meta> dentro do cabeçalho do documento, que é representado por <head> e </head>Tag. Uma metatag pode ter os seguintes atributos, além dos atributos principais -
| Sr. Não | Atributo e descrição |
|---|---|
| 1 | Name Nome da propriedade. Pode ser qualquer coisa. Os exemplos incluem palavras-chave, descrição, autor, revisado, gerador, etc. |
| 2 | content Especifica o valor da propriedade. |
| 3 | scheme Especifica um esquema para interpretar o valor da propriedade (conforme declarado no atributo content). |
| 4 | http-equiv Usado para cabeçalhos de mensagem de resposta http. Por exemplo, http-equiv pode ser usado para atualizar a página ou para definir um cookie. Os valores incluem content-type, expires, refresh e set-cookie. |
Especificando palavras-chave
Você pode usar a tag <meta> para especificar palavras-chave importantes relacionadas ao documento e, posteriormente, essas palavras-chave são usadas pelos motores de busca ao indexar sua página da web para fins de pesquisa.
Exemplo
A seguir está um exemplo, onde estamos adicionando HTML, Meta Tags, Metadados como palavras-chave importantes sobre o documento.
<!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>Isso produzirá o seguinte resultado -
Descrição do Documento
Você pode usar a tag <meta> para dar uma breve descrição sobre o documento. Isso novamente pode ser usado por vários motores de busca ao indexar sua página da web para fins de pesquisa.
Exemplo
<!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 de Revisão do Documento
Você pode usar a tag <meta> para fornecer informações sobre quando o documento foi atualizado pela última vez. Essas informações podem ser usadas por vários navegadores da web ao atualizar sua página da web.
Exemplo
<!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>Atualização de documento
Uma tag <meta> pode ser usada para especificar um período após o qual sua página da web continuará sendo atualizada automaticamente.
Exemplo
Se você quiser que sua página continue atualizando a cada 5 segundos, use a seguinte sintaxe.
<!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>Redirecionamento de página
Você pode usar a tag <meta> para redirecionar sua página para qualquer outra página da web. Você também pode especificar uma duração se quiser redirecionar a página após um determinado número de segundos.
Exemplo
A seguir está um exemplo de redirecionamento da página atual para outra página após 5 segundos. Se você deseja redirecionar a página imediatamente, não especifique o atributo de conteúdo .
<!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>Configurando Cookies
Cookies são dados armazenados em pequenos arquivos de texto no seu computador e são trocados entre o navegador da web e o servidor da web para manter o controle de várias informações com base nas necessidades do seu aplicativo da web.
Você pode usar a tag <meta> para armazenar cookies no lado do cliente e, posteriormente, essas informações podem ser usadas pelo servidor da Web para rastrear um visitante do site.
Exemplo
A seguir está um exemplo de redirecionamento da página atual para outra página após 5 segundos. Se você deseja redirecionar a página imediatamente, não especifique o atributo de conteúdo .
<!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>Se você não incluir a data e hora de expiração, o cookie será considerado um cookie de sessão e será excluído quando o usuário sair do navegador.
Note- Você pode verificar o tutorial de PHP e Cookies para detalhes completos sobre Cookies.
Definir nome do autor
Você pode definir um nome de autor em uma página da web usando metatag. Veja um exemplo abaixo -
Exemplo
<!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>Especificar Conjunto de Caracteres
Você pode usar a tag <meta> para especificar o conjunto de caracteres usado na página da web.
Exemplo
Por padrão, os servidores e navegadores da Web usam a codificação ISO-8859-1 (Latin1) para processar páginas da Web. A seguir está um exemplo para definir a codificação 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>Para veicular a página estática com caracteres chineses tradicionais, a página da web deve conter uma tag <meta> para definir a codificação 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>