Tendencias de diseño web para 2017

¡Compártelo! Share on FacebookTweet about this on TwitterShare on Google+Share on LinkedInPin on PinterestShare on StumbleUponEmail this to someone

¡Hola a todos! Desde o10media os deseamos que hayáis entrado en 2017 con buen pie. Nosotros ya estamos a pleno rendimiento, así que hoy os hablamos de lo que esperamos del diseño web para este año.

tendencias diseño web

Tendencias de diseño web que no recomendaríamos

Y vamos a empezar, de forma anómala, sobre lo que creemos que ya no es tendencia para este año. Tendencias en diseño web que ya han quedado obsoletas o que han podido presentar diferentes problemas incompatibles con el mejor funcionamiento de una página: ¡que no sea porque no lo hemos advertido!

Diseño Parallax de página única

El Parallax Web Design ha sido la tendencia del diseño web en los últimos dos años, incluso nosotros lo hemos recomendado para algunos de nuestros proyectos online y nosotros lo utilizamos en nuestra propia página web. No vamos a decir que el Parallax sea desechable, evidentemente.

Es más, muchos lo siguen mostrando hoy en día como tendencia de diseño web para este año y algo a potenciar todavía más. El Parallax Scroll sigue siendo importantísimo, más si tenemos en cuenta lo fácil que es para la navegación desde dispositivos móviles.

Entonces, ¿en qué quedamos? ¿Es tendencia o no? Para eso, siempre tenemos el comodín del público: “depende”.

parallax web design

Depende del objetivo que persiga tu página web y depende de cómo quieras captar tráfico a la misma. Si lo que quieres vender es marca o un producto concreto, entonces el Parallax puede seguir siendo el diseño de página web que necesitas.

Si vendes servicios y productos concretos y diversos, probablemente el Parallax de página única no sea la mejor solución.

Todo esto viene en consonancia con los canales de tráfico y uno muy en concreto: el tráfico orgánico. El Parallax es muy positivo en cuanto a navegabilidad, pero puede ser muy negativo para el SEO si lo utilizas para crear una única página, sin estructurar por secciones.

¿Por qué? Porque si quieres vender diferentes servicios/productos y posicionarlos, necesitas páginas específicas que se centren únicamente en la palabra clave y esto ya no es sólo en el aspecto de la URL, también es de suma importancia el metaetiquetado, contenido, etc.

Prueba a intentar posicionar con sólo una página términos clave totalmente dispares y sin ninguna relación semántica para Google, ya verás cómo es prácticamente imposible.

El problema es que su uso se ha hecho tan popular que se utiliza para cualquier tipo de página y eso tiene grandes inconvenientes. Si tienes en mente iniciar un proyecto web, ten en cuenta qué es lo que quieres y qué necesitas.

Si vendes marca y te das a conocer a través de otros canales como las redes sociales, perfecto. Pero a mitad de partido, si lo que quieres es atraer tráfico a través de Google (tráfico orgánico y Adwords, ya que un buen SEO favorece también la publicidad PPC), tienes que saber que será tremendamente complicado y que, posiblemente, necesites rediseñar tu página web.

Flat Design

Desde hace más de tres años, el Flat Design ha sido una tendencia de diseño web tremendamente extendida y realmente útil.

Más aún, algunas de los aspectos que siguen estando al alza en diseño web están vigentes en el Flat Design, un diseño sencillo de colores pastel atractivos y visuales que beneficiaban la navegabilidad y que se adapta perfectamente a los dispositivos móviles. Sí, son puntos a favor.

flat design web

Ni que decir tiene que el Flat Design sigue y seguirá siendo un importante recurso para diseñadores web. Se pueden seguir haciendo páginas web de este estilo y que funcionen a la perfección. Desde luego, si quieres presentarnos un proyecto web y creemos que su diseño tuviera que ser así, lo seguiríamos recomendando.

A diferencia del Parallax de página única, el Flat Design no tiene problemas de funcionalidad -es más, es extremadamente funcional y minimalista- que pueda “chocar” con otros aspectos del marketing online. Sin embargo, el problema del Flat Design es el que tiene todas las tendencias.

Cuando su uso es tan generalizado, se llega a un punto de hastío en el que se pierde ese punto de originalidad que requieren muchos de los proyectos digitales. Si quieres ese punto diferenciador, definitivamente no te recomendamos el Flat Design y que adoptes un diseño más creativo y personal.

¿Y los Cinemagraphs?

Otra de las mayores tendencias en diseño web para este año es el uso de Cinemagraphs, que ocupan el ancho de la página. Son vídeos o secuencias de fotos de alta calidad que muestran movimientos -si es en formato GIF- realmente atractivos.

Muchas páginas ya lo han implementado y han tenido un impacto muy interesante, eso es innegable, al igual que puede ser una de las grandes tendencias del diseño web, si no lo es ya.

cinemagraphs

Sin embargo, el diseño web no debe de ser únicamente visual, también debe de tener otra serie de características.

En este caso, el problema viene dado por el peso que tiene un GIF o un vídeo, por muy corto que sea. Al ocupar el ancho de la página web y ser de alta calidad, tiene un peso considerable y que fácilmente supera los 3-4MB.

En tiempos en los que la velocidad lo es todo, es un peso excesivo que hará que la página web tenga un tiempo de carga excesivo, fomentando una mayor tasa de rebote -ya ni decir si la visita procede desde un dispositivo móvil- y, por lo tanto, un peor posicionamiento SEO.

Como ya hemos dicho con respecto al diseño en Parallax Scrolling, todo depende de la utilidad que desees para tu página web.

Si quieres un diseño web que además ofrezca todas las ventajas de Internet, quizás no sea la mejor opción y puedes utilizar vídeos en streaming para evitar problemas de carga de la página.

Si no es así y persigues únicamente un diseño web impactante y visual, el Cinemagraph es elemento casi indispensable.

Requisitos del diseño web actual

Viendo aquellas tendencias de diseño web que, aun estando vigentes o que incluso son “lo último”, creemos que no son las convenientes para un proyecto web completo, podemos diseñar una página que incluya diferentes elementos.

Aunque siempre quede a disposición del cliente, desde nuestra agencia siempre defenderemos que el diseño web es el atractivo y funcional, sin dejar de lado ninguno de estos aspectos.

Algunos de los requisitos que debe de cumplir un diseño web en la actualidad tiene que ir en consonancia con otras funcionalidades son los siguientes

Pensar en móvil

No vamos a descubrir nada nuevo bajo el sol. Lo decimos desde tiempo, cuando hablábamos del diseño web responsive, pero la realidad es que la tendencia en el uso de dispositivos móviles frente a escritorio sigue al alza y todavía no se conoce cuál será su techo.

Tal es así, que Google ha comenzado a darle prioridad a las versiones en móvil de los sitios web frente a la versión de PC, en un movimiento más que lógico. Por un lado, porque si los usuarios navegan con más frecuencia desde el móvil, es normal que la usabilidad principal a tener en cuenta sea la versión de la página para dicho dispositivo.

Por otro, Google ya había realizado una serie de advertencias, como la señalización de “mobile-friendly” en los resultados del buscador.

Por eso, a la hora de plasmar el diseño de una página web, hay que pensar primero en la versión en móvil, para luego adaptarlo a la versión de PC, invirtiendo el orden de trabajo que se realizaba antes ya sea en el diseño de una página web a medida, o mediante una plantilla predeterminada como las de WordPress o similares.

requisitos diseño web

Usabilidad UX

La usabilidad ha sido muchas veces la asignatura pendiente para el diseño web, chocando frontalmente con el diseño más visual, al igual que sucede con el SEO, por ejemplo.

La realidad es que una página muy bonita y poco “usable” no sirve para nada y esto no es de ahora precisamente. Ha sido así siempre.

El uso de dispositivos móviles  ha revolucionado el concepto de la usabilidad, donde el scroll infinito ha fomentado el uso del Parallax, aunque ya hemos comentado sus desventajas.

La cuestión es que el usuario, con el móvil en la mano, navega a una mayor velocidad, estableciendo un tiempo en las páginas bastante menor que si lo hiciera desde el ordenador de mesa.

Esto hay que tenerlo como prioridad para establecer un diseño que se centre en el contenido exacto que necesita el usuario –ni más, ni menos- y en diferentes guías que faciliten su navegación. Por eso, la sencillez de una página web sigue siendo tendencia y eso no va a cambiar.

Originalidad

Tal y como hemos visto con el Flat Design, llega el momento en el que se pierde “la chispa” y todo tipo de páginas parecen iguales. Están “cortadas por el mismo patrón”, literalmente.

Es, por eso, que ahora está generando un gran interés el denominado “Material Design”, desarrollado por Google, y que supone una evolución en la que ya se incluyen algunos elementos que son tendencia, como las animaciones o una mayor diversidad en el diseño gráfico, con “objetos materiales”, sombras o luces y formas geométricas, con el objetivo de dotar de mayor realismo a la página web.

Todo ello, preservando la premisa más que correcta que asentó el Flat Design: menos es más.

Aun así, tal y como ocurrió con el Flat Design, estamos hablando de un tipo de diseño web pasajero, por lo que en poco tiempo otra nueva moda le sustituirá y se convertirá en nueva tendencia y será utilizado en muchísimas páginas, teniendo una “vida útil”.

¿Puede ser el momento de romper con un patrón concreto de diseño web? Ojalá fuera así, porque medios para hacer un diseño web original hay más que de sobra.

Elementos para tener el mejor diseño web en 2017

Con todo esto, vamos a ver qué elementos debe de tener una página web para que tenga ese explosivo cóctel de diseño atractivo y usabilidad, sin tener que lastrar el posicionamiento SEO.

Vídeos y fotografías originales

Uno de los elementos que nunca va a perder su utilidad es el de las imágenes y vídeos. Las imágenes tienen que ser grandes y de gran atractivo visual, como ya se hace en la actualidad, pero todavía queda por dar un paso más.

Los usuarios demandan cada vez más credibilidad de la empresa o persona que se encuentra tras la página web, ¡y esto hay que demostrarlo a través de las imágenes!

fotografias ilustraciones

¿Cómo hacerlo? Sencillamente utilizando fotos de gran calidad y que sean originales, ya si son propias y únicas, mejor que mejor.

Decimos esto porque las páginas web están repletas de imágenes obtenidas de galerías -gratuitas o no- que tienen una calidad inmensa, pero con el tiempo se replican en otros sitios web, perdiendo la originalidad.

Además, la credibilidad queda en entredicho cuando estas imágenes no reflejan exactamente la identidad y actividad del negocio, en sus diversas variantes. ¿Cuántas veces has visto imágenes de personas de origen nórdico en páginas de empresa españolas? Seguro que muchas. Y no son empleados de la misma, ¡ni mucho menos!

Evidentemente, esto supone un gasto para el desarrollo de la página web más elevado, pero en algún momento hay que dar ese paso. Es igual que el contenido: cuánto más original, mejor.

Microinteracciones y animaciones

Interactuar con la página web es sinónimo de un diseño actual, pero es que además ayuda a navegar. Si pensamos en la navegabilidad con el móvil y las pantallas táctiles, ya estamos hablando de un “win-win” de manual.

De esta manera, haces que el usuario vaya directamente a lo que necesita y no le haces perder el tiempo. Ni la paciencia, que es mucho menor que cuando navegamos desde el ordenador de casa.

Las animaciones también nos ayudan en este sentido, proporcionando una mayor facilidad para entender la información. Eso sí, no abuses con este tipo de elementos y si decides hacerlo, que no sobrecargue el tiempo de carga de la página.

Mayor realismo

Como se desprende de las carencias del Flat Design y de la evolución del Material Design, el realismo en el diseño es una nueva tendencia, dando un empaque más original y creativo a nuestros proyectos.

Entre estos recursos está el uso de ilustraciones, botones e iconos, ¡hechos a mano! Lo que nos dará un mayor toque de humanidad.

Landings diferenciadas e identificables

Si nos dejáramos llevar únicamente por el SEO, este planteamiento tendría que haber estado siempre presente, pero tendencias como el Parallax han roto ese paradigma.

Lo que está claro es que si quieres una información ordenada y que se centre en lo que necesita el usuario, tendrás que seguir haciendo landings específicas para cada cuestión. Ni más, ni menos.

landings

Además de las tendencias en diseño web, hay que valorar la demanda de los usuarios. ¿Cómo no hacer páginas diferenciadas y centradas en un ámbito en concreto con el “boom” existente en marketing de contenidos”? ¡Sería imposible! Además, las conversiones tienen que seguir siendo el máximo objetivo a conseguir y las landings específicas son las que mejor pueden hacerlo.

¿Adiós al Above de Fold?

Si las landings independientes seguían un planteamiento SEO, aquí rompemos una teoría avalada durante todos los años: las palabras clave y información tienen que estar siempre en la parte visible de una página, sin necesidad de hacer scroll.

Siempre ha sido una cuestión de SEO y su relación con la usabilidad, puesto que tradicionalmente se ha dicho que eleva la tasa de rebote de nuestra página, a no ser que el contenido no se parezca a nada con respecto a la búsqueda realizada, cosa que ya no ocurre tras los múltiples cambios de Google a lo largo de los años.

Siempre se ha intentado evitar el scroll, pero la realidad ahora es que, con el móvil, estamos más que habituados.

Navegamos más rápido, pero ya hemos perdido ese miedo patente a no encontrar un final de la página, por lo que el contenido extenso, fomentando el storytelling.

Colores para este año

Ahora sí, nos vamos a dejar llevar por lo que dicen otros para que cojas y deseches las ideas que creas convenientes para el color de tus páginas web.

El color de 2017 es el Greenery

color greenery

Según Pantone y sus afamados colores del año, en 2017 el color de moda es el Greenery, que definen como “un color refrescante y revitalizante”.

Quizás por cuestiones de identidad visual, no puedas incorporar el Greenery como color principal, ¿os imagináis que ahora todas las páginas fueran de color verde y derivados? ¡Sería una locura!

Eso sí, podéis ver en su paleta de colores diferentes transiciones que combinen con este color.

Duotonos

Un recurso que ya hemos utilizado en diversos diseños web y que cada vez está más extendido es el de hacer un diseño basado en el duotono, un efecto logrado en base a dos colores.

Colores neutros

En base a diseños más realistas, las páginas web ya no utilizarán los tonos pastel o se combinará con tonos más neutros que le impriman un mayor carácter a las imágenes.

La mejor tendencia de diseño web es la que te guste a ti

Si has leído hasta aquí, suponemos que tendrás muchas ideas o puede que no estés de acuerdo con algo de lo que decimos. Es normal, las tendencias están para seguirlas o romperlas, ¡todo depende de ti!

Así que ya sabes, puedes seguir algunos de los aspectos que mencionamos, coger unos y no otros o tirar todos a la basura. Lo importante es que, al terminar el diseño de tu página web, estés cómodo con él, que refleje lo que quieras transmitir y que consiga los objetivos que persigues.

¡Compártelo! Share on FacebookTweet about this on TwitterShare on Google+Share on LinkedInPin on PinterestShare on StumbleUponEmail this to someone
Posted in:

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *