Com frames ou sem frames

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 800x600 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

• 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

• 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

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

• 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

• 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

• 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

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.

...

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.