Elementos de Cabeçalho HTML

Mais exemplos

Título do documento
O título <title> define o título do documento.
Todos os links com um alvo
Como usar a tag base para abrir todos os rótulos da página em uma nova janela.
Descrição do documento
Use o elemento <meta> para descrever o documento.
Palavras-chave do documento
Use o elemento <meta> para definir as palavras-chave do documento.
Redirecionar o usuário
Como redirecionar o usuário para um novo endereço da web.

Elemento <head> do HTML

O elemento <head> é o contêiner de todos os elementos de cabeçalho. Os elementos dentro do <head> podem conter scripts, indicar onde o navegador pode encontrar folhas de estilo, fornecer informações meta, etc.

Os seguintes elementos podem ser adicionados à seção head: <title>, <base>, <link>, <meta>, <script> e <style>.

Elemento <title> do HTML

A tag <title> define o título do documento.

O elemento title é obrigatório em todos os documentos HTML/XHTML.

O elemento title pode:

  • Título definido na barra de ferramentas do navegador
  • Título exibido quando a página é adicionada aos favoritos
  • Título da página exibido nos resultados de busca do motor de busca

Um documento HTML simplificado:

<!DOCTYPE html>
<html>
<head>
<title>Título do documento</title>
</head>
<body>
O conteúdo do documento......
</body>
</html>

Elemento <base> do HTML

A tag <base> define o endereço padrão ou o alvo padrão (target) para todos os links na página:

<head>
<base href="http://www.codew3c.com/images/" />
<base target="_blank" />
</head>

Elemento <link> do HTML

A tag <link> define a relação entre o documento e recursos externos.

A tag <link> é mais comumente usada para conectar folhas de estilo:

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>

Elemento <style> do HTML

A tag <style> é usada para definir informações de estilo para o documento HTML.

Você pode definir estilos para elementos HTML dentro do elemento style:

<head>
<style type="text/css">
body {cor-fundo: amarelo}
p {cor: azul}
</style>
</head>

Elemento <meta> do HTML

Os metadados (metadata) são informações sobre dados.

A tag <meta> fornece metadados sobre o documento HTML. Os metadados não são exibidos na página, mas são legíveis por máquinas.

Em situações típicas, o elemento meta é usado para definir a descrição da página, palavras-chave, autor do documento, data da última modificação e outros metadados.

A tag <meta> sempre está localizada dentro do elemento <head>.

Os metadados podem ser usados em navegadores (como exibir conteúdo ou recarregar a página), motores de busca (palavras-chave) e outros serviços da web.

Palavras-chave para motores de busca

Alguns motores de busca utilizam os atributos name e content do elemento meta para indexar sua página.

O seguinte elemento meta define a descrição da página:

<meta name="description" content="Tutoriais gratuitos de Web sobre HTML, CSS, XML" />

O seguinte elemento meta define as palavras-chave da página:

<meta name="keywords" content="HTML, CSS, XML" />

O papel dos atributos name e content é descrever o conteúdo da página.

Elemento <script> do HTML

A etiqueta <script> é usada para definir scripts do cliente, como JavaScript.

Vamos explicar o elemento script em um capítulo posterior.

Elementos de Cabeçalho HTML

Etiqueta Descrição
<head> Definir informações sobre o documento.
<title> Definir o título do documento.
<base> Definir o endereço ou alvo padrão de todos os links na página.
<link> Definir relações entre o documento e recursos externos.
<meta> Definir metadados do documento HTML.
<script> Definir scripts do cliente.
<style> Definir informações de estilo do documento.