Blog
26/09/2017

Tendencias diseño web 2018

Para estar al día y poder ofrecer a nuestros clientes los mejores diseños web, es evidente que hay que estar a la última en cuanto a las tendencias en diseño web.

Como nos gusta ir por delante, en este post vamos a ver las tendencias en diseño web que se van a llevar el próximo año 2018.

Actualizamos nuestra serie: conoce las tendencias de diseño web 2026 que definirán la próxima generación de sitios digitales.

Tendencias diseño web 2018, rendimiento e interacción

Objetos vectoriales animados

tendencias diseno web 2018

Cada vez está más de moda. Lo vectorial vende muy bien. Si además de ello lo animamos, conseguimos una mezcla entre sencillo y sofisticado.

Podemos añadir elementos interactivos, que reaccionen al hover o click del mouse. El objetivo será llamar la atención del usuario.

Alguna de las formas para insertar este tipo de experiencias en nuestro diseño web, puede ser haciendo uso de SVG o el elemento Canvas.

Os recomendamos que le echéis un vistazo a librerías como Lazy Line Painter para SVG y P5JS para Canvas.

Sin duda será una de las tendencias para este 2018 en cuanto a diseño web.

Uso del espacio negativo

El uso del espacio negativo va a tomar gran protagonismo este 2018 en el momento de diseñar una página web. Ya sea a través de imágenes, vídeos y tipografías, hacer un buen uso del espacio negativo, va a dar un toque muy actual a nuestro diseño web.

Negritas y tipografías con personalidad

tendencias diseno web 2018 2

Las tipografías con potencia y cuerpo, van a seguir siendo tendencia, tal y como ya lleva siéndolo desde hace varios años. Lejos quedaron los tiempos en que las tipografías finas eran las protagonistas. Ahora se llevan las negritas y las tipografías con peso.

Las combinaciones entre Serif y Sans, serán también muy bien recibidas, y por lo tanto tendencia en diseño web durante el 2018. Si hacemos correctamente entre ellas buen un juego visual, conseguiremos un abanico de contrastes muy bonito, siempre que lo hagamos con gusto en el momento de elegir cada peso para cada una de ellas.

Cinemagraphs

Los cinemagraphs son una fusión entre una imagen estática junto con un vídeo en completo movimiento. Eso crea un efecto visual el cual llama muchísimo la atención del usuario.

Aunque será tendencia en diseño web este 2018, el uso de cinemagraphs, sin embargo, deberá ser usado con cabeza y con cierta justificación. Puesto que se trata de un recurso que, probablemente, al llevar elementos del tipo vídeo, éstos van a tener un peso considerable y por lo tanto, habrá que tener en cuenta las conexiones con anchos de banda más limitados. Además de eso, recordemos que los usuarios mobile, generalmente, van a rechazar completamente el uso de vídeos cuando se encuentren fuera del alcance de un punto wifi.

Un buen uso de los cinemagraphs, sería utilizándolos como hover en un bloque o para una imagen a modo de header. A partir de eso, estamos seguros, que van a salir otras aplicaciones sorprendentes que a ninguno se nos había pasado por la cabeza.

Te invitamos a que nos sigas en facebook para estar al día cada vez que colguemos un nuevo post de inspiración… y cuidado, porque estamos preparando algo especial y exclusivo para nuestros seguidores para finales de 2018! ¡Síguenos!

Scroll y animaciones

Que el contenido cargue conforme va avanzando el scroll es una de las tendencias en diseño web, que llevamos viendo desde hace unos años, pero que cada vez va a tomar más presencia.

Tener un diseño web que va mostrando el contenido junto con el paso del scroll, ayuda al usuario a sentirse parte del site. Puesto que le vamos sirviendo el contenido de forma animada conforme va scrolleando por el site, se verá un diseño web mucho más vivo y atrayente.

Elementos pegados en el inferior del site

Ahora que cada vez más están en auge los dispositivos mobile, vamos a ir viendo cada vez más como se hace tendencia en el diseño web, el hecho de pegar los menús no ya en la parte superior de la pantalla, como llevamos haciendo desde hace años, si no en la parte inferior.

El motivo es simple: en cuanto a términos de usabilidad, el gesto más sencillo para navegar es el uso del dedo pulgar buscando por lo tanto la parte inferior de la pantalla.

Si tomamos las apps como el zenit en cuanto al diseño y usabilidad para dispositivos mobile, no sin razón, todas éstas nos dicen lo mismo: los menús enganchados a la parte inferior.

Elementos 3D interactivos

Van a seguir siendo los reyes encabezando los mejores diseños web. Los objetos 3d animados o interactivos, llaman mucho la atención de los usuarios, puesto que no estamos acostumbrados a ver éste tipo de elementos dentro de un navegador y nos adentra muchísimo al sitio web, haciéndonos sentir parte de él.

Alguna de las librerías más interesantes para realizar éste tipo de animaciones 3D es Three.js. Os recomendamos que le deis un vistazo ya que no tiene desperdicio.

También te puede interesar…

¡Si quieres inspiración web, mira el post sobre los mejores diseños web 2017 2018!

Te invitamos a que nos sigas en facebook para estar al día cada vez que colguemos un nuevo post de inspiración… y cuidado, porque estamos preparando algo especial y exclusivo para nuestros seguidores para finales de 2018! ¡Síguenos!
¿Te ha gustado?
Sucríbete
Artículos relacionados
¿empezamos a trabajar
en tu proyecto?

Analizamos tu situación actual y definimos el siguiente paso.

Contacta ahora
Nuestro sitio utiliza cookies para recopilar información sobre su dispositivo y su actividad de navegación. Utilizamos estos datos para mejorar el sitio, garantizar la seguridad y ofrecer contenido personalizado. Puede gestionar sus preferencias de cookies haciendo clic aquí.
Aceptar cookies Configurar Rechazar cookies
Información básica de las cookies
Este sitio web utiliza cookies y/o tecnologías similares que almacenan y recuperan información cuando navega. En general, estas tecnologías pueden tener finalidades muy diversas como, por ejemplo, reconocerte como usuario, obtener información sobre tus hábitos de navegación o personalizar la forma en la que se muestran los contenidos. Los usos específicos que hacemos de estas tecnologías se describen a continuación. Por defecto, todas las cookies están deshabilitadas, excepto las técnicas, que son necesarias para el funcionamiento del sitio web. Si desea obtener más información o ejercer sus derechos en materia de protección de datos, puede consultar nuestra Política de cookies".
Aceptar cookies Configurar
Cookies técnicas necesarias Siempre activas
Las cookies técnicas son estrictamente necesarias para que nuestro sitio web funcione y puedas navegar por él. Este tipo de cookies son aquellas que, por ejemplo, nos permiten identificarte, darte acceso a determinadas partes restringidas de la página si es necesario, o recordar diferentes opciones o servicios ya seleccionados por ti, como tus preferencias de privacidad. Por tanto, están activadas por defecto, no siendo necesaria su autorización. Mediante la configuración de su navegador puede bloquear o alertar de la presencia de este tipo de cookies, aunque dicho bloqueo afectará al correcto funcionamiento de las diferentes funcionalidades de nuestra página web.
Cookies de análisis
Las cookies de análisis son las utilizadas para llevar a cabo el análisis anónimo del comportamiento de los usuarios de la web y que permiten medir la actividad del usuario y elaborar perfiles de navegación con el fin objetivo de mejorar los sitios web.
Confirmar preferencias
contacta con nosotros
Formulario

Cuéntanos
tu proyecto

Indica el contexto general de tu organización y el alcance previsto del proyecto.
Code Barcelona, como responsable del tratamiento de sus datos, tratará los mismos con la finalidad de dar respuesta a la consulta y/o petición que nos realiza a través de este formulario de contacto. Puede ejercer los derechos de acceso, rectificación, supresión, así como otros derechos consultando la información adicional detallada sobre Protección de Datos en nuestra política de privacidad.
Title
Popupcontent
Análisis de tu situación digital

Revisaremos tu situación digital actual. Nos pondremos en contacto contigo para entender tu contexto y valorar conjuntamente qué áreas analizar, y posteriormente elaboraremos una auditoría con los puntos clave y recomendaciones.

Code Barcelona, como responsable del tratamiento de sus datos, tratará los mismos con la finalidad de dar respuesta a la consulta y/o petición que nos realiza a través de este formulario de contacto. Puede ejercer los derechos de acceso, rectificación, supresión, así como otros derechos consultando la información adicional detallada sobre Protección de Datos en nuestra política de privacidad.
Aceptar