Frames em HTML - O que são e para que servem

Nesta seção de nosso curso de HTML, iremos falar de uma das técnicas mais conhecidas e usadas por Webmasters quando o HTML 4.01 reinava na internet e atingiu seu ápice.

É um conceito muito conhecido e que foi bastante utilizado (e ainda é), por isso iremos dedicar alguns tutoriais em nossa apostila para o estudo dos frames.

Curso de HTML com certificado

O que é um frame ?

Um frame, em inglês, e na tradução que faça sentido em nosso mundo de informática/criação de sites, se refere a moldura. Moldura, como a de fotografias, por exemplo.

Não se você notou, provavelmente não pois é uma coisa natural e óbvia, mas todos os nossos sites até o momento eram compostos somente de uma página, de um documento HTML.
As páginas dos sites que você criou se chamaram "index.html", "contato.html" etc etc.
Ou seja, acessamos um documento .html por vez.

Frame, em HTML, nada mais é que uma sub-janela, uma moldura, um pedaço em um contexto maior.
Parece complicado, não? Não, não é. Vamos explicar.

Se antes mostrávamos apenas um página de nosso site por vez, em uma janela do navegador, com o uso de frames podemos exibir diversos documentos HTML em uma única janela.
Simples assim: em vez de um documento por janela do browser, iremos exibir dois ou mais documentos de uma só vez, e isso é feito através deles, dos famosos frames.

Como funciona um frame em um site ?

Olhe o que fizemos em nosso último tutorial sobre tabelas em HTML, quando fizemos um layout de um site usando tabelas. Você verá que mostramos como criar um site com tabelas.
Lá criamos um menu lateral com diversos links, e um menu superior com outros links.

A página principal chamamos de index.html. Quando clicamos em "Contato", somos direcionados para a página contato.html que deverá ter o mesmo código HTML das tabelas, o mesmo cabeçalho, o mesmo menu e rodapé.
O que muda? O conteúdo, o restante do código repetimos.

Se clicarmos em "Sobre o autor", devemos ser redirecionados para a página autor.html, que terá o mesmo menu, as mesmas tabelas, cabeçalho e o mesmo rodapé.
O que muda? O conteúdo, que agora vai exibir as informações do autor do site (você, webmaster)..

Embora tenhamos que mudar apenas o conteúdo, temos que repetir todo o restante do código de nosso site. Esse é o problema que os frames ajudam a resolver.

Com os frames, não temos que ficar repetindo nossos códigos HTML.
Ora, se o cabeçalho, rodapé e menu não precisam mudar quando clicamos em um link e vamos para outra página, vamos mostrar essas partes em nosso site de uma maneira fixa.

Ou seja, o conceito principal dos frames é a exibição de conteúdos de maneira fixa, para evitar que precisemos alterar coisas demais.

Para que servem frames ?

Ok, já sabemos que podemos exibir diversos documentos HTML em uma única janela do browser.
Mas para que serve isso? O que vamos fazer com essa técnica? Qual a utilidade prática dos frames?

Vamos relembrar o esboço do site que fizemos:

Curso de HTML completo, apostila de HTML online

Vamos relembrar também das ideias do tópico passado, de que sempre que mudávamos de página, iríamos pra outra com o mesmo código-fonte do layout, mudando apenas o conteúdo exibido.

A grande sacada do frame foi de ser possível 'fixar' alguns documentos HTML na página.
Nesse caso do desenho, podemos usar 3 frames: o de cabeçalho, o do menu e do conteúdo.
Deixamos sempre o cabeçalho e menu fixos, afinal estas páginas precisam sempre aparecer, e não mudam.

Quando clicarmos em um link do menu, a página do conteúdo é que vai mudar, ela é que vai atualizar e exibir outro documento HTML.
E o menu? É um documento HTML também, simples, com alguns links. Não precisamos mudar.
E o cabeçalho? Ele exibe o símbolo do seu site e o nome. Não precisa mudar também, queremos sempre o nome de nosso site visível.

Assim, na sua página de Contato, você precisa apenas escrever o conteúdo, o texto para entrar em contato, não precisa inserir o código HTML de um menu e de um cabeçalho.

Caso cliquem no link "Sobre o autor" no menu lateral, este menu não muda, quem muda é o conteúdo.
E este novo conteúdo não precisa ter códigos de HTML do cabeçalho nem do menu, apenas as informações sobre o autor.


Ainda se usa frame ?

Assim como diversas tags e técnicas que ensinamos e falamos neste parte inicial de nosso curso, sobre o antigo HTML, o HTML 4.01, os frames já estão em desuso.

Mas assim como diversas tags e técnicas ensinadas, o que se usa hoje em dia é uma evolução dos frames, ideias totalmente baseada nestes importantes elementos de um site, que foram extremamente usados até poucos anos (ainda é possível encontrar sites que usam frames puros).

É muito importante estudar os frames em um curso de HTML, iremos aprender conceitos e técnicas muito importantes, que nos ajudarão a entender mais quando formos fazer e reproduzir os mesmos efeitos (mais desenvolvidos, claros) em CSS.

Não se assuste, esse ramo de desenvolvimento Web é realmente muito dinâmico e costuma mudar bastante. O importante para ser um bom profissional é tentar estudar o máximo possível a maior abrangência de assuntos: HTML 4, HTML 5, CSS 3 e o que mais vier pela frente :)

Nenhum comentário: