Fondo diseño web en Guadalajara
Atracción Web
Tendencias del diseño web actuales (y por qué son más que tendencias)

Tendencias del diseño web actuales (y por qué son más que tendencias)

27/Jun/2017

Compártelo:
Facebook Google+ Twitter

En diseño, y sobre todo en diseño web, no paran de surgir nuevas máximas y tendencias que obligan al designer a estar constantemente experimentando y renovándose. Algunas de éstas son meramente estéticas, pero otras tantas, ponen en entredicho las maneras habituales de generar nuevos sites, y facilitan la usabilidad y la navegabilidad del usuario.

Vamos a hacer un leve recorrido por algunas de estas nuevas corrientes, en Atracción Web nos gusta que nuestros cientes conozcan bien las novedades del diseño y confíen en nostros para desarrollarlas.

EL DISPOSITIVO MÓVIL, EL MÁS EMPLEADO PARA NAVEGAR EN 2016

Sabemos que la última estadística estima que un 62% del tiempo total pasado por los usuarios en el mundo online, ya se realiza desde smartphones y tablets. Y ya son más de la mitad los usuarios acceden a nuestros sites desde dicho dispositivo.

Pero ¿En qué influye esta cifra a la hora de generar nuevas webs?

Esencialmente, en cómo se ha de preparar la maquetación web. Si actualmente prima la navegación desde dispositivos de este tipo, hay que preparar las webs para que la experiencia del usuario sea óptima. Ya llevamos años escuchando el término mobile-first (el móvil primero), que prioriza el diseño web para retículas móviles antes que para la vista desde ordenador, pero actualmente toma más relevancia que nunca. Esto quiere decir que primero se diseña para la vista móvil y en base a la susodicha, se desarrollarán el resto de maquetaciones (Tablet y PC).

También implica cambios sustanciales en el flujo de lectura y en el modo de navegación, así como en la iconografía (por ejemplo, se está comenzando a compilar el menú en el icono “hamburguesa” en la vista PC, muy empleado en maquetaciones móviles y apps).

MICROINTERACCIONES, INTEGRAR AL USUARIO EN LA NAVEGACIÓN

Las microinteracciones son señales visuales que advierten al user de que ha realizado una acción dentro de un sitio web.

Básicamente son recursos animados que integramos en las webs para que quien navegue por éstas comprenda que, cuando interactúa con los botones -sean del tipo que sea-, éstos lanzan acciones dentro del site. Un ejemplo claro serían los likes en las redes sociales (clickas en el botón de like y éste cambia de apariencia, para hacerte llegar que la acción se ha realizado).

Las microinteracciones no sólo dinamizan la web y resultan atractivas a la vista, sino que además resultan tremendamente útiles a la hora de navegar por un sitio y comunicarnos con el entorno web. Es importante, a la hora de incluir este recurso en nuestro diseño, comprender que no son mera decoración y que sólo han de incluirse cuando son necesarias, ya que, si abarrotamos todo de microinteracciones inútiles, la navegabilidad se verá entorpecida y la comunicación web-usuario perderá coherencia.

Un apartado interesante de las microinteracciones son los HOVER: estas animaciones se lanzan de manera indirecta y no consciente por parte de los usuarios, sólo con pasar el ratón por encima de una sección concreta. Informan al user de que determinados botones, apartados o puntos de una web desatarán una acción si son clickados. Es evidente que sólo funciona en pc, pero eso no implica que la navegabilidad en dispositivos móviles se vea entorpecida, ya que el usuario entiende de manera subconsciente las diferencias de navegación entre un dispositivo y otro.

LA CARGA PROGRESIVA O CÓMO NO ABURRIR AL USUARIO

También llamado diseño de esqueleto, este término hace referencia a la carga del contenido de la web y no al diseño en sí. La carga progresiva garantiza la máxima velocidad de carga de un site, y esto se consigue haciendo una llamada al contenido por etapas. Dicho de otro modo, se van cargando los contenidos que en ese momento han de visualizarse en la pantalla; el resto de contenido que aún no se ve, ya que se sitúa en la parte inferior o en puntos que no están visibles en ese golpe de vista del user, no se carga hasta que, por ejemplo, se ejecuta el scroll o se activa un botón que llama a otro apartado de la web.

 

Este nuevo concepto ayuda a que las cargas de imágenes y el resto del contenido no sean desesperantes, favorece no sólo la navegación y la experiencia del usuario, sino que también ayuda a que éste permanezca en tu web, ya que toda la experiencia será fluida, dinámica visualmente, y amena.

RETÍCULAS Y SUS POSIBILIDADES

Gracias a las actualizaciones de CSS, la manera de componer podrá homogeneizarse en casi todos los navegadores, posibilitando nuevas composiciones de manera más sencilla para los desarrolladores web, y ampliando el espectro de maquetaciones a los diseñadores (¡por fín!). Esto significa mayor libertad a la hora de componer y generar retículas, también llamadas cuadrículas.

Si además aunamos esto con la constante renovación en diseño web, llegamos al punto actual, en el cual la retícula tradicional, recta, lineal y algo aburrida a la que estamos acostumbrados, se rompe y se libera, dando lugar a nuevas maquetaciones más dinámicas y atractivas.

Cuando las nuevas retículas, más libres, se aúnan con la carga progresiva anteriormente citada, encontramos nuevas composiciones y webs más atractivas, dinámicas y divertidas, dando lugar a una experiencia de usuario que hará de tu web un sitio donde uno querrá quedarse.

APUESTAS GANADORAS DE CARA AL DISEÑO

Gradientes y duotonos: el color vuelve al mundo web 

Después de varios años dejando de lado dichos recursos, debido a la predominancia del flat design y el minimal, vuelven los degradés. Generalmente vuelven aplicados a superficies amplias, como fondos y capas dentro de un site, pudiéndose dar con más de un par de colores –en este caso sería gradiente- o sólo con dos (duotono). Señales que indican que el degradado está volviendo con fuerza podría ser el nuevo logo de Instagram, y toda la identidad de Spotify, que podría decirse que introdujo de nuevo este recurso gracias a sus últimas campañas.

Los gradientes bien empleados aportan dinamismo e interés a tu site, además de que, al trabajarse con color, consiguen transmitir las sensaciones (psicología del color) y emociones que tu propia marca quiera enfatizar.

Imagen + texto, una combinación que nunca falla

También llegó en torno al 2015 pero tiene intención de quedarse. Hablamos de la superposición o composiciones que juegan con imágenes y texto. Generalmente se emplea la imagen de alta resolución y con calidad estética de fondo, de encabezado, botón, etc, y se superpone el texto de manera en que no sólo conjugue bien, sino que no se pierda legibilidad y que la foto y el texto articulen a la perfección, para potenciar el mensaje que se ha de transmitir.

A nivel estético es un recurso que funciona muy bien, ya que una buena imagen de por sí, mejora mucho la apariencia de un site, pero si además se juega con claims o eslóganes preparados con una buena tipografía, conseguimos un resultado llamativo y óptimo y que funciona en casi cualquier ámbito profesional, sea cual sea el tuyo.

Minimal, la corriente que permanece (y permanecerá)

Como bien sabemos, el minimalismo en diseño web lleva años instaurado y podemos apostar por que se mantendrá mucho más tiempo en todos los ámbitos del diseño. Y es comprensible, ya que es un estilo que al ser limpio y sintético, puede considerarse atemporal.

Uno de los campos donde predomina actualmente dicha corriente, es en el branding. Además de no camuflar el nombre de tu empresa ni enmascararlo, tiene múltiples ventajas de cara a las aplicaciones de tu logotipo. Facilita la lectura, además de la compresión por parte de tus clientes;  esto significa que tu logo será más pregnante y más fácil de retener. Otro punto importante es que no rivalizará con el resto de contenido de tu web a la hora de integrarlo en la maquetación de ésta; con una correcta disposición del contenido, tendrá su importancia y visibilidad prioritaria en la web, pero no enturbiará la correcta legibilidad del resto de elementos repartidos por el site.

 

Esperamos que este artículo sea de utilidad y os oriente acerca de qué corrientes os resultan más cercanas a la imagen que queréis transmitir en internet. En Atracción Web siempre estamos dispuestos a ayudaros a emprender y desarrollar ese camino, vuestra presencia y poosicionamiento, mediante todas las vías posibles, en la red. 

 

Todas las imágenes son de elaboración propia y de nuestro porfolio.

ANTERIORVOLVERSIGUIENTE

Contacta con Atracción Web
Contacta con Atracción Web
Ven a visitarnos
Síguenos en Facebook
Síguenos en Google+
Síguenos en Google+
Contacta con nosotros
Contacta con Atracción Web Contacta con Atracción Web Ven a visitarnos Síguenos en Facebook Síguenos en Google+ Síguenos en Google+
Contacta con nosotros

 

 

Cerrar

 

 

Aceptar   Cancelar