Cómo Hacer un Diseño Web Minimalista

Si quieres pasar de tener una web a tener un Negocio 2.0, lee con atención este artículo. 

Estamos en la era del diseño minimalista (al más puro estilo Apple), pero lo que es más importante, solo si te centrar en lo que realmente importa conseguirás despegar tu Negocio 2.0.

Una sola columna sin sidebar

Actualmente está cambiando radicalmente el diseño web hacia un estilo absolutamente minimalista. Han desaparecido los sidebar y todo es “1-column”.

Sin logo gráfico.

se han eliminado los logos (solo se pone el nombre).

Letras negras sobre fondo blanco

el menu y el logo de cabecera suele hacerse en color negro y letras blancas, y el resto de blog es minimalista: letras negras sobre fondo blanco. Punto.

3 bloques: acceso rápido, principal, y menú

Básicamente el diseño tiene 3 bloques: un menu en color negro, una área principal en color blanco, y un footer en color negro. Cualquier elemento de color será utilizado solo en el área principal y limitado solo a los “call to action”. En este contexto minimalista, una imagen o video destaca visualmente porque de repente aporta un impactante destello de color, fugaz porque después vuelve todo de nuevo a su armonía minimalista.

El menú de arriba es para “acceso rápido” a las cosas más habituales realizadas por los usuarios (esto se llama “customer experience” o mejorar la experiencia del usuario en “usabilidad”).

El resto de opciones menos comunes se ponen en el footer. Es decir, el footer se ha convertido en el “menú” de tu blog o web).

Temas minimalistas WordPress “de moda”

Hay varios temas WordPress “de moda” en esta tendencia minimalista donde destacan GeneratePress y Orbital (de Romuald Fons).

Las fuentes (fonts) hoy día se reducen a 3

Algo que acompaña al minimalismo es la búsqueda del rendimiento óptimo de tu web (velocidad de carga). El diseño gráfico ha estado centrado en buscar una font bonita, pero en esta tendencia minimalista lo que se busca es “velocidad” de carga (lograr un 100/100 en el test de Google Page Speed Insights). Y lo que mucha gente no sabe es que la font influye en la velocidad de carga de tu web.

Así, hoy día conviene trabajar con Fonts locales (por ejemplo Arial). En el siguiente artículo puedes ver cómo afecta la font a la velocidad de carga de tu web, lo que nos lleva a olvidarnos del diseño web y centrarnos en lo que realmente importa:

https://www.keycdn.com/blog/web-font-performance/

Básicamente quédate con esta idea:

Ejemplos de webs minimalistas

A continuación te muestro varios ejemplos de webs con éste diseño minimalista.

Este primer ejemplo es Dropmysite, donde el foco está en facilitar al usuario realizar la tarea que quiere:

 

Este segundo ejemplo es un CPanel de A2Hosting, igualmente el diseño sigue exactamente este mismo patrón:

 

El tercer ejemplo es un simple blog (ejemplo post https://adampreiser.com/why-i-got-rid-of-sendy/) donde vemos exactamente el mismo patrón minimalista 1-column:

 

El último ejemplo es de EasyDigitalDownloads (este post: https://easydigitaldownloads.com/blog/the-12-most-popular-digital-products-you-can-sell-online/), el carrito “fácil” para webs WordPress:

Elimina las imágenes (featured images) y reemplazarlas por CSS

Ya se que esto te sonará super radical, pero es justo lo que ya está hacendido Google para sus blogs (Think With Google). La imágenes pueden ser reemplazas por insertar colores mediante CSS en algun elemento (el menu de cabecera y lo botones sociales):

Otro ejemplo lo podemos ver en GoDaddy:

Y también en esta otra:

 

¿Es el final del diseño gráfico? (ya sabes lo que me refiero: te diseño tu logo, te diseño tu imagen de marca, etc.)

Google quiere microdatos estructurados, nada de diseño gráfico. No puedes dejar tu proyecto digital en manos de una persona que diseña cosas bonitas con themes con iconitos, con cajitas Divi o similares. La información debe estar completamente estructurada y la única forma de hacerlo es desde el lado de la programación (no “pintando” desde el front).

Ólvídate del diseño web, ha muerto. Trabaja con un SEO y un programador para simplificar al máximo tu web y verás los resultados. Te recomiendo mi artículo de Cómo Mejorar el Rendimiento de WordPress.

 

commentarios