Unidad de Investigación ACCESO

Accesibilidad a la Red

Información y herramientas sobre el diseño accesible de sitios web. Diseño para Todos

Uso adecuado de marcos

Rafael Romero Zúnica
Unidad de Investigación ACCESO 
Publicado originalmente en Temalia. 30/03/2001

Resumen

Los marcos o "frames" son una característica central de algunos sitios web, pero presentan muchos problemas de usabilidad y accesibilidad. En las páginas con marcos el atributo TARGET de los hipervínculos debe estar bien definido para lograr el efecto deseado. Hay que evitar mostrar una página externa al sitio web dentro de un marco. Existen alternativas para lograr el mismo efecto que los marcos evitando sus inconvenientes.

Artículo

Los marcos (en inglés "frames") son una característica del lenguaje HTML que permite dividir la pantalla en zonas independientes y mostrar en cada una de ellas una página web distinta. Se suelen usar para mostrar un menú de navegación común a muchas páginas del sitio web sin tener que incluirlo manualmente en cada página. También para poner un mismo mensaje al pie de todas las páginas. Por ejemplo, para incluir un mensaje de copyright, un email de contacto, la fecha de actualización del sitio, etcétera.

Especificar marco de destino con TARGET
Desde el momento en que se introducen marcos en el sitio web hay que especificar en cuál de los marcos definidos se debe mostrar la página llamada desde cada hipervínculo.

El destino se define mediante el atributo TARGET del hipervínculo, que debe ser igual al atributo NAME (nombre) del marco en que se mostrará la página. Otros valores posibles son:

• _self: Valor por defecto, carga la página en el mismo marco.
• _top: Muestra la página a ventana completa, y anula la distribución en marcos de la pantalla.
• _parent: Carga la página en el marco que contiene al marco actual. Si no existe un marco contenedor, su efecto es igual al de "_top".
• _blank: carga la página en una ventana nueva del navegador.

Es muy importante que al hacer vínculos a páginas externas al sitio web actual se use como TARGET "_top" o "_blank". De otro modo se puede hacer aparecer la página externa como perteneciente al propio web, lo que es completamente inapropiado. Además se fuerza la página externa a mostrarse en un espacio más reducido que aquel para el que ha sido diseñada.

Accesibilidad de los marcos
Entre las etiquetas de <NOFRAMES> se debe situar un contenido HTML alternativo para aquellos navegadores que no soportan los marcos. Una buena solución es un breve texto explicativo y después un hipervínculo a cada una de las páginas que se muestran inicialmente en cada marco.

También es importante que el nombre de los marcos (atributo NAME) sea significativo para que los visitantes ciegos puedan entender la función que cumplen a pesar de no ver la distribución gráfica en pantalla. Por ejemplo, "menu_de_navegació", "contenido_central", "pie_de_pagina".

Inconvenientes de los marcos
El inconveniente principal de los marcos es que las páginas individuales no muestran la URL de la página actual al usuario. Por esto no se puedan guardar en el menú de Favoritos, ni crear enlaces a dichas páginas desde otros sitios web o referenciarlas en artículos, mensajes de correo, chats...

Esto es especialmente grave porque hace que los robots de búsqueda no indexen correctamente las páginas. En la página principal se indexa únicamente el contenido entre las etiquetas <noframe>, por ejemplo "esta página contiene marcos pero su explorador no los admite". Por otro lado, para el resto de páginas aparecen enlaces directos a páginas individuales diseñadas para mostrarse como marcos interiores del sitio. Al mostrarse estas páginas fuera de la composición de marcos preestablecida, el usuario no entiende correctamente la estructura del sitio y no puede seguir navegando, ni interpretar adecuadamente la información pues ésta fue pensada para mostrase en un contexto visual distinto y más completo.

Otro inconveniente es que se reduce el espacio útil en pantalla para mostrar la información del marco central. éste queda a veces "comprimido" entre los marcos de navegación. El problema se agrava en caso de usuarios con resolución de pantalla antigua (640x480 pixeles). Para atenuar este problema conviene evitar el uso del atributo RESIZE ya que este atributo impide al usuario redimensionar los marcos en pantalla en caso de necesidad.

Alternativas a los marcos
Los principales editores profesionales de sitios web como Microsoft Frontpage 2000 o Macromedia DreamWeaver permiten generar un sitio web con bordes compartidos entre las páginas. Un borde compartido por varias páginas funciona así: en el momento de la publicación del sitio web se sustituye el espacio reservado para el borde por el contenido de la página correspondiente (con el menú de navegación o el contenido común deseado). La división en zonas de la pantalla se logra habitualmente mediante el uso de tablas.

Así se obtiene el mismo efecto gráfico de uniformidad entre las páginas del sitio web, con un esfuerzo mínimo del desarrollador pero sin los inconvenientes de usabilidad que los marcos plantean.

Por otro lado, si la información del sitio web reside en una base de datos externa, se puede programar la aplicación del servidor para que en lugar de generar un sitio basado en marcos, genere páginas individuales basadas en tablas con una estructura visual similar pero sin los problemas anteriormente descritos.

Más información: Why frames suck (most of the time). Jakob Nielsen. Diciembre 1996.

(c) Unidad ACCESO. Dep. Psicología Evolutiva i de l'Educació. Universitat de Valencia Estudi General.
Contactar con Unidad ACCESO