Comienza un nuevo año y no es novedad que el diseño web junto a la tecnología evolucionan muy rápido. Si quieres estar al día en lo que se lleva voy a ayudarte con esta recopilación de tendencias en diseño web para el 2017. Si piensas rehacer tu web o hacer una nueva, este artículo te viene como anillo al dedo. Estoy segura de que tomarás nota y sacarás provecho.
Una selección de las tendencias en diseño web 2017 que te ayudarán a plantear tu nueva web.
El movimiento.
Es el que se genera por la animación de los elementos que se mueven al navegar por la web. Se consigue aplicando lo que se llama efecto paralax. Si no habías oído, consiste en hacer que una foto, un texto o un elemento se muevan por la web o que avance mientras tu navegas en la web. Si se combina con sliders verticales el efecto es genial, da un aspecto de web actual y moderna. Como en este ejemplo de Le-mugs.
Los sliders son imágenes independientes, que van rotando desde la izquierda hacia la derecha, o se mueven hacia abajo y te muestran distintos mensajes.
Las webs que lo utilizan son más dinámicas. Atrapan la atención del usuario y entretienen mientras comunican un mensaje. Eso sí, para conseguir un buen resultado, debes utilizar fotografías grandes e impactantes como el ejemplo de Le-mugs.
Lo visual atrapa y engancha y los de Le mugs han sabido sacarle partido a una web que exhibe sus productos, contando una historia para retener la vista a lo largo del pase de los sliders o las imágenes. El movimiento generado junto al scroll down (esta palabra tan difícil se refiere a cuando bajas en una web con el ratón o mousse) hace que el usuario quiera seguir navegando y visitar toda la web.
No dejes de visitar esta web hasta el final Le Mugs . Ésta es una de las tendencias web 2017.
Tipografías grandes, efectos, fusiones.
Sin duda, una forma de potenciar un mensaje es a través de la tipografía y los mensajes cortos. A mí me encanta. Este ejemplo combina varias técnicas, para conseguir impactar con el diseño. Tipografías grandes, fuertes, siluetas monocromáticas con un vídeo en el interior. Este efecto final es impactante, lo hace muy original y único. Combinado a la tipografía gigante comunican el mensaje a simple vista. El resultado es un diseño limpio y claro. Entra a ver este espectacular ejemplo KS Capital.
Aquí otro ejemplo muy exagerado en el uso de la tipografía y que encaja perfectamente con la personalidad de su marca, es esta web. Son especialistas en formar emprendedores online. Sus mensajes son potentes y con fuerza, utilizan tipografías tan grandes que para leerlos completos tienes que hacer scroll down. Como explico más abajo, la fotografía juega un papel fundamental, si tienes fotos gigantes consigues un efecto más impactante. Hacen honor a una profesional con estilo único y con mucha personalidad.
No te pierdas todos los detalles de esta tendencia y visita The middle finger project.
Vídeos.
Otra tendencia en diseño web que he observado, desde hace un par de años, y que todavía perdura, es insertar un vídeo o varios como imagen principal de la web. Es un recurso que me chifla y que bien realizado conecta con el usuario. En este ejemplo de la página de «quienes somos», presentan a las personas involucradas en la empresa, trabajando en una escena diaria en su entorno de trabajo. El vídeo genera cercanía y confianza y es una buena forma de darte a conocer con tu cliente ideal.
En el vídeo, que además participan varios de los trabajadores, transmiten un ambiente divertido y distendido, muy natural en un entorno de una start up. Me encanta el resultado, creo que es un vídeo perfecto para el tipo de empresa que son. Mira este ejemplo Red Collar.
No podía dejar de incluir la web de Marie Forleo. La web es impactante, incluye un vídeo en la cabecera, donde ella luce espectacular, como si de una estrella se tratara. Y ese es el objetivo. Es una gurú del marketing digital en USA y es la imagen que transmite. El diseño de su web añade imágenes gigantes, fotos preciosas, tipografías grandes, tarjetas que se superponen con efecto paralax y el resultado es simplemente una web perfecta.
Si aún no la conoces, no te la pierdas, ésta es una de las últimas tendencias en diseño web que se llevan. Marie Forleo.
Minimalismo.
Es otra tendencia web 2017 que crece y te permite conseguir un diseño pulcro y claro. Menos es más y con pocos elementos puedes conseguir una web como para enamorar a tu audiencia. En este ejemplo puedes ver que han conseguido un diseño impecable, monocromático, jugando con la tipografía y sus tamaños. También han utilizado un margen blanco a lo largo de toda la web (otra tendencia que crece). Si te fijas, la imagen no llega hasta el extremo de la pantalla (cuando sí lo es se le llama imagen a full width). Las fotografías son tipo Instagram, otro estilo que está en toda moda. Me encanta este diseño moderno y juvenil. La interfaz te permite navegar con facilidad.
No te la pierdas, disfruta el diseño. Oktober Ink
One single page.
Se caracteriza por tener toda la información en una sola página, en distintas secciones. Cuando pinchas en el menú te baja hasta la sección que quieres ver. También puedes llegar haciendo scroll con el ratón. Este tipo de webs están muy de moda, y algunos clientes me las han empezado a pedir. Son ideales para webs que no tienen demasiado contenido, con poca información, que no requieren de muchas secciones. De cara al usuario le va a ir todo mucho mas rápido y pueden visualizar toda la web en poco tiempo. Este tipo de webs no sirven para todo tipo de páginas, se recomiendan para webs con poco contenido, como un evento temporal, una tarjeta de visita online, un CV online o para una web inactiva sin blog. La desventaja que veo es que por el poco contenido que tienen, no ayudan a posicionar en los resultados de búsqueda, no favorecen al SEO. Sin embargo, si incluyes un blog, puedes generar contenido y posicionar con otras palabras.
Aquí tienes un ejemplo muy bonito de un ecommerce de una goma de mascar (también llamado chicle en Perú 😉 ). ¿Habías visto un ecommerce de goma de mascara alguna vez? ¡Yo no! Simply Gum Natural Chewing.
Bloques en el diseño.
Una nueva tendencia en diseño web que empiezo a ver más seguido, es el uso de los bloques de color o recuadros en línea junto a las fotografías. Otro ejemplo de menos es más y en el diseño lo más simple se logra con el minimalismo para conseguir una web moderna y elegante. Webs como estas hacen un uso exagerado del espacio. Tengo un ejemplo de un diseñador que gracias a las buenas técnicas de diseño juega con un titular de tipografía grande y una paleta de colores monocromática. El titular no pasa desapercibido, es lo primero que lees. El mensaje se entiende rápidamente. Aquí la puedes ver. Aurelien Vigne
El siguiente ejemplo me gusta mucho. Aparte de femenina, la web juega con rectángulos y líneas mezcladas con los párrafos de texto y las fotografías. Nuevamente vemos fotos estilo Instagram, con colores monocromáticos combinados con el negro. Es un diseño limpio y trabajado en Squarespace.
Los espacios alrededor de los títulos juegan un papel importante para llevar al usuario al mensaje. Apetece conocerla Devan Danielle
Fotografías espectaculares.
Ya es una tendencia web que lleva años pero sigue muy actual y le vaticino más éxito. Se llevan fotografías grandes, gigantes y que impactan. No hay duda que un buen diseño en una web necesita de una buena imagen.
Al igual que una web requiere de un buen copywriting para que consiga seducir y retener, una web con fotografías espectaculares ayuda a conseguir un diseño que atrae. Un buen fotógrafo profesional es un excelente aliado para una web. A la hora de invertir en el diseño web no hay que escatimar en trabajar con un fotógrafo profesional. Necesitas fotos que hagan brillar tu negocio. Aquí puedes cotillear esta web RoxburyBooth
Conclusiones:
Como ves después de conocer estos ejemplos y tendencias en diseño web 2017, hay varios recursos que se pueden utilizar en una sola web. Si me preguntas cuáles son las tres tendencias en diseño web que sobresalen más, desde mi punto de vista, son:
- Tipografías gigantes, ayudando al diseño y a potenciar el mensaje.
- Fotos espectaculares y profesionales, con ese estilo inconfundible de Instagram, pero sin perder tu propia personalidad.
- Efecto Paralax para conseguir movimiento y dinamismo
Todo esto se puede conseguir sin encarecer el presupuesto de tu proyecto. Si te dejas aconsejar por un profesional, vas a obtener un resultado moderno, impactante, que atrae y conecta con tu público ideal. Vas a conseguir una web acorde al nivel de tu negocio y con personalidad.
Si estás pensando en transformar tu página web por completo, si no has definido un Branding para tu negocio, sientes que tu web no tiene una personalidad definida, yo puedo ayudarte a conseguirlo. Consulta mi servicio de transformación web.
Me gusta conocer tu opinión, cuéntanos qué tendencias web son las que más te han gustado y si hay alguna que nos hayamos olvidado de mencionar.
10 comentarios en «Tendencias de diseño web 2017, magia y sensaciones»
Hola Susana,
Gracias por este magnífico artículo. Sin duda te haremos caso e incorporaremos alguna de estas tendencias en los nuevos proyectos de diseño web de la Agencia. A nivel de tipografía no se si nos puedes compartir un listado de algunas que puedas ver como tendencias de 2017 para web.
Hola Cinpy,
Me alegro mucho que os haya servido. Como dije en la entrada, hay muchas más tendencias en auge, yo he querido reunir las que me gustan más según mi gusto personal.
Estoy deseando escribir otro post sobre tipografía y las tendencias, gracias por recordármelo. Es tarea pendiente.
A priori te diría que hay mucha variedad aún. Destacan las tipografías como Lato, Montserrat, Playfair display, open sans, las script o manuscritas, las retro, y podría seguir. Un abrazo.
La verdad es que hemos avanzado mucho. De lo que se hacía hace años a hoy en día!
Creo que lo de los slider sí que lleva tiempo de moda, pero quizá el paralax hay que darle algo más de uso!!!!
Hola Emilio, tantas oportunidades para sacarle partido a una web. Las opciones son ilimitadas. Lo más común es ver webs planas y estáticas. El paralax es un efecto muy chulo y sencillo de implementar. Gracias por comentar. Un saludo.
me encanto la informacion gracias por compartir , creo que el movimiento ha venido para quedarse . saludos
Gracias Pedro, me alegro que te sea útil.
Muy buen artículo! Me ha encendido la creatividad. Gracias!
Genial Inés, la creatividad es divertida y atrapa. Un saludo.
Hola Susana. Super claro el contenido! Alguna novedad para el 2021? Me gustaria leer algo actual. Saludos
Hola MihaiDobre,
No hemos hecho un artículo sobre las últimas tendencias. Siempre lo tengo en mi lista de pendientes.
Veo que en el 2021 se lleva utilizar elementos flotantes y apilados. Tienen movimiento y hace las páginas más dinámicas y atraen.
Se usan mucho las formas, acompañando a los textos y fotos, como también como parte del diseño.
Y por último, en cuanto a colores, hay una amplia gama de tendencias, por un lado están los tonos neutros y claros con negro, y por otro lado están los colores vivos y más intensos.
Como ves, no existe una tendencia predominante, hay muchas alternativas.
Espero que te sirva. Un saludo