Una de las fases iniciales del proyecto, después de la entrevista e investigación es comenzar a hacer bocetos del layout para examinar de forma general la disposición de los elementos. En el proceso comenzarás a notar que tu layout es bastante parecida a otras, tal vez influencia de las referencias que has visitado o porque objetivamente te parece que son funcionales. Y este último hecho es bastante cierto, existen cierto tipos de layout que pueden ser bastante simples, pero al mismo tiempo funcionales e ideales para cierto tipo de página. En este artículo mencionamos algunas de ellas.
Rejilla simple con hero image en la parte superior
Probablemente es una de las layouts más empleadas ya que la hero image es un elemento común en una gran variedad de sitios web. La hero image permite captar la atención del usuario de forma inmediata y debido a la organización de elementos mediante una cuadrícula, el diseño luce limpio y tiene el potencial para impactar al usuario. Algunas posibles variaciones de este layout sería cambiar la hero image por un slider o incluso un video, sin embargo, su propósito sigue siendo el mismo.
De por sí, emplear columnas para el layout es considerada como una buena práctica que incluso se utiliza para diseño responsive. Y ya que los móviles se han popularizado en los últimos años, es normal que todos los recursos y tendencias que favorezcan a los usuarios móviles también se utilicen con mayor frecuencia.
En estos casos, el layout puede contener de 2 a 4 columnas, según el volumen de información del sitio y la organización del contenido que se haya utilizado. Este layput funciona principalmente porque cada elemento tiene un espacio y se logra leer correctamente todo el contenido según el orden de importancia. A pesar de tener un layout simple, se logra el impacto deseado con la hero image o slider que se ubica en la parte superior.
Una sola página con contenido ordenado en una sola columna
Los layouts para diseños de una sola página son una de las soluciones más comunes para sitios web con un volumen de contenido mínimo. Ya que la información e cada sección es breve y puntual, es mucho más efectivo dividir toda la página en las secciones respectivas que se encuentran en el menú y colocar toda la información en una misma página.
Aunque se trate de una sola página no debes olvidar de colocar el menú y enlazar cada nombre con la sección respectiva dentro de la página. En algunos casos, se obvia el menú pero es usualmente cuando se utiliza este peculiar diseño para contar una historia o mostrar una sucesión de imágenes. Sin embargo, en la mayoría de casos debería incluirse la barra de menú.
En este tipo de layout, el espacio es un elemento vital pues el diseño puede lucir vacío, incompleto o simplemente desordenado si no emplea el espacio de forma adecuada. Para ello debes asegurarte organizar apropiadamente tu información y demás elementos que colocarás en la página, así como los espacios en blanco.
Organización de elementos en base a una cuadrícula
La combinación de filas y columnas para formar una cuadrícula es otro tipo de layout que no pasa de moda. El layout se encuentra dividido en serie de cuadrados o rectángulos organizados en módulos lo que le da una sensación de orden y organización. Puedes elegir más de un recuadro para colocar el contenido de mayor relevancia y para añadir algo de variedad a tu diseño.
Este tipo de layout es bastante popular en portafolios en línea pues los recuadros permiten la colocación de vistas previas que se dirigen a la página del proyecto. Es una serie continua de trabajos colocados lado a lado, un recurso bastante atractivo en portafolios.
Adicionalmente, estos recuadros pueden emplearse para colocar texto. Es común que se intercalen imágenes y bloques de texto en una cuadrícula. Este tipo de diseño le añade variedad, sin mencionar que el texto puede ser necesario para describir algunas características básicas del proyecto o trabajo en cuestión.
Este tipo de layout ofrece una forma directa de organizar elementos y ayuda a crear un entorno bastante visual y atractivo con el que los usuarios pueden interactuar.
Ubicación de elementos en base patrones de lectura comunes
Se sabe que los patrones de lectura más comunes en la web siguen las formas de las letras Z y F. Éstos indican la dirección en el que el usuario comienza a visualizar un sitio web, el tramo que sigue su vista cuando recién ingresa a una página. Es este tipo de conocimiento que ayuda a los diseñadores a realizar ciertas decisiones sobre la ubicación de los elementos en una página web.
Puedes hacer uso de este conocimiento para crear un layout apropiado en base a estos patrones de lectura. De esta manera, ya tienes una idea de donde debes ubicar los elementos pues ya conoces los espacios en donde el usuario posará su vista.
Estos hábitos ya son comunes en los usuarios. De hecho, es probable que al visitar sitios web sigas alguno de estos patrones de lectura. Gracias a estos patrones, puedes de algún modo predecir el tipo de lectura que tus usuarios darán al sitio y es así como puedes colocar elementos en lugares estratégicos para captar su atención o logran cierto impacto en ellos.
En conclusión…
Existen una gran cantidad de opciones disponibles al momento de pensar en un layout. Debes considerar el volumen de contenido del sitio, el tipo de sitio web que deseas crear, el mensaje a transmitir, etc. Adicionalmente, tal vez quieras ser súper creativo en este nuevo proyecto y estés pensando en crear una layout poco convencional. Si bien esta es una excelente iniciativa, debes considerar también la experiencia de usuario, particularmente si el sitio web estará en línea y las personas tendrán acceso a éste.
En ocasiones ir por layouts simples y que han sido utilizadas con éxito una y otra vez puede ser la respuesta. Sabes que es importante que el contenido se organice apropiadamente, así que un layout con el que los usuarios ya se encuentran familiarizados definitivamente no perjudicará tu proyecto.
