Vemos cómo serían las distintas páginas independientes que componen un sitio creado con frames.
Cada documento, como ya hemos indicado, se escribe por separado en su propio archivo HTML. Para el ejemplo del capítulo anterior podemos definir los archivos HTML de la siguiente manera.
pagina1.html
Es la página que contiene el titular de la web. Simplemente se trata de una etiqueta <H1> de titular. La página tiene su propio título, con la etiqueta <TITLE>, que no se podrá visualizar por ningún sitio a no ser que se muestre esta página sin los frames, ya que las páginas dentro de los marcos heredan el título de la definición de los frames.
<html>
<body bgcolor="#DECC09">
<head>
<title>Titulo Carnicería Pepe</title>
</head>
<h1 align=center>Carnicería PEPE</h1>
</body>
</html>
pagina2.html
Es la página que se presentará en el área principal de la definición de frames, es decir, la página que tiene más espacio para visualizarse y donde pondremos los contenidos de la web. En este caso muestra un mensaje de bienvenida a la web, que hará las veces de portada.
<html>
<body bgcolor="#CF391C" text="#ffffff">
<head>
<title>Portada de Carnicería PEPE</title>
</head>
<h1 align="center">Bienvenidos a nuestra web</h1>
<br>
<br>
La carnicería PEPE, con más de 100 años de experiencia, es la mejor fuente de carnes de vacuno y cerdo de la comunidad.
<br>
<br>
Tanto en invierno como en verano puede encontrar nuestras ofertas de temporada de primera calidad.
</body>
</html>
pagina3.html
En esta página se mostrará la barra de navegación por los contenidos del sitio. Contiene enlaces que deberían actualizar el contenido del área principal de la declaración de frames, para mostrar los distintos contenidos del sitio, por ejemplo, la portada, los productos, la página de contacto, etc.
<html>
<body bgcolor="#AC760E" link="ffffcc" vlink="ffffcc">
<head>
<title>Barra de navegación de carnicería PEPE</title>
</head>
<div align="center">
<b>
<a href="pagina2.html">Portada</a> |
<a href="productos.html">Productos</a> |
<a href="contacto.html">Contacto</a>
</b>
</div>
</body>
</html>
Podemos ver cómo queda la página de frames con estos contenidos, que simulan la página de una carnicería.
Miguel Angel Alvarez
Fundador de DesarrolloWeb.com y la plataforma de formación online EscuelaIT. Com...