web

8 ideas para diseñar una página web ‘a la moda’

walking

Ya se sabe eso de que ‘el movimiento se demuestra andando’, pero pocas áreas caminan tanto como Internet. De ahí que a diario se produzcan nuevos movimientos que, a veces, enriquecen y, otras veces, entorpecen el uso de esta herramienta. Podríamos pensar que son las primeras las que prevalecen, pero, como en todo, aquí también nos encontramos con modas. Y la moda, cuando hablamos de Internet, está en las páginas web. Ellas son los maniquís de la Red. ¿Y qué nos depara la colección 2014? Pueden gustarnos más o menos, pero las tendencias están claras. Esto es lo que se lleva:

1. Flat, flat, flat. Este vocablo inglés podría traducirse como limpieza, sencillez, apuesta por elementos primarios… La idea es eliminar ornamentos a las tipografías y elementos de una web. Nada de sombras, degradados y efectos que ensucien la pantalla. El ejemplo que se suele poner en estos casos es el del escritorio de Windows 8.

2. Simplicidad y orden. Estos conceptos está relacionado con el diseño ‘flat’, pero no van necesariamente unidos. Una web ‘flat’ puede ser una auténtica leonera. Si bien es cierto que la tendencia real nos indica lo contrario: pocos elementos y bien ubicados, buscando siempre que el usuario encuentre lo que busca a la primera.

3. La palabra exacta. La simplicidad no tiene porque ir reñida con la información. La clave está en saber elegir las palabras que mejor transmitan el mensaje que queremos enviar a nuestros visitantes. Como mucho nos quedamos con un lema en la portada (y cortito, por favor). El menú, cuanto más pequeño (en número de secciones/páginas), más visible. Pero sólo si lleva las palabras adecuadas.

4. Todo y nada. Así que nos encontramos con una página web sencilla, limpia, ordenada, escasa de elementos… Y nosotros tenemos mucha información que contar. No se vayan a pensar que los diseñadores no han pensado en esto y han diseñado dos tipos de recursos que permiten acceder a un montón de información sin salir de la portada. Por un lado, están los mega menús (abajo, el de Mashable), que permiten destacar el contenido de cada pestaña del menú sin siquiera pinchar en ella. Sólo con ponerse encima ya vemos lo que esconde. Y, por otra parte, están los efectos como ‘lightbox’, que imitan a los clásicos ‘pop-up’ para suponer información adicional sin tener que navegar por el interior de la página.

5. Scroll, sí. Si bien, las páginas con fotón y sin scroll siguen en el escaparate, lo que más se lleva en una portada que se mueva para arriba, para abajo, para la derecha, para la izquierda. Movimiento. Y es que si hay un tipo de plantilla que parece ganar adeptos de forma lenta, pero segura, es el modelo ‘one page’. Es decir, que tenemos todo el contenido de la web en la portada, pero sin manchar, que no queremos llevarle la contraria a las tendencias anteriores. Podemos encontrarnos con un fotón que ocupe toda la pantalla y al bajar, una llamada a la acción, una presentación de equipo, un portafolio… Eso sí, todo sencillo y con poca palabrería. Como la del iPhone.

6. Sin perder el norte. Claro que si tenemos una ‘one page’ y empezamos a bajar y bajar y queremos entrar en alguna sección y tenemos que subir y subir para recuperar el menú, ¡agotamos al visitante! Así que mejor le ponemos a nuestra web un menú fijo, arriba o en un lateral, pero que siempre esté al alcance de la mano, estemos en la parte que estemos de la web. Aquí tienes un ejemplo.

7. Un poco de diversión. Quizás haya quien piense que nos ha quedado un pelín soso el escaparate, así que vamos a añadirle un toque de… (¡no, nada de gifs, por favor!) parallax. Es el efecto del año. Permite hacer cosas realmente interesantes para ‘animar’ una página web. Algunas muy animadas (¡qué mejor ejemplo que The Walking Dead!) y otras más comedidas (como la de la aplicación Tinke). Obviamente, su uso depende del contenido y objetivo de la página web, pero, en general, es mejor usar parallax discretamente. Que anime, pero que no maree.

8. Uno para todos y todos para uno. O sea, responsive. Un alto y creciente porcentaje de internautas se conectan a través de sus teléfonos móviles y tabletas, así que hay que brindarles una experiencia igual de buena en cualquier dispositivo. Pero lo que no hay que hacer es hacer diseños independientes, sino un solo diseño que se adapte eficazmente.

About the author

María Sierra

6 Comments

Click here to post a comment

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

Boletín

Recibe los artículos del blog de A-Tres en tu mail.

Ahora en las redes de A-Tres