Raphael Simas Quarta-feira, 22 de janeiro de 2003

Atualizações dinâmicas com Frames, iFrames, SSI e Templates

Olá pessoal!

A coluna de hoje é um tema interessante e de muita importância... falaremos das quatro formas mais viáveis para fazer includes (inclusões dentro de uma página) sem usar ASP, PHP ou outra programação. Veremos as melhores formas e os casos a parte para cada uma destas formas... o objetivo da coluna hoje é esclarecer basicamente as melhores ocasiões de uso.

Vamos à matéria:

Visão geral das includes:
Todo mundo já caiu neste caso: tenho um site com 100 htm's. Mas preciso mudar o menu e não quero fazer isso 100 vezes.
Pois bem.. as includes trabalham neste sentido. Você tem várias formas de utilizar apenas um menu para todas as páginas e, qualquer modificação neste menu se aplicará à todas as páginas automaticamente. É realmente uma mão na roda.
Então, são inúmeras as aplicações para estas includes: pode ser no topo de um portal, nos menus de qualquer site, na barra de copyright, em espaços para enquetes, sistemas de notícias etc... porém, cada situação dessa, será indicada de uma forma diferente por um tipo de include mais viável. É isso que veremos abaixo:

Frames VS. iFrames VS. SSI VS. Templates.
Leia abaixo uma descrição de cada um destes tipos de includes e, claro, os prós e contras.

Frames:
Os frames são velhos.... estão na web desde o início... ainda lembro de como eram usados lá em 1996 (quando o Terra ainda era NutecNet e o fundo do site mudava todo dia hehe..). Então, por ser mais velho, os frames são menos versáteis porém, muito simples de usar. O Dreamweaver tem um ótimo "manuseio" dos frames e ainda, vários framesets padrão.

Quando os frames não são a melhor solução: (algumas situações)
- Menus de portal: se o frame fica normal, aparece a rolagem... se você tira a rolagem, o conteúdo some quando é maior que a tela...
- Includes para campos como uma Enquete, notícias etc.: Sem chance... imagine ter que dividir em frames um layout inteiro para colocar uma enquete com frame no lado direito de um portal.... e depois ficar montando que frame puxa o que....

Quando os frames são uma boa solução: (um exemplo)
- Sites que precisem de um topo fixo ou um copyright fixo, que nunca sumam. Veja isto neste site do Itaú. Você verá em cima uma barra laranja (Investimentos) e em baixo de azul, uma barra com algumas utilidades aos clientes. Quando você diminuir a página, verá que a barra de rolagem fica entre as duas barras laranja e azul. Agora clique no Link Consulta rápida e veja que as duas barras se mantem e apenas o meio é mudado. Neste caso, os Frames são a melhor forma de manter o conteúdo rolando e um por exemplo um topo no mesmo lugar. Muito prático.


iFrames:
Os iFrames são ótimos.... são feitos apenas por um código que já foi mostrado nas colunas. Eles são rápidos, leves e sem contra-indicação.
E só para complementar, os outros códigos que podem ser adicionados aos iFrames. Vá no código fonte do dreamweaver MX e dentro de <iframe> pressione a barra de espaço (<iframe >) ... automaticamente, todas as opções possíveis de códigos fonte para o iFrame serão mostradas. Vale lembrar também, que assim como os frames, tabelas e camadas, os iframes aceitam medidas percent (%)... basta colocar nas medidas o símbolo % (até 100%....).

Quando os iFrames não são a melhor solução:
- Menus de portal: Para criar um iframe, você terá que indicar um tamanho horizontal e outro vertical para ele. Agora, imagine.. você tem um portal... criou um iframe para o menu. Este menu tem 15 opções... você deu o tamanho vertical de 100px. Com o tempo, você criou mais 20 opções para o menu. Neste momento acontece o erro... as 35 opções precisavam de 200px verticais... seu iframe só tem 100px.... se você coloca rolagem, vai dar rolagem no menu e se tirar a rolagem, o conteúdo vai sumir no limite das medidas. É claro que ao criar o iframe para uma situação desta, você não precisa indicar o tamanho exato do menu... pode fazer um iframe bem maior para não ocorrer isso... mas não é legal...

- Quando os iFrames são uma boa solução:
Os iFrames são perfeitos para quase tudo... por exemplo... você tem uma área pequena para colocar uma lista de notícias no meio da página.... a melhor solução é colocar um iframe com rolagem.... veja isso no site Quartel General (veja na caixa "Fale agora"..).
Além deste tipo de uso, podemos colocar o site inteiro em iFrames... veja no www.juizdefora.rg3.net. O topo e o copyright são iframes.
Varia muito então o uso dos iFrames.


SSI:
As SSI (Server-Side Include) são uma maneira também muito boa de dinamizar os site. O único grande problema que encontramos para trabalhar com elas é o simples fato de não aparecer no navegador... aparecem apenas no Dreamweaver e no servidor. Isso é realmente ruim para acertar todo o visual. É claro que a pessoa pode fazer um FTP no dreamweaver e marcar a opção que envia os arquivos para o servidor toda vez que são salvos... neste caso, você terá que estar conectado na internet e de fato, olhando o site direto do servidor. Para quem usa internet via rádio, cabo etc é bom... mas para quem usa modem, é terrível. Então, acaba que fica inviável usar este tipo de include.

TEMPLATES:
Os templates criam um modelo de onde as outras páginas são puxadas.. por exemplo.. você criou um template com topo e menu, e gerou várias páginas por este modelo. Ao mudar o template original, todas as páginas dependentes (que foram geradas a partir daquele modelo) serão atualizadas... Até ai, é ótimo. Porém, alguns problemas aparecem quando o projeto começa a ficar mais elaborado.. já recebi muitos emails de pessoas que tiveram problemas para usar PHP e JS com templates. E também, é muito comum surgirem problemas com as áreas editáveis...
No fim, acaba não sendo uma forma totalmente segura de dinamizar a criação e atualização do site. E tem mais um único incômodo... se você tem 500 páginas de um site e atualizar o menu, você terá que enviar para o FTP todas as 500 páginas.. o que não acontece quando usamos Frames, iFrames e SSI (porque incluem apenas um arquivo).


Bom, já deu pra perceber que como tudo, todas as formas tem um pró e um contra... a que melhor pode ser aproveitada sem dúvida é o iframe pela sua adaptação e opções. Mas vai, claro, de cada caso.... cada pessoa se adapta melhor ou pior à uma ferramenta destas... então, vai do gosto e do estilo de trabalho do Profissional em questão.

Para saber mais sobre os assuntos acima, veja as nossas colunas passadas:

http://www.imasters.com.br/web/conteudo/coluna_dreamweaver.asp?codColuna=395
http://www.imasters.com.br/web/conteudo/coluna_dreamweaver.asp?codColuna=394
http://www.imasters.com.br/web/conteudo/coluna_dreamweaver.asp?codColuna=379

Essa foi nossa coluna dessa semana... até a próxima!