Elementos básicos de diagramación

“Los diseños más efectivos para un público general de Internet (en su mayoría con conexión vía módem) son una cuidada y equilibrada mezcla de textos

y enlaces, con elementos gráficos relativamente pequeños. Este tipo de página se descarga muy rápido, incluso cuando se accede a ellas con velocidades de 28,8 kbps6, y aun así consiguen un fuerte impacto visual” (Lynch y Horton, 2000; 55).

codigos html para paginas web

Fernández-Coca (1998) señala seis elementos básicos que componen la estructura de una página Web. En la figura 1.7 (pág. 42) pueden verse algunos de ellos.

? Encabezamiento o banda de localización. Es la primera información que visualiza el usuario al descargar la página. Su función identificar claramente el sitio al que pertenece mediante la inclusión de un logotipo, el nombre de la institución o la utilización de algún color identificatorio. Además, debe permitir que el usuario pueda ubicar fácilmente el lugar que ocupa la página en la estructura global del sitio. Esta información pude presentarse en modo gráfico o de texto. Fernández-Coca (1998) advierte que si se opta por una presentación de tipo gráfico debe incluirse una etiqueta “ALT”7 para que la información sea también accesible a los usuarios que no puedan ver la imagen. Nielsen (2000) recomienda colocar una barra horizontal que vaya señalando los diversos lugares por los que ha atravesado hasta llegar a la página que está viendo, tomando como referencia la página principal. Por ejemplo, si un usuario abre la home page de un sitio, luego ingresa en la sección “salud” y posteriormente sigue el enlace “medicamentos”, el encabezado de la página debería mostrar cada uno de los lugares por los cuales atravesó para llegar a la página de “medicamentos”.

 Kilobaudios por segundo. Es una unidad de medición para indicar la cantidad de información que puede enviar o recibir un módem en una unidad de tiempo.

En el lenguaje HTML la etiqueta ALT es utilizada junto con el vínculo hacia un archivo gráfico para brindar información sobre él. Ver punto 3.4.5.2 “Estrategias para la utilización de gráficos”.

? Iconos o enlaces hipertexto de navegación básica. Si el sitio contiene muchas páginas largas en las que el usuario debe hacer scroll para visualizar la totalidad de su contenido, conviene colocar en la parte superior una serie de enlaces con los principales punto de referencia del sitio como la página principal, la ayuda y la página anterior. Estos enlaces se pueden realizar a través de hipertexto o mediante íconos o botones gráficos. En ambos casos conviene que esta estructura –también denominada barra de navegación- se mantenga constante y ofrezca a lo largo de cada una de las páginas del sitio las mismas opciones.

? Cuerpo. Es la zona de la página donde se incluye la información específica. Las normas de estilo gráfico utilizadas para presentar la información deben mantenerse a lo largo del sitio.

? Notas de pie de página. Si se publica en la Web documentos con citas al pie, es conveniente que estén en la misma página donde se encuentran las referencias para evitar que el usuario cargue una nueva página. Además, deben separarse las citas del resto del texto mediante algún recurso visual como una línea, un espacio en blanco o cambio en la tipografía y el tamaño de los caracteres.

? Firma, fecha y correo electrónico. Conocer quién es el responsable del documento, cuando fue confeccionada la página y tener la posibilidad de establecer contacto con la persona u organización que publica el sitio es una forma de transmitir confianza al usuario.

Lynch y Horton (2000) señalan la necesidad de construir una retícula de base para el diseño de las páginas interiores que contendrán la información del sitio. Es importante prestar mucha atención a la confección de esta retícula que contendrá los elementos básicos a incorporar en cada página como color, ubicación de enlaces, tipografía, espacios en blanco, y gráficos. La utilización de una retícula permite que las páginas Web sean consistentes y previsibles en su estructura.

Respecto de su confección, Lynch y Horton (2000) afirman que:

? Contribuyen a una página ordenada. Los usuarios ven un diseño consistente, claro y bien integrado, lo que les proporciona más confianza dentro del sitio. Las retículas de diseño deben establecer una composición de la pantalla lógica y consistente, y permitir flexibilidad para colocar gráficos y textos de diferentes maneras.

? Permiten una estratificación vertical. En papel impreso, un lector puede ver la totalidad de la página de papel. En la Web, la información es visualizada a medida que se va descargando desde el servidor. Los datos que primero llegan son lo de los elementos superiores, por lo cual la información debe ser estratificada verticalmente de mayor a menor importancia.

? Ejemplo de una retícula de página. (Figura 1.8, pág. 45) Los elementos a considerar son el encabezado, con el nombre de la página y el logotipo de la institución u organización, el título de la página, el enlace con la página principal, enlaces a otras secciones, espacio para gráficos y textos y pie de página con información de copyright, fecha de actualización y vínculos más importantes.

plantillas de paginas web

Nielsen (2000) remarca la necesidad de optimizar la distribución de la información en el espacio de la pantalla. Desde un 50 a un 80% del total del espacio debe estar destinado al contenido, mientras que los enlaces de navegación no deben superar el 20%.