Del contenido surge la forma. Guías para el diseño web

Botones y menús de navegación

Existen dos vías básicas para crear un menú de navegación.

Botones de igual tamaño
Botones de tamaño proporcional al texto que contienen

En el primer caso necesitaremos que todos los botones presenten un esquema de textos similar. Es decir, todos los botones deberán tener 1 o 2 palabras.

Si esto es posible y las palabras a su vez tienen tamaños más o menos homogéneos, será posible crear todos los botones iguales para el menú.

La botonera de apple es un buen ejemplo de este caso.


En el segundo escenario nos podemos encontrar con varias casos.

1. Tenemos botones con textos que varían mucho de tamaño.
   
2. Tenemos un sistema de navegación dinámico donde ponemos y quitamos botones en función de las preferencias / permisos del usuario.
   
3. Tenemos un diseño de página fluido, pero no los suficientes botones como para llenar todo el ancho de la página.
   

En cualquier caso, el definir el tamaño del botón en función del contenido parece ser la opción más flexible. No obligamos a estar escribiendo textos que se ajusten al diseño, si no que hacemos que el diseño se adapte al contenido.

En este caso deberemos especificar los márgenes que queremos que cada botón tenga alrededor del texto.





La botonera del mail de yahoo es un buen ejemplo de esta práctica.

¿Cúal es la solución correcta?

Cómo siempre, depende y como siempre se suelen combinar ambas opciones.

La solución de tamaños fijos es mas elegante pero requiere cierta disciplina a la hora de redactar contenidos y suele ser una buena opción para la navegación principal de un site.

Es decir, el nivel superior debe ser un nivel muy exigente a nivel de redacción y posicionamiento. No podemos poner cualquier cosa en el primer nivel y no deberiamos dar la imagen de empresa poco homogenéa en cuanto a sus "ideales".

La solución de tamaños fluidos es mas flexible pero menos elegante visualmente pero es más operativa para segundos niveles donde podemos necesitar esa flexibilidad para acomodar diferentes necesidades.

Tablas

Algunas recomendaciones básicas para crear tablas.

1. Siempre mira bien el contenido e intenta comprender que se está contando.
   
2. Separa los contenidos fijos de los dinámicos.
   
3. Identifica totales, resúmenes, conclusiones.
   

Usuarios que han visto este tema también han visto...

- Que es el Spam y como evitarlo
- Diseño a futuro: Estándares y la web
- Estrategia para mejorar la Popularidad Web
- Emoción y producto
- Qué es la Accesibilidad Web

- Versión imprimible de este documento
- Enviar por e-mail este documento