Jump to content


Photo
- - - - -

Referências Meta Tag - Iframe E Outros


  • Faça o login para participar
Nenhuma resposta neste tópico

#1 Pirucask8

Pirucask8

    SouzaColen

  • Usuários
  • 1925 posts
  • Sexo:Não informado
  • Localidade:São Paulo - Capital !!

Posted 29/12/2003, 07:36

Como usar Meta-Tag!!
Tópico: http://forum.wmonlin...showtopic=40681

A tag <meta> tem uma variedades de aplicações, mas o seu uso primordial é de incluir informações sobre o documento HTML, como data de criação, autor e informações de direitos autorais. A informação inclida nas tags <meta> são úteis para servdores, navegadores e sistemas de busca, mas são invisiveis para o visitante da página. A tag precisa ser sempre posta entre as tags <head> do documento.

Um documento pode ter quantas tags <meta> você quiser. Existem basicamente dois tipos de tags <meta>, que são a  name ou o atributo http-equiv . Em cada caso, o atributo content é necessário para passar os valor (ou valores) para a informação de nome ou a função. O Exemplo abaixo mostra a sintaxe básica da tag <meta>  e seu uso.

<META HTTP-EQUIV="name" CONTENT="content">
<META NAME="name" CONTENT="content">


O atributo http-equiv

A informação que o atributo http-equiv repassa, é adicionada para o cabeçalho de resposta HTTP. O Cabeçalho HTTP contem informação que o servidor passa para o navegador um pouco antes de enviar o documento HTML. Ele contém o tipo de informação MIME e outros valores que afetam a ação do navegador. Sendo assim, o atributo http-equiv repassa informações que de alguma maneira  afeta a o modo que o navegador manipula seu documento HTML. Existe inumeros tipos predefinidos de http-equiv disponíveis. Vamos primeiros ver os mais importantes e assim que tiver mais tempo irei postando os outros aos poucos (se não quiser esperar va direto na página http://vancouver-webpages.com/META/.

Tags <meta> do tipo client-pull

Client-pull se refere a abilidade do navegador (o cliente) de automaticamente solicitar (pull) um novo documento do servidor. O efeito para o visitante é que a pagina exibe depois de um curto periodo de tempo é automaticamente atualizado com novas informações ou é substituido completamento por uma nova página. Se você amarrar seu documento com instruções do tipo client-pull e configurar um curto espaço de tempo para os intervalos, você pode criar um pequeno efeito de slide show.
client-pull também foi utilizando antigamente na Web para fazer efeitos rudimentares (eu não era dessa época... agora que to aprendendo....), mas agora obviamente tem outros meios melhores de fazer animações e esse método é raramente utilizado pra isso. A técnica do cliente-pull ainda é utlizada para redirecionar velhos endereços (URL) para novos. Se você retira um conteud de uma URL, você pode querer ser redirecionar seu visitante para um página diferente, não permitindo assim que ele caia em um erro 404.

O Client-pull usa um valor como atributo para atualização, primeiramente introduzido pela Netscape. Ele diz ao navegador para esperar um certo tempo em segundo (indicado por um numero inteiro no atributo content) e então carrega uma nova página. Se nenhuma página é especificada, o navegador irá recarregar a pagina corrente. O exemplo seguinte diz ao navegador para reacrregar a pagina em 15 segundos (estamos assumindo alguma coisa, ou alguem, está atualizando a informação no documento do lado do servidor).


<META HTTP-EQUIV="refresh" CONTENT="15">


Para reccarregar um página diferente, informe a URL do documento no atributo content como logo abaixo:

<META HTTP-EQUIV="refresh" CONTENT="1; URL=http://www.meusite.com.br/outrodocumento.html">

Note que somente um par de aspas são utilizadas ao redor do content. Embora URLs normalmente utilizem seus próprios par de aspas, nesse caso eles são omitidos sendo utilizados as aspas do atributo content.

Para criar um efeito de slide-show, adicione uma tag <meta> de refresh no <head> de cada documento apontando para o próximo documento HTML na sequencia. Você pode configurar o intervalo de tempo para quantos segundos você quiser; usando "0" você pulará para o próximo documendo assim que o atual terminar de carregar. Lembre-se que o tempo total que uma página leva para carrefar depende de vários fatores como tamanha, velocidade do servidor e o trafego no site em geral.

No exemplo abaixo, três arquivos são botados em uma espécie de um loop com intervalo de 5 segundos entre eles:

O documento 1.html contém:

<META HTTP-EQUIV="refresh" CONTENT="5; URL=2.html">

O documento 2.html contém:

<META HTTP-EQUIV="refresh" CONTENT="5; URL=3.html">

E o documento 3.html conté, a tag que volta para o inicio (1.html):

<META HTTP-EQUIV="refresh" CONTENT="5; URL=1.html">

Outros usos

Tempo de expiração - Atributo expires

Indica a data e a hora que o documento é considerado expirado. Robôs de mecanismos de busca podem usar essa informação para apagar documentos expirados de sua base de dados (podendo assim dizer para o robo revistar a sua página para atualizar a informação).

<META HTTP-EQUIV="expires" CONTENT="July 16, 1998 06:27:00 EST">

Tipo de conteúdo - Atributo content-type

O content-type text/html é adicionado automaticamente no cabeçalho HTTP para documentos HTML, mas este atributo pode ser utilizado também para informar o conjunto de caracteres utilizado no documento. Isto diz ao navegador para carregar o conjunto apropriado antes de mostrar a página.

Isso é uma medida do HTML4.0 para internacionalizar a Web. Veja abaixo um exemplo de uso

<META HTTP-EQUIV="content-type" CONTENT="text/html; charset=SHIFT_JIS">

Tipo de conteúdo - Atributo content-language
Isto pode ser utilizado para identificar a lingua na qual o documento foi escrito. Como o conjunto de caracteres mencionado acima, isto é um a parte do objetivo de internacionalizar a Web. O navegador pode enviar um cabeçalho "Accept-Language" correspondente, que faz com que o servidor escolha a lingua correta com a informação apropriada para a lingua especificada na tag <meta>.

O exemplo abaixo diz ao navegador que a lingua natural é francês:

<META HTTP-EQUIV="content-language" CONTENT="fr">

Inserinado informação-META com o atributo name

O Atributo name é usado para inserir informações ocultas sobre o documento e não corresponde a nhenhum cabeçalho HTTP.Por exemplo

<META NAME="author" CONTENT="E-magine">
<META NAME="copyright" CONTENT="2003, Fórum Web Masters Online e E-magine">


Você pode fazer seus propios <META> names, ou usar um dos nomes utilizados pelos sistemas de busca e padronizados pelas companhas de navegadores. Apenas alguns <META> names serão abordados aqui. Veja tudo em http://vancouver-webpages.com/META/ .

Tags Meta para sistemas de busca.
Sistemas populares de busca como Infoseek e altavista introduziram muitos <meta> names que ajudam aos sistemas na procura por páginas. Note que nem todo sistemas de busca usam informações  <META>, mas adicionar isso no seu documento não fará mal algum. Es
The popular search engines Infoseek and AltaVista introduced several <meta>
names that aid their search engines in finding pages. Note that not all search
engines use meta data, but adding them to your document won’t hurt. Está é a principal distinção entre name e http-equiv, as names nao influenciam os navegadores.

description
Isto dá uma descrição do conteúdo da sua página. Isto irá aparecer no resultado da pesquisa. A maioria dos sistemas retornam utilizam os 20 primeiros caracteres, para retornar a resposta rapidamente.
<META NAME="description" CONTENT="De uma breve descrição do seu site aqui">

keywords
Você pode incrementar, que além do título e da descrição do documento, uma lista de palavra chaves separadas por virgula. Isso pode ser muito úitl para idexar seu documento.

<META name="keywords" content="designer, web design, tutorial, wmonline">

author
Identifica o autor da página.
<META NAME="author" CONTENT="E-magine">

copyright
Identifica os direitos autorais da página.
<META NAME="copyright" CONTENT="2003, Web MAsters Online e E-magine">

robots
Está tag foi criada como uma alternativa para o arquivo robots.txt e é principalmente usada  para previnir que uma pagina seja indexada por um sistema de busca do tipo "aranhas". Isto não é muito difundido, mas algumas pessoas gostam de incluir isso assim mesmo. O aributo content, pode ter os seguintes valores: index (padrão), noindex(previne indexação), nofollow (previne que o sistema siga os links na página), e nada (colocando "noindex, nofollow").

<META NAME="robots" CONTENT="noindex, nofollow">

rating
Isto proporciona um método de medir o conteúdo da pagina para informar se é apropriado para crianças. Os quatro esquemas utilizados são: general, mature, restricted, e 14 years.
<META NAME="rating" CONTENT="general">

generator (ou formatter para o FrontPage)
Muitos editores HTML podem indicar o nome e a versão de suas ferramentas de ciração. Isso é utilizado pelos vendedores para medir a penetração de mercado das suas ferramentas.
<META NAME="generator" CONTENT="Adobe PageMill">


Referências gerais sobre Dreamweaver:
Tópico: http://forum.wmonlin...showtopic=46498

http://www.wmonline....goria=tutoriais ;
Apostila: http://upmasters.com...eamweavermx.zip
Tutos e Colunas: http://www.upmasters...col=dreamweaver
Colunas: http://www.imasters....php?codsecao=19
DevNet: (macromedia) http://www.macromedi...mx/dreamweaver/
Portal Script Brasil: http://dreamweaver.scriptbrasil.com/
Portal DW Online: http://www.dwonline.com.br/


Sistema Eficiente de Busca Interna: (É nescessário estar cadastrado no sistema!)
Tópico: http://forum.wmonlin...showtopic=43288

<FORM method=GET action=http://www.google.com/custom>
<input type=hidden name=domains value="http://www.seudominio.com.br">
<INPUT type=hidden name=cof 
VALUE="LW:180;L:http://www.seudominio.com.br/logo_do_seu_site.jpg;LH:57;AH:center;
S:http://www.seudominio.com.br;AWFID:d3fa02ee19d8d78e;">
<TABLE cellspacing=0 border=0>
<tr valign=top>
<td align="center"><img border="0" src="http://www.google.com/logo_google.gif"><br>
<INPUT TYPE=text name=q size=16 maxlength=255 value="">
<font face=arial,sans-serif size=-1><br>
<input type=hidden name=sitesearch value="http://www.seudominio.com.br">
</b></font><INPUT type=submit name=sa VALUE="Pesquisar">
</td>
</tr>
</TABLE>
</form>

Erro no poicionamento de Layer( Atrás de form ou SWF!)
Tópico: http://forum.wmonlin...t...=16&t=25508

Separe o menu e o form (ou flash) em duas tags's da seguinte maneira.

O menu vai ficar dentro de um layer com a tag DIV com z index 2 por exemplo!

e o flash ( ou form) vai ficar dentro de um layer com a tag SPAN com um zindex 1..

aqui está o código de exemplo!!

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
&lt;script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
 if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
   document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
 else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);

function MM_findObj(n, d) { //v4.01
 var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
   d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
 if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
 for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
 if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_showHideLayers() { //v6.0
 var i,p,v,obj,args=MM_showHideLayers.arguments;
 for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
   if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
   obj.visibility=v; }
}
//-->
</script>
</head>

<body>

<table width="614" border="0" cellpadding="0" cellspacing="0">
 <!--DWLayoutTable-->
 <tr> 
   <td width="614" height="48" valign="top"><div id="Layer1" style="position:absolute; width:200px; height:115px; z-index:2; left: 196px; top: 29px; background-color: #0000FF; layer-background-color: #0000FF; border: 1px none #000000; visibility: hidden;"></div>
     <a href="#" onMouseOver="MM_showHideLayers('Layer1','','show')" onMouseOut="MM_showHideLayers('Layer1','','hide')">gegegeg</a></td>
 </tr>
 <tr> 
   <td height="32">&nbsp;</td>
 </tr>
 <tr>
   <td height="228" valign="top"><span id="iframeLayer" style="position:absolute; width:611px; height:228px; z-index:1; left: 11px;">
<iframe src="http://www.terra.com.br" frameborder="0" width="100%" height="100%" marginheight="0" marginwidth="0" hspace="0" vspace="0"></iframe></span></td>
 </tr>
</table>
</body>
</html>

espero que isso ajude vocês.. dúvidas sobre isso poste nesse tópico



Como fazer um iframe?

Coloque esse código no local aonde você deseja que apareca o iframe.
<iframe frameborder="0" height="altura" width="largura" name="NOMEDOIFRAME" scrolling="auto" src="nomedapagina.htm"></iframe>

Edição feita por: Makerup, 07/03/2007, 10:24.

Matheus Colen

Escabroso Produções




0 user(s) are reading this topic

0 membro(s), 0 visitante(s) e 0 membros anônimo(s)

IPB Skin By Virteq