Curso HTML – Aula 08

Por Guilherme Farias em 13 de junho de 2010

Hello Again =D
Nessa aula vamos finalmente conhecer as tags do cabeçalho, <HEAD>.

Titulo do navegador <title>

Apesar de ficar no cabeçalho do HTML e não aparecer no conteúdo, ele dá um nome que será exibido para a página. Esse nome aparece na barra do navegador ou nas abas de navegação. Portanto, é interessante usar essa tag:

<head>
<title>Nome da página</title>
</head>

Lembre-se de que esta tag fica no <head> do HTML, e não no <body>.
Há diversos outros marcadores usados pelo HTML. Aqui, foram citados somente os mais importantes e comuns. Mais adiante, serão mencionadas outras tags de informação ou inclusão. Porém, elas são transparentes para quem vê a página no navegador e servem apenas para acrescentar recursos, ou para colocar dados no cachê.

Meta tags <meta>

São tags de controle que não aparecem no conteúdo. Mas fazem muita coisa. Para começar, as chamadas metatags existem em dois grupos principais: as de http-equiv, que orientam o navegador a fazer algumas coisas, e as que são somente informativas. Os serviços de busca usam muito as metatags informativas para se orientar sobre como indexar e o que ver e mostrar das páginas.

Vamos apresentar algumas delas e comentar o que elas fazem. Existem muitas outras, mas raramente são empregadas. Atenção quanto ao uso de maiúsculas e minúsculas, pois alguns navegadores são sensíveis a este aspecto:

* http-equiv=”Content-Type” : Informa para o navegador que tipo de código HTML está sendo usado. Ajuda a codigicar quais caracteres especiais serão solicitados. Um exemplo seria <meta http-equiv= “Content-Type” content= “text/HTML; charset=isso-8859-1” />. Informamos que será usado código HTML para alocar a tábua de caracteres iso-8859-1 , para os caracteres do europeu ocidental. Poderíamos usar outras tábuas para grego, árabe, hebraico, russo, chinês ou japonês, entre outras. Também é muito comum usar como charset a tábua UTF-8;

* http-equiv=”Content-Language” : informa para o navegador qual idioma é o mais adequado para exibir a página, qual é o idioma nativo. Pode ser informado mais de um idioma, separado por espaços, se a página for multilíngua. Um exemplo seria <meta http-equiv=”Content-Language” content”pt-br” />. Informa o idioma português do Brasil. Alguns mecanismos de busca usam esta tag para filtrar o idioma;

* http-equiv=”refresh” : informa de quanto em quanto tempo se deve recarregar a página. Este recurso é muito usado se o conteúdo da página varia com muita freqüência, uma pagina de noticia, por exemplo, ou para trocar banners. O tempo é dado em segundos. Um exemplo seria <meta http-equiv=”refresh” content=”60″ />. Apesar de ser pouco recomendado, pois desorienta os usuários e pelo fato de os sites de busca não seguirem esse link, é possível orientar o navegador a fazer a recarga da página usando outro endereço. Isso pode ser interessante para redirecionar pessoas de um endereço antigo para o mais atual, enquanto exibe uma mensagem informando a mudança, nesse caso seria: <meta http-equiv=”refresh” content=”60″; url=”http://novo-site.com.br” />;

* http-equiv=”Cache-Control”; orienta o navegador a guardar ou não o conteúdo da memória. Pode receber os seguintes valores:
public : guarda todos os usuários do computador
private : guarda em conteúdo, mas somente para o usuário logado
no-cache : não guarda nada – mais lento, porém mais seguro.
no-store : guarda enquanto dura a sessão do navegador. Exemplo: <meta http-equiv=”Cache-Control” content=”no-cache, no-store” />

NOTA: alguns navegadores não entendem esta tag, mas usam “Pragma”, mostrado mais adiante. É bom sempre usar as duas para garantir que o navegador vai processar qualquer que seja.

* http-equiv=”Pragma” : tem a mesma função do anterior, mas é processado em mais navegadores. O problema é que não é tão rico em valores e pode somente ser usado para n~çao guardar nos temporários, ou não ser colocado. Um exemplo seria <meta http-equiv=”Pragma” content=”no-cache” />

* http-equiv=”expires” : informa para o navegador por quanto tempo o conteúdo da página tem valor. Se for usada uma data ou hora com sintaxe errada ou ilegal, o tempo de expiração será tido como zero, ou seja, não tem duração alguma. Alguns mecanismos de busca agendam revisita depois da data de expiração. Outros apenas deletam do banco de dados as páginas expiradas. Neste ultimo caso , um prazo igual a zero significará que a página nunca será armazenada. Um exemplo seria <http-equiv=”expires” content = “Mon, 22 jun 2010 11:30:05 GMT” />

* name=”description” : apresenta uma descrição do conteúdo da página. Alguns mecanismos de busca usam este campo para apresentar o resumo abaixo do link. Seja sempre cauteloso, usando uma frase enxuta e esclarecedora sobre o conteúro. Os mecanismos de busca não usam esta tag para saber o que há na página, apenas para exibir o resumo. Um exemplo seria: <meta name=”description” content=”Aprenda todas as metatags com este curso de HTML” />

* name=”author” : Como o próprio nome diz, apresenta o nome do autor do código. Um exemplo seria: <meta name=”author” content=”Guilherme Guiky” />

* name=”language” : esta era uma forma antiga de indicar o idioma da página. Ainda é interpretada por alguns mecanismos de busca, mas quase todos já migraram para o sistema anterior, que permite colocar mais de uma língua e também o pais. Um exemplo, <meta name=”language” content=”Portuguese” />

* name=”robots” : informa para os mecanismos de busca como armazenar a página. Podem ser usados os seguintes valores:
All : Valor-padrão, o robô de busca não recebe qualquer informação adicional e vai processar a página normalmente;
Index : os robôs de busca podem incluir a página normalmente;
Follow : Robôs podem indexar a página e ainda seguir links para outras páginas que ela contém;
NoIndex : os links podem ser seguidos, mas a página não é indexada;
NoFollow : a página é indexada, mas os links não são seguidos;
None : os robôs podem ignorar a página e os links dela;
NoArchive : a página não é arquivada (serve somente para o Google).
Um exemplo, <meta name”robots” content=”All” />

* name=”copyright” : informa os créditos para direitos autorais, Um exemplo seria <meta name=”copyright” content=”2010 Guiky Blog” />

* name=”rating” : Estabelece censura para visualizar o conteúdo da página. Podem ser usados os seguintes valores:
General : o conteúdo é livre para qualquer idade.
14 years : o conteúdo é impróprio para menores de 14 anos.
Mature : o conteúdo é impróprio para menores de idade.
Um exemplo seria: <meta name=”ratingt” content=”general” />

Veja as outras Aulas:

* Curso HTML – Aula 01
* Curso HTML – Aula 02
* Curso HTML – Aula 03
* Curso HTML – Aula 04
* Curso HTML – Aula 05
* Curso HTML – Aula 06
* Curso HTML – Aula 07
* Curso HTML – Aula 09

Comente!

Deixe uma resposta

O seu endereço de e-mail não será publicado.