Translate this page now :



»Programação
»Programação.NET
»Banco de Dados
»Webdesign
»Office
» Certificações Microsoft 4
»Treinamentos4
»Programação 4
»Webdesign«
»Office & User Tips«
»Grupos de Usuários
»Células Acadêmicas«

IMAC
 
 
Faça um pequeno teste com 10 questões de VB
.:.
Teste seus conhecimentos em Visual Basic, SQL Server e ASP 3.0 com nossas provas on-line
.:.
Aprimore seus conhecimentos em programação com nosso treinamento on-line de lógica de programação
.:.
Veja nosso calendário de treinamentos
Gostou da Página?
Então

para um amigo!

Google
 
Pesquisar Dicas:

 







Inscrições Abertas para as Novas Turmas de Webdesigner:


Saiba mais sobre o assunto



A Tag Meta


Um webdesign deve ter em mente, ao construir um site, todos os processos envolvidos nessa criação. Layout, disposição das páginas, relacionamento entre cores etc. E muitas vezes a parte da divulgação e informações sobre a elaboração daquela página fica em segundo plano.

Erro que deve e pode ser corrigido, de maneira fácil e rápida através do uso da tag Meta.
Esta tag que fica localizada no cabeçalho da página é subestimada por muitos webdesign. Mas a sua importância está crescendo a cada dia, afinal com os sites de busca usando scripts de varredura, chamados de "robots" ou "spiders", elas passam a ser de extrema utilidade para quem deseja ter o seu site difundido.

A tag metas pode ser dividida em quatro categorias principais:

a) De informação - as quais irão fornecer nome do autor, qual o editor de HTML foi utilizado para compor o site, tipo de caracteres utilizados entre outras;

b) De Divulgação - Este tipo funciona como as manchetes de jornal, resumindo o conteúdo das páginas para os scripts de varredura, chamados de "robots" ou "spiders" dos principais sites de busca;

c) De Efeitos - Proporcionando efeitos de transição ao entrar e sair da página.

d) Atualização - redirecionam o usuário para uma determinada página ou atualizam a página depois de um determinado tempo;

As tags Metas sempre aparecem entre as tags <head></head>, como mostra o exemplo abaixo:

<HTML>
<head>
<Title>Título da Página</title>
<Meta Name="Parâmetro" content="informação">
</head>

Nas Tags metas de informação os principais parâmetros são:

Author - informa que será apresentado o nome do criador da página.
Ex:
<Meta name="Author" content="Seu nome">

Copyright - data de copyright
Ex:
<meta name="copyright" conten="14/03/2003">

Generator - Editor de HTML utilizado
Ex:
<META NAME="generator" CONTENT="Dreamweave MX">


Nas tags de Divulgação a estrutura permanece a mesma, só modificando os parâmetros, antes de exemplificar cada um deles é importante lembrar algumas coisas:

a) Somente o uso da tag Meta para a divulgaçao não basta, embora importante e de qrande utilidade, outras formas de difundir o site não devem ser esquecidas, tais como: troca de links, divulgação em fóruns e salas de chat entre outras;

b) Ao colocar a informação na tag Meta seja sempre claro e objetivo, evite o uso de palavras repetidas ou uma quantidade exagerada de texto. Um bom exemplo é escrever as informações como se fossem manchetes de jornais, focalizando nos pontos mais importantes do seu site.

Keywords - Informa através de palavras chaves o conteúdo do site
Ex:
<meta Name="keywords" content="palavras chaves">

Description - Um resumo através de frases curtas do conteúdo do site.
Ex:
<meta name="description" content="resumo do site">

Robots - Informa aos "robôs " de alguns sistemas de buscas, se devem indexar apenas a primeira página (atributo INDEX) ou se devem continuar e indexar todas as páginas (atributo FOLLOW). Outros atributos são: "NOINDEX, NOFOLLOW"
Ex:
<meta name="robots" content="Index,Follow">

Information - Mesma função que o description - também devem ser escritas pequenas frases contendo o resumo do site.
<meta name="information" content=""frases curtas sobre o site">

META tags com o atributo "name " são usadas para outros tipos de controles que não correspondem as chamadas HTTP. Porém muitas vezes, alguns "robôs " não fazem distinção entre os valores em "name" ou "http-equiv". Mas o melhor é dividirmos da seguinte maneira: ao utilizarmos com a finalidade de atualizarmos ou aplicarmos efeitos de transição nas páginas, utilizamos HTTP, como no exemplo abaixo:

<HTML>
<HEAD>
<title> Título da Página</title>
<META HTTP-EQUIV="Content-type" CONTENT="text/html; charset=ISO-2022-JP">
</head>

Nesse exemplo mostrado acima a tag meta informa quais os conjuntos de caracteres utilizados pelo site. Geralmente os próprios editores de HTML geram automaticamente esta linha de código. Sendo Content-Type o parâmetro mais conhecido e corriqueiro.

Na linha de efeitos, essa tag faz com que ao entrar (page-enter) ou sair (page-exit) da página sejam aplicados efeitos parecidos com os do power point.

<META HTTP-EQUIV="Page-Enter" Content="revealTrans(Duration=0,Transition=1)">

Onde:

"Page-Enter" -> Quanto a página é carregada
"Page-Exit" -> Quando a página está saindo do browser
Duration = Define a velocidade do efeito
Transition = Tipo de efeito que pode ser - pode ir do número 1 até o número 23.

1 -> Abre a página em forma de um retangulo de dentro pra fora
2 -> Abre a página em forma de um retangulo de fora pra dentro
3 -> Abre a página em forma de um circulo de dentro pra fora
4 -> Abre a página em forma de uma rolagem de baixo pra cima
5 -> Abre a página em forma de uma rolagem de cima pra baixo
6 -> Abre a página em forma de uma rolagem de esquerda para a direita
7 -> Abre a página em forma de uma rolagem da direita para a esquerda
8 -> Abre a página em forma de múltiplas rolagens da esquerda para a direita
9 -> Abre a página em forma de múltiplas rolagens de cima pra baixo
10 -> Abre a página em forma de múltiplas rolagens entrelaçadas da esquerda para a direita
11 -> Abre a página em forma de múltiplas rolagens entrelaçadas de cima pra baixo
12 -> Abre a página em forma de grãos que vão se multiplicando
13 -> Abre a página em forma de uma rolagem do centro para as laterais
14 -> Abre a página em forma de uma rolagem das laterais para o centro
15 -> Abre a página em forma de uma rolagem do centro para as extremidades verticais
16 -> Abre a página em forma de uma rolagem das extremidades verticais para o centro
17 -> Abre a página em forma de uma rolagem diagonal vindo da direita superior
18 -> Abre a página em forma de uma rolagem diagonal vindo da direita inferior
19 -> Abre a página em forma de uma rolagem diagonal vindo da esquerda superior
20 -> Abre a página em forma de uma rolagem diagonal vindo da esquerda inferior
21 -> Abre a página em forma de multi linhas verticais
22 -> Abre a página em forma de multi linhas horizontais
23 em diante -> Alterna os modos acima para cada vez que a página for recarregada.

É importante observar que:

a) Embora interessantes, esses efeitos costumam "pesar" na hora de carregar a página, isto é, se o site contiver um número grande de figuras, a combinação desta com o efeito pode acarretar em uma página lenta;

b) Versões mais antigas de navegadores não são compatíves com esses efeitos, na verdade, seu funcionamento é melhor visualizado no Internet Explorer, a partir da versão 5.0.

Com a finalidade de redirecionar ou atualizar o site podemos utilizar a tag meta com os parâmetros:

Refresh - responsável por atualizar a página, podendo ser definido o tempo entre cada atualização.
Ex:
<meta http-Equiv="refresh" content="120">

Nesse exemplo indicamos que a página será atualizada em 120 segundos. Isso seria útil, por exemplo, num site de notícias, o qual mudasse as informações contidas no site de 2 em 2 minutos (120 segundos).

<meta http-Equiv="refresh" content="120,url=http://www.bufaloinfo.com.br">

Nesse caso após 2 minutos o usuário seria redirecionado para o site da Búfalo em 2 minutos.

Uma variação do parâmetro Refresh é utilizando Name="Moved", no qual se orienta ao navegador mudar para uma determinanda página após um tempo indicado.
Ex:
<meta name="moved" content="120,url=http://www.bufaloinfo.com.br">
O resultado final seria o mesmo que se usássemos refresh.
Após 2 minutos o usuário seria redirecionado para a página da Búfalo.

Expires - Usado para informar ao Browser quando o documento será considerado expirado. Indiretamente também pode ser usado para controlar o diretório CACHE do usuário, exemplo: Caso o documento tenha sido expirado, o Browser fara um novo "request " ao Site e pegará uma nova copia da página, não lendo a página no cache. Se for utilizado um valor ilegal, por exemplo 0 (zero), isso fará com que o Browser sempre faça um novo "request" e pegue a nova página. Também serve para informar aos "robôs" dos sistemas de buscas a validade do Site e automáticamente o "apagamento" do registro no Sistema de busca e eventualmente agendado um nova visita ao Site. A data tem que ser no formato RFC850.
Ex:
<META HTTP-EQUIV="expires" CONTENT="Wed, 14 Mar 2003 08:21:57 GMT">

Ao final desse apanhado de parâmetros podemos chegar a seguinte conclusão, embora não façam milagres, a tag meta pode ser um bom instrumento na hora de divulgar, criar efeitos ou mesmo atualizar/redirecionar nosso site, então a partir de agora, não se esqueça mais delas!

Patricia Daltro









Quer saber mais?
Faça um curso na Búfalo Informática, Treinamento e Consultoria e
Prepare-se para o Mercado!
Veja o que a Búfalo tem para você.

© Búfalo Informática, Treinamento e Consultoria - Rua Álvaro Alvim, 37 Sala 920 • Cinelândia • Rio de Janeiro • RJ
Tel.: (21)2262-1368 • e-Mail:
contato@bufaloinfo.com.br