A tag head é uma parte muito importante da estrutura de um documento HTML. Ela é usada para .definir informações do documento que não são exibidas no conteúdo da página. A tag head suporta as tags: <title>
, <meta>
, <link>
, <style>
, <script>
e <base>
, que são usadas para fornecer informações importantes sobre a página, como o título, a descrição, os estilos, os scripts e os links relacionados ao documento.
Tags para mecanismos de busca como Google e Bing
Título da página
<title>Webship - Desenvolvimento e design web</title>
Tags link
<link rel="" href="" />
// favicon
<link rel="shortcut icon" href="favicon.png" />
<link rel="apple-touch-icon" href="favicon.png" />
Tags meta
Codificacao
<meta charset="utf-8" />
Define site responsivo
<meta name="viewport" content="width=device-width, initial-scale=1" />
Descrição da página
<meta name="description" content="Descrição do conteudo da pagina (mínimo 50 e máximo 160 caracteres)" />
Palavras chave
<meta name="keywords" content="HTML, CSS, JavaScript, PHP, SQL" />
<meta name="author" content="Webship" />
<meta name="reply-to" content="email@webship.com">
Meta tag instruindo os rastreadores da Web (mecanismos de busca) a não indexar a página nem mesmo rastrear qualquer link na mesma
<meta name="robots" content="noindex, nofollow" />
Meta tags Twitter Card
<meta name="twitter:card" value="summary_large_image" />
<meta name="twitter:site" content="Conta do Twitter do site (incluindo arroba)" />
<meta name="twitter:creator" content="Conta do Twitter do autor do texto (incluindo arroba)" />
<meta name="twitter:title" content="Título da página" />
<meta name="twitter:description" content="Descrição da página. No máximo 200 caracteres" />
( imagens para o Twitter Summary Card precisam ter pelo menos 200×200 px )
<meta name="twitter:image" content="http://www.example.com/image.png" />
Meta tags Open Graph (facebook)
<meta property="fb:app_id" content="212726425743313" />
<meta property="article:author" content="URL do site" />
<meta property="og:url" content=" URL da pagina" />
<meta property="og:site_name" content=" nome do site " />
<meta property="og:title" content=" titulo da pagina " />
<meta property="og:description" content=" descrição do conteudo da pagina " />
(og:image é recomendado que a imagem tenha no mínimo 1200x630 px)
<meta property="og:image" content=" link URL do caminho da imagem completo " />
<meta property="og:type" content="" /> // content: blog, website ou article
<meta property="article:published_time" content="2013-09-17T05:59:00+01:00" />
<meta property="article:modified_time" content="2013-09-16T19:08:47+01:00" />
<meta property="article:tag" content="Tags do artigo" />
Outras referencias:
https://www.webwiz.net/kb/seo/meta-tags-tutorial.htm
https://www.w3schools.com/tags/tag_meta.asp
Lista completa de meta tags: https://gist.github.com/lancejpollard/1978404
Comente no