Menos es más: Fundamentos del minimalismo en Diseño Web

() translation by (you can also view the original English article)

Combatir la batalla contra el desorden es algo que cada diseñador emprende, ya sea en su propio sitio o cuando diseña para un cliente. El diseño de tu sitio web debe mejorar el propósito al centrarse en el contenido y ser utilizable por todos. Tomarse el tiempo extra para asegurarse de que no se pasen por alto detalles producirá un sitio web efectivo y atractivo.

Definir el propósito del sitio

"Tu sitio necesita un propósito claramente definido desde el principio para eliminar cualquier confusión...

Lo primero es lo primero: antes de abrir tu aplicación favorita de gráficos para diseñar tu nuevo sitio minimalista, deberás establecer para qué se utilizará el sitio. Tu sitio necesita un propósito claramente definido para eliminar cualquier confusión desde el principio al tener un único punto focal fuerte. Puede ser mostrar fotografías galardonadas a clientes potenciales, compartir noticias tecnológicas de última hora o vender juguetes para mascotas hechos a mano. Comienza haciendo una declaración simple:

Mi sitio necesita ______________________________________.

Educar a los adolescentes sobre los peligros de enviar mensajes de texto y conducir
Mostrar fotos premiadas a clientes potenciales
Vender juguetes premium para perros hechos a mano

Al definir claramente un propósito desde el principio, podrás usarlo para ayudar a mantener tu diseño encaminado. A medida que trabajes con los elementos de diseño, continúa haciéndote preguntas como:

¿Esto complementará y reforzará el propósito de mi sitio?
¿Es esto realmente necesario o solo estoy llenando espacio?
¿Esto distraerá el propósito de mi sitio?

Cualquier cosa que agregues al sitio que no refuerce el verdadero propósito de tu sitio puede ser una distracción, debilitando tu mensaje general. Los elementos adicionales deben complementar tu enfoque.

Tu sitio que vende palitos de pogo de alto rendimiento no necesita tener un enlace a tu portafolio de fotografías, no importa cuán increíble sea.

Este no es el momento para las cosas que deseas en tu sitio, lo que se necesita es lo realmente importante. Solo tienes unos segundos para convencer a tus visitantes de quedarse y leer tu mensaje.

Sudar las pequeñas cosas

Cada detalle tiene importancia, lo que eliminas de tu diseño es tan importante como lo que agregas.

Los fundamentales son solo eso, fundamentales. Todos tus principios de diseño se vuelven mucho más importantes para comprender e implementar cuando se eliminan el desorden y los elementos innecesarios, lo que lleva tu mensaje a la vanguardia.

Los errores se magnifican con diseños limpios, simples y minimalistas. Asegurarse de que has estudiado los fundamentos del diseño es vital cuando se trata de colocar elementos en la página y relacionarlos entre sí. Todo lo que hagas necesita planificación y propósito, solo porque haya espacio para "una cosa más" no significa necesariamente que deba haber algo allí.

Muchos, si no todos, los principios de diseño se aplican a diseños limpios, simples y de estilo minimalista, pero asegúrate de obtenerlos desde el principio:

Unidad

Los elementos de tu página deben llevarse bien y encajar bien para mejorar el diseño general. Los elementos que se destacan para llamar la atención en la página deben destacarse porque tú lo deseas, no porque no encajen con los otros elementos de la página.

Las simples salpicaduras de color agregan interés a un esquema de color en blanco y negro y atraen tu atención desde el logotipo hasta lo creativo, ingenioso y divertido.

Espacio en blanco

Los elementos en la página necesitan espacio para respirar. Puede parecerte lógico y puedes estar haciéndolo sin pensarlo, pero las solicitudes comunes de los clientes parecen ser:

"Agreguemos una cosa más, parece que hay mucho espacio extra aquí..."
"Hay espacio debajo del menú, muévelo hacia arriba para que podamos agregar..."
"Hay una brecha a lo largo de los lados del sitio, también debemos incluir..."

Al renunciar a un espacio en blanco valioso entre los elementos, el sitio se vuelve pequeño y los elementos comienzan a funcionar juntos, sin darle a los ojos un descanso necesario que ayuda a definir áreas separadas.

Web Creme tiene un número limitado de anuncios, pero los coloca en un área con mayor impacto.

Alineación

Hay muchas formas de alinear objetos en una página, pero con un diseño limpio, simple y minimalista, si algo está a uno o dos píxeles de distancia, será mucho más fácil de detectar.

Usa una cuadrícula para mantener todo lo que necesitas alineado, al cuadrado y perfecto. Son geniales desde el boceto de un diseño hasta el desarrollo con muchos frameworks para elegir.

¿La sutileza no es lo tuyo? Crea un impacto inmediato eligiendo un color audaz para complementar Tu diseño.

Jerarquía

Con muchos sitios, solo tienes unos segundos para transmitir tu mensaje o ayudar a guiar a un usuario a donde quieres que vaya.

La forma en que usas diferentes tamaños y pesos de elementos crea una ruta, guiando al usuario a través de la página, que generalmente termina en un área de llamado a la acción. Cuando los usuarios se sienten cómodos, se dirigen en la dirección correcta, continuarán, pero si están confundidos sobre lo que está sucediendo, pueden sentirse frustrados.

Eliminar lo innecesario

¿Cuál es la mejor manera de encontrar y eliminar elementos innecesarios? ¡Por no agregarlos en primer lugar! Dedica tiempo adicional a planificar el sitio y a definir tu propósito desde el principio para eliminar los extras que solo estaban llenando el espacio.

Durante el proceso de diseño, debes pasar mucho tiempo revisando cada elemento de tu sitio preguntándote: ¿realmente necesito esto? Tu propósito o enfoque puede cambiar ligeramente en el camino, por lo que es una buena idea seguir preguntándote esto a medida que avanzas.

Si tienes acceso a un grupo de prueba, intenta usar el software de seguimiento de clics en un sitio de prueba para localizar elementos que nunca se usan. Mira los elementos no utilizados y decide si puedes eliminarlos o colocarlos en una ubicación diferente.

Recuerda, crear un diseño limpio, simple y minimalista le permite a la mente llegar a lo básico, mostrar a tus visitantes lo que tienes para ofrecer y transmitir tu mensaje de la manera más eficiente posible.

La usabilidad no es opcional

No hay una buena razón para elegir el diseño sobre la usabilidad, funcionarán juntos perfectamente si se ejecutan correctamente. Un sitio bien diseñado y fácil de usar mantendrá a los visitantes por más tiempo y cumplirá el propósito final del sitio de mostrar tu contenido y entregar tu mensaje de manera efectiva.

Un sitio que sea fácil y cómodo de usar casi se sentirá como si estuviera leyendo la mente del usuario y la navegación se vuelve fácil y divertida.

No tengas miedo de ser creativo con nuevos estilos y técnicas, pero sé consciente de la funcionalidad común y la ubicación de los elementos que puedes dar por sentado:

Los enlaces deben ser fáciles de identificar y de clickear
Siempre proporciona una manera de volver a la página principal
Nunca desactives el botón de retroceso
Agrega botones para cerrar el contenido en ventanas emergentes
Indica en qué página se encuentra actualmente el usuario

Algunas personas asocian diseños limpios, simples y minimalistas con texto en miniatura y elementos casi inutilizables en una página vacía. Algunas de las pautas más básicas se pasan por alto al diseñar nuevos sitios:

La navegación debe ser consistente e intuitiva de usar
El contenido debe ser legible con títulos claramente definidos.
El código debe estar limpio y cumplir con los últimos estándares web.
Asegúrate de que tu sitio se muestre y funcione correctamente en todos los navegadores

Localización de puntos problemáticos

Si bien algunas cosas se ven geniales en la fase de diseño, una vez que obtienes el sitio en tu navegador, puedes descubrir desafíos de usabilidad que nunca notaste mientras el diseño estaba en Photoshop.

Una excelente manera de descubrir cómo se usa el sitio es agarrar a un voluntario y mirar por encima del hombro o (con su permiso) usar una herramienta para compartir el escritorio si no se encuentra en la misma ubicación física.

Dales una lista de tareas y observa de cerca para ver si se logran fácilmente:

Comprar un libro de mi tienda
Contactarme para una cita
Descubrir mi pasado

Es posible que te sorprendas de cómo diferentes personas pueden interpretar diferentes áreas del sitio o los caminos que pueden tomar. Míralos atentamente pero no brindes ayuda ni consejos en el camino.

¿Sabrán dónde hacer clic?
¿Se pierden en un área específica?
¿Están haciendo clic en un elemento de diseño pensando que los llevará a una nueva página?
¿Les cuesta hacer clic en un ícono pequeño?

Toma notas sobre las áreas en las que pueden tener dificultades y encuentra formas de mejorar. No te pongas a la defensiva ni te enojes si se encuentran problemas con el sitio. Usa ese nuevo conocimiento para mejorar tu trabajo y llevar ese conocimiento a proyectos futuros.

¡Pero me gusta el color!

Crear un diseño limpio, simple y minimalista no significa que debas estar atascado en blanco y negro o con un sitio monótono y poco interesante, solo aprende a simplificar tus elecciones de color. Hay dos rutas principales para tomar al agregar color:

Salpicadura de color

Con pequeños toques de color, los ojos de tus visitantes sabrán de inmediato que el área con color es importante. Usa esto para tu ventaja usándolo para pintar un camino para que los ojos lo sigan.

Simple pero audaz

Una opción más atrevida puede ser hacer tu declaración de color en el fondo con un color sólido en negrita. La negrita puede distraer, así que asegúrate de no estar eliminando el mensaje de tu sitio, lo que hace que sea difícil de leer o inutilizable, pero esto definitivamente hará que tu sitio se note.

No es para todos

Casi cualquier persona se beneficiará de un sitio con un fuerte enfoque, pero un estilo limpio, simple y minimalista no es para todos.

Website Theme Authors - A menudo solo obtienes unos segundos antes de que un comprador decida si quiere pasar tiempo mirando el sitio que creaste. Mostrar solo un diseño súper minimalista como la única opción de diseño puede registrarse como "básico" y puede considerarse inmediatamente como carente de características. Es posible que solo necesites mostrar varios niveles de lo que es posible en áreas y dejar que decidan si usar la función o no.

Ad Heavy Sites - El estilo limpio, simple y minimalista probablemente no sea el mejor para los sitios que dependen en gran medida de la publicidad, a menos que conozcas que los propietarios de los anuncios van a publicar contenido que se adapta a tu estilo. Una mejor opción puede ser colocar menos anuncios pero ubicarlos en un área en la que se haga clic al máximo.

Encontrar un equilibrio

Al darte cuenta de que no todos tenemos el control total de lo creativo en cada proyecto de diseño, intenta encontrar un equilibrio con tus clientes.

Cuando expliques por qué diseñaste un sitio de cierta manera, consulta otros sitios que hacen las cosas correctamente y explica por qué funciona y por qué su sitio web es un éxito.

Explica cómo se beneficiaron y cómo tú también podrías. Muéstrales los resultados positivos y las respuestas que ha recibido el otro sitio debido a las buenas opciones de diseño y al tiempo extra para garantizar que todos los visitantes tengan un sitio efectivo y utilizable.