Blog CataBits

sexta-feira, 12 de março de 2010   (Todos os horários em UTC)
G Y Q

Com frames ou sem frames

Por Wallace Vianna em 29/12/2009 às 18:41.

Com frames ou sem frames
“Frames” famosos.

Na área de webdesign (mas poderia ser tecnologia, computação, ou em determinado conhecimento) muitas práticas são abandonadas ao longo do tempo, seja por falta de leitura crítica ou por obsolescência. Um exemplo são as cores seguras (safe colors) para web. Muitos dos que apregoam que isso é uma prática obsoleta desconhecem que muitos dispositivos portáteis que acessam a web como celulares e PDAs não trabalham com 16 milhões de cores…

Isso vale também para projetos de interface desenhados para resolução de tela de 800×600 pixels: não há como ter 100% de certeza sobre como sua página web será vista, na largura e muito menos na altura (vide texto Layout versus resolução de tela (2)).

Outra prática muito criticada hoje em dia é uso de frames. O argumento é o de sempre: tecnologias novas existem, dispensando esse artifício para exibir mais uma página (ou conteúdo) na web, simultaneamente. Meu argumento é o de que se o COBOL fosse ruim já teria sido substituído pelo .NET, JAVA ou ORACLE no sistema financeiro Brasileiro (que possui um dos sistemas bancários mais evoluídos do planeta). E o CGI, que é utilizado em 90% dos provedores de hospedagem de sites no mundo não seria mais utilizado por esse raciocínio. Assim sendo, vamos ver os prós e contras dos frames (traduzido como molduras ou quadros):

Prós:

  • É uma linguagem de marcação, simples de ser implementada por designers que não tem intimidade com programação ou ferramentas de atualização de conteúdo complexas/caras.
  • Pode ser utilizada para estruturar (frame) ou desenhar (iframe ou inline Frame) um layout para web.
Figura 1
Figura 1
  • Torna o carregamento de um site mais ágil, uma vez que a parte do conteúdo que não se altera só é carregada uma vez.
Figura 2
Figura 2
  • Na data em que escrevo este artigo (dez.2009) frames tem maior consistência do que o CSS (folha de estilos), pois exibe a estrutura igual em diversos navegadores.
Figura 3
Figura 3

Contras:

  • Dificulta a contextualização direta do endereço de uma página, uma vez que a URL (endereço) aponta para a estrutura que reúne duas ou mais páginas.
Figura 4
Figura 4
  • Sistemas de busca podem indexar apenas uma página e não o conjunto; isso é particularmente ruim em páginas estruturadas por frames: uma página assim estruturada pode fazer sentido apenas se vista dentro do conjunto.
Figura 5
Figura 5
  • Iframes com links internos podem exibir um layout desestruturado se o conteúdo for maior que o tamanho do frame; conteúdo selecionado por “clique-e-arraste” pode exibir layout truncado.
Figura 6
Figura 6
  • Tem limitações difíceis ou incômodas de serem contornadas dependendo do layout de seu projeto(*); por exemplo, iframe com largura proporcional à largura/altura da janela do navegador.
Figura 7
Figura 7

Atualmente pode-se incluir conteúdo externo à página, ou montar uma página com diversos conteúdos através de tags/marcações de inclusão que se utilizam de tecnologias (javascript, asp, php, etc). Isso resolve algumas questões (fim do conteúdo visualizado fora do contexto, pois ele é não é mais visualizado e sim copiado na página de destino) mas cria outras  como lidar tecnologias mais complexas, com novos pros e contras como a não-indexação de “conteúdo dinâmico” em sistemas de buscas, pois o conteúdo não existe na pagina HTML indexada na web, somente no computador do visitante, ao ser aberta.

Enfim, projetar é conhecer as soluções existentes e contextualizá-las ao projeto. Por isso digo que não existe tecnologia nova ou velha, existe é uma solução que resolve melhor o seu problema, no contexto em que se ele apresenta.

_______________________________________________

Notas:

(*) Segundo SILVA (2008), o layout de páginas da internet pode ser:

  • Fixo: “Página e colunas tem largurafixa. [...] Qualquer que seja o tamanho da janela do navegador ou resolução, as larguras não variam”.
  • Líquido: “As larguras são definidas em porcentagem. O layout acomoda-se em largura a qualquer tamanho da janela ou resolução do monitor”.
  • Elástico: “Uma opção para o layout líquido [...] (visto que) o comprimento total das linhas de texto podem se torrnar tão reduzido ou extenso que afete a legibilidade. (Aqui as) larguras (são definidas) com base no tamanho da fonte”.
  • Híbrido: Possui duas abordagens: “a largura da página, de colunas e demais [...] componentes [...] do layout são definidas em (tamanho do texto) e adicionalmente definimos para tais componentes uma largura máxima em porcentagem”. Pode-se ainda inverter o conceito, com larguras do layout em porcentagem e larguras máxima e mínima em tamanho do texto.

(*) Referência: SILVA, Mauríco Samy. Construindo sites comCSS e (X)HTML: sites controlados por por folhas de estilos em cascata. São Paulo: Novatec, 2008

6 comentários para este post

Comentário de Luferat.
Em 29 de dezembro de 2009 às 20:31.

Em tecnologia, assim como em quaisquer outras áreas isso acontece: são “entendidos” que querem fazer fama e tirar onda com a cara dos outros, criando conceitos, preconceitos e pós-conceitos e isso acaba como um “viral” que afeta as pessoas, pricipalmente profissionais que se fixam na primeira coisa que ouvem, lêem ou aprendem. Sei que Tio Wallace não gosta do termo, mas é o que eu costumo chamar de “Bloqueio mental”. :-P

No caso dos frames, eu gosto muito deles, principalmente dos iframes. Quando bem utilizados, resolvem problemas que, de outras formas, seriam trabalhosos e desnecessários.

Se frames são tão ruins assim, porque o “Big G”, que na prática “vive” de relevância e contextualização, os adota intensivamente no Google Sites, no Blogger, no iGoogle, no Gmail, no Orkut, no Wave,… Só para citar alguns…

Profissionais tem que conhecer, entender e aplicar na hora certa e da forma certa. E sem preconceitos, por favor!

. . .
Comentário de diler.
Em 30 de dezembro de 2009 às 20:36.

Disso de frame eu não entendo muito, mas estou com vocês. nada de ficar discriminando as pessoas porque usam tecnologias antigas mas que ainda tem vantagens em usar.

. . .
Comentário de Ednei P. de Melo.
Em 31 de dezembro de 2009 às 12:38.

Pessoalmente, gosto muito dos iframes, pois eles possibilitam criar menus compactos e caixas de diálogos bem elegantes. No entanto, não pude utilizá-los porquê o Internet Explorer (6 na época) não lidava em na definição de altura fixa (height) do iframe. Ainda continua assim? &;-D

. . .
Comentário de Luferat.
Em 2 de janeiro de 2010 às 12:20.

No entanto, não pude utilizá-los porquê o Internet Explorer (6 na época) não lidava em na definição de altura fixa (height) do iframe. Ainda continua assim?

Não tenho visto problemas nas versões mais recentes. O controle dos iframes é bem preciso, principalmente com o uso de CSS.

. . .
Comentário de tarson.
Em 15 de fevereiro de 2010 às 19:15.

olá,cara eu tenho um frame no meu blog do google que não da pra tirar você sabe o pq?? da uma olhada ai http://variedad-net.blogspot.com/
Obrigado

. . .
Comentário de Luferat.
Em 15 de fevereiro de 2010 às 21:25.

tarson,

Este é o frame onde ficam os comentários do seu post. Os gadgets do Blogger também usam iframes. Não os remova, a não ser que saiba exatamente o que está fazendo.

. . .

Escreva um comentário

Atenção comentarista!

  • Todos os comentários serão rigidamente moderados;
  • Identifique-se! Comentários de anônimos ou com e-mail falso serão removidos;
  • Comentários com links serão removidos. Somente o link do comentarista será aceito;
  • Comentários escritos em miguxês e/ou com predominância de maiúsculas serão removidos;
  • Dúvidas técnicas e solução de problemas devem ser postados preferencialmente no Fórum;
  • Por favor, prove que você é coerente, educado e bem informado: conheça o restante do site, saiba quem somos, sobre o que, para quem e como escrevemos antes de comentar futilidades;
  • Respeite as opiniões dos autores e dos outros comentaristas. Seja breve e sem ofensas;
  • Escreva comentários relevantes e que contribuam de alguma forma para o bem da humanidade;
  • Não seja um inútil social. Lembre-se que o mundo não gira ao seu redor.

 (obrigatório)

 (obrigatório)      (Personalize seu avatar)