¿Qué se llevará en diseño web en 2017?
El diseño web está en plena evolución y es un campo en permanente movimiento creativo muy atento a las nuevas tendencias. Si Google presentó como el no va más hace unos años los efectos de profundidad, animaciones y transiciones que mejoraron las interacciones dentro de sus aplicaciones, lo que se conoce como “digievolución”, en 2017 se apuesta por volver a la sencillez.
El mutable diseño web se encaminará esta año hacia ciertas tendencias, las que os exponemos a continuación:
1. Menús más simples casi minimalistas
Los creativos tendían a colocar en los menús todo tipo de opciones llegando a la saturación. Se trataba de lograr que los usuarios vieran todo lo que la webs le ofrecía en tan sólo un pantallazo pero, al final, resulta contraproducente porque lo único que logramos es apabullar al internauta que no sabe por lo que decantarse. Por este motivo, en 2017 se vuelve a la sencillez y un buen ejemplo de esta tendencia es lo que ha hecho la firma sueca Ikea y su minimalista menú principal.
2. No se llevan los desplegables
Los conocidos como “menú hamburguesa” o aquellos que al abrirse se asemejaban a un desplegable pasan a la historia en 2017. Siguiendo la filosofía de lo que hemos explicado en el anterior punto: La saturación de información crea serios problemas de usabilidad. Si queréis un buen ejemplo de una web que ha desterrado los desplegables es Spotify.
3. Los duotonos marcarán el diseño
Se trata de crear páginas vibrantes, coloridas y hermosas usando sólo dos colores. Su nombre viene de los procesos de impresión. Apostar por el minimalismo hace que los diseñadores se decanten por paletas limitadas porque son visualmente interesantes y fáciles de crear añadiendo un elemento único a las imágenes y, además, permite combinar dos colores atrevidos y extravagantes con una imagen divertida sin que resulte hortera. Para lograr el impacto que deseas con el duotono, los expertos aconsejan escoger dos colores que contrasten, una imagen de alta calidad con un área de atención al que le puedes poner tipografía y una mezcla de opciones de colores con un slider. Mira la web de Capital One Labs, es un ejemplo de lo que te estamos explicando.
4. Se lleva el Material Design
Google puso en alza esta filosofía enfocada al diseño aplicado a Android pero también en la web y en cualquier plataforma. Está basado en objetos materiales. Es decir, piezas colocadas en un espacio y con un movimiento determinado donde la profundidad, las superficies, los bordes, las sombras y los colores juegan un papel principal en un intento por aproximarse a la realidad en un mundo donde todo es táctil y virtual.
Se logra con menús, botones y los tipos de imágenes a elegir usando una tipografía clara, casillas bien ordenadas, colores e imágenes llamativos para no perder el foco y un sentido del orden y la jerarquía muy marcado donde el movimiento es otro elemento clave, por ejemplo, un rótulo que parpadea o un elemento expandible para llamar la atención.
5. El “parallax scrolling” ha muerto
Se trata de un efecto que, al entrar en una web, haces scroll y de repente el fondo parece moverse a una velocidad distinta que el contenido dejando ver partes que antes no veías. Se llama Parallax (en español paralaje). Sustituyó al Flash para dotar a las web de dinamismo que fue inventado para las películas de Disney y, después, se aplicó a los videojuegos. La presencia de este tipo de efectos puede ser tan sorprendente para el usuario como cansina, así que no te la juegues. Además, aumenta considerable los tiempos de carga y repercute negativamente en el SEO.
6. Las PWAs al alza
Como sabemos, es posible crear aplicaciones web pensadas para trabajar desde los móviles. Google ha sido el que ha promovido este tipo de aplicaciones. Lo que se llama la Aplicación Web Progresiva. Son aquellas que tienen el mayor rendimiento posible en móviles y que cargan de manera casi instantánea, con una buena interfaz que se parece lo máximo posible a una nativa, que ofrecen la posibilidad de trabajar sin conexión y que permiten enviar notificaciones a los usuarios, como una app nativa. Van más allá de lo que ofrece un Web Worker de la mano de la tecnología HTML5 y de los avances en JavaScript. Un buen ejemplo de PWA es la web móvil es la de Air Berlin.
7. Un universo de posibilidades con las Google Fonts
¿Te acuerdas de que hace años las fuentes tipográficas estaban limitadas a la hora de desarrollar una página web? Sólo podías usar las que por defecto estaban instaladas. Las llamadas “Fuentes Seguras”: Georgia, Times New Roman, Arial, Verdana o Comic Sans… Todo dependía del sistema operativo del ordenador y era un lío y la maquetación engorrosa. Pero para nuestra suerte en 2017 existen un tipo de fuentes estandarizadas y de muy alta calidad para el desarrollo de páginas web llamada @font-face. Ahora es el servidor quien proporciona la tipografía que necesitemos utilizar y el navegador es quien se encarga de mostrarlas adecuadamente (Chrome, Firefox, Internet Explorer, Opera y Safari). Gracias a ellas ya no hay que depender de las fuentes que tenga instaladas el ordenador del usuario. Son tipografías gratuitas y de código abierto. Se llaman Web Open Font Format (WOFF) y se emplean incrustadas en las hojas de estilo (CSS) como @font-face. Google tiene un excelente catálogo gratuito con más de 600 fuentes disponibles para el desarrollo de páginas web llamado Google Fonts, capaz de dotar de cohesión visual a 800 lenguas diferentes ¡Y son Font-tásticas!
¡Aprovecha bien los consejos que te hemos dado para las tendencias de diseño de webs en este 2017!