Corrígeme si me equivoco, pero diría que…
… en un proyecto de Home Staging, nada se deja al azar.
… cada elemento está donde está por una razón y, al mismo tiempo, interactúa con el resto de de la composición.
.. no hay lugar para la aleatoriedad.
La cuestión es que, con el diseño web, sucede algo parecido.
Tanto tú en tus proyectos de Home Staging como yo en mis diseños, buscamos evitar el caos y el desorden.
La razón es sencilla: el caos y el desorden no venden. Y tanto tú como yo, queremos que nuestro trabajo ayude a nuestros clientes a vender.
Para conseguirlo, seguimos ciertos principios o normas, como prefieras llamarlos. Y uno de esos principios, al menos en diseño web, es el principio de alineación.
¿Qué es el principio de alineación?
Dato curioso: Este es uno de los principios del diseño web que más veces se incumple, a veces de forma intencionada, otras por falta de atención.
El principio de alineación tiene como función principal organizar el contenido, y nos dice que cada uno de los elementos de una página web debe tener algún tipo de conexión visual, como mínimo, con otro elemento de la misma página.
Se trata de un principio realmente importante ya que influye en la manera en la que los demás perciben nuestra web.
Cuando se aplica de la forma correcta, logramos transmitir orden, equilibro y armonía gracias a la relación entre los elementos.
Cuando no se tiene en cuenta, el resultado suele ser más caótico e incoherente, lo cual puede provocar cierto rechazo en el usuario durante su visita.
Creo que estarás de acuerdo conmigo en que…
… a veces entras en una web y, a pesar de gustarte el mensaje, los colores, la tipografía o las imágenes, sientes que hay algo que te produce cierta incomodidad, aunque no sepas decir exactamente qué es ese algo.
En muchas ocasiones, no en todas, esa incomodidad tiene su origen en una mala alineación de los elementos.
¿Cómo saber si mi web cumple con el principio de alineación?
El método más sencillo consiste en trazar varias lineas (guías) horizontales y verticales a lo largo y ancho de nuestra web, y comprobar si:
1) Las diferentes secciones contienen elementos que coinciden con otros elementos de secciones anteriores y/o posteriores.
2) El espacio entre las diferentes secciones es uniforme.
No te preocupes si no ves claro cómo hacerlo. En el siguiente apartado te lo muestro con un ejemplo.
Lo importante aquí, lo realmente valioso de esta información, es que empieces a ver cómo la forma en la que están colocados cada uno de los elementos de tu web, imágenes y textos principalmente, influirá directamente en cómo tus visitas recibirán el mensaje.
Y es tan importante porque, en internet, uno de los objetivos más difíciles de alcanzar es atraer a las personas adecuadas hasta tu web.
Por esa razón vale tanto la pena cuidar de cada detalle y asegurarnos de que, cuando esas personas lleguen, tengan la mejor experiencia posible.
Dicho lo cual…
Ahora sí, veamos con un ejemplo cómo saber si nuestra web web cumple con el principio de alineación y, de ese modo, sepas dónde tocar para llevar tu diseño al siguiente nivel.
Ejemplo
A continuación, una de las páginas de mi web.
Fíjate en lo siguiente…
Primero, las líneas verticales, las rosas.
Las líneas verticales rosas marcan los márgenes laterales y la separación entre columnas que, en toda la página salvo alguna excepción, son exactamente iguales.
Al mismo tiempo marcan el ancho de las diferentes columnas y, como puedes apreciar, cada bloque de texto encaja a la perfección (o casi).
Las imágenes también se alinean siguiendo las guías.
La primera imagen, alineada a la izquierda, coincide, además, con la guía que marca el centro de la columna.
La segunda imagen, en esta ocasión centrada, también coincide con la guía que marca el centro de la columna.
Ahora las líneas horizontales, las verdes.
Las líneas horizontales definen el espacio entre secciones.
Este espacio debe ser suficiente para diferenciar cada sección de las demás, y, al mismo tiempo, debería ser igual para cada sección en toda la página, tal y como ves en el ejemplo.
Creo se entiende la idea.
Ahora bien. Si visitas la página (puedes verla aquí), comprobarás que algunos elementos quedan fuera de las guías.
¿Por qué?
La idea es que, conociendo la norma, podemos romperla, por ejemplo, para darle mayor protagonismo a ciertos elementos.
Lo puedes ver en el siguiente ejemplo en el que, saliéndome de las guías y añadiendo una animación, intento dirigir la atención del lector hacia esta sección en particular.
Conclusión
El título de este artículo, al menos para mí, tiene todo el sentido del mundo. Me encantaría conocer tu opinión.
Al fin y al cabo, un proyecto de Home Staging suele incluir tantos elementos o más que un página web, y todos tienen que relacionarse entre sí de la manera adecuada para que el conjunto esté alineado y sea equilibrado.
Lo cual, como bien sabes, no es nada fácil.
Ese equilibrio en la manera de presentar una vivienda, o, en el caso de una web, en la manera de presentar el contenido, marca la diferencia a la hora de comunicar el mensaje que queremos comunicar.
En definitiva, marca la diferencia entre vender el producto o el servicio, o no vender.
Porque ese es el objetivo final, vender. En tu caso vender la casa de tus clientes, en mi caso, ayudarte a vender tus servicios a través de tu web.
Ahora bien, como también sabes, una vez conocemos las normas, podemos romperlas intencionadamente, por ejemplo, para conseguir que algo destaque sobre el resto.
Cuéntame…
¿Te ha servido este artículo? ¿Has revisado tu web de Home Staging para ver si los elementos cumplen el principio de alineación?
Me encantaría leerte en la sección de comentarios.
Mientras tanto, hasta la próxima semana.
