LOS MEJORES DISEÑOS WEB

En esta ocasión te presento los mejores diseño web para que tengas unas ideas a la hora de elaborar una página web creativa o ya sea rompiendo las reglas. Inspírate, imagina, simplifica y haz que se fácil para los usuarios.

A continuación, vamos con el primero:

Food Sense
Esta página se trata de un diseño de estilo de revista que se adapta muy bien a los distintos tamaños de pantalla. Preste atención a la parte izquierda de la navegación que salta a la parte superior, donde se reduce la anchura.

http://foodsense.is/

Smashing Magazine
Es probablemente uno de los mejores y más avanzados diseños de sitios Web Responsive que he visto. Todos saben de este sitio, supongo, pero si no lo ha visto en varios estados que, hay que ir y verlo. En las ventanas de arriba 1500px (ancho) el diseño tiene toda la navegación y la pone a la izquierda, haciendo un uso óptimo del espacio disponible.

https://www.smashingmagazine.com/

Webdesigner Wall
Es otro muy buen ejemplo de un buen diseño del blog que se puede hacer.

http://webdesignerwall.com/

Fork
Es una plataforma CMS y su sitio realmente muestra cómo el diseño Responsive se puede implementar con elegancia. El texto clave sigue siendo el lema en todos los modelos y me gusta que forma iconos que se utilizan para mostrar y las extensiones. A medida que la ventana está reduciendo el número de iconos se reduce, pero no es una opción ‘más extensiones. Esta idea permite el sitio móvil para trabajar y convertir después los mismos principios de diseño como el diseño por defecto de los navegadores, pero de una manera amistosa en el móvil.

http://www.fork-cms.com/

Bluegg
Es un blog de diseño Responsive, pero más sencillo que los dos anteriores. La forma en que se hace es lo que vemos en la mayoría de los diseños de respuesta hasta el momento. El diseño es el mismo pero ampliado hasta el tamaño de la pantalla que es muy pequeña (tamaño del teléfono inteligente con alrededor de 640 píxeles). A continuación, la disposición se cambia a una columna y la barra lateral etc, que se coloca por debajo de la página principal.

http://bluegg.co.uk/

Sweethatclub

Sweehatclub no se trata sólo de dulces sombreros…, el diseño de la página aquí es muy dulce y tiene cuatro únicas presentaciones.

http://www.sweethatclub.org/

Bootstrap
Es un ejemplo de cómo el diseño de la columna y la navegación se pueden hacer Responsive de una manera fresca. En lugar de mostrar el menú todo el tiempo (tomando el espacio de más desplazamiento) se trata de un menú desplegable. Otra forma típica de hacer la navegación es utilizar un cuadro de selección como se ha visto anteriormente en Smashing Magazine.

http://getbootstrap.com/

Heathlife
Este sitio tiene una imagen completa con slider de fondo y el mapa giratorio en todos los tamaños y se ve muy hermosa.

http://heathlife.co.uk/

Love & Luxe
La tipografía es muy fuerte en esta página en todos los tamaños y en algunos muy bien para moverse en la navegación.

http://loveandluxesf.com/

Oliver Russell
Esta página funciona cuando se carga la página en el tamaño de la pantalla por ejemplo, en un IPhone. También se debe tener en cuenta que el logotipo cambia de texto.

http://www.oliverrussell.com/careers

Clouds over Cuba

Este sitio web es una experiencia inmersiva que documenta la historia de la crisis de los misiles de Cuba durante los años 60. Nos atreveríamos a decir que incursiona en un nuevo discurso narrativo para plataformas digitales: el documental web.

http://cloudsovercuba.com/

W+K AMSTERDAM
El sitio de la agencia holandesa W+K muestra la capacidad de respuesta y la integración de plataformas creativas en el marco de una agencia creativa de carácter global. Desarrollado en HMTL5.

http://www.wkams.com/

Chrome Web Lab
Google busca mostrar las ventajas de generar experiencias web para marcas y empresas, promocionar su navegador. En este caso se muestra en vivo desde el Museo de la Ciencia en Londres. Desarrollado en HTML5.

http://www.chromeweblab.com/

The Expressive web
Este es un sitio promocional de Adobe para mostrar las capacidades de sus herramientas para realizar sitios en HTML5.

http://www.adobe.com/devnet/archive/html5/articles/introducing-expressive-web.html

Two minutes teacher test
Esta página es como un Examen basado en HTML como parte de una campaña para reclutar maestros en Noruega. Se adapta a todos los tamaños de pantalla y funciona muy bien en dispositivos móviles. El enlace es una versión traducida de la prueba.

https://www.behance.net/gallery/5908107/Two-minute-teacher-test

Air Jordan
La campaña 2012 de Nike para su producto Air Jordan sumerge a los consumidores en el mundo de la primera zapatilla de baloncesto totalmente personalizable, a través de una experiencia de inmersión digital, construido alrededor de programación en HTML5 que produce animaciones a través del uso del scroll del ratón.

http://www.nike.com/us/en_us/c/jordan

The License Lab
Esta página es una selección de catálogos de producción musical y de concesión de licencias comerciales exclusivas. Interfaz diseñada en HTML5, CSS3 que simula el frente de un amplificador de sonido, que en el lenguaje de los músicos es digamos, un contexto universal.

http://licenselab.com/track/olde-time-candy/844a

Captain Dash
Esta página es muy Interesante sitio dirigido a mercadólogos; produce tableros en tiempo real para vendedores, así como smart data, infografías espectaculares, a través de una atractiva interfaz, los cuales son parte de la inteligencia de nuevos negocios.

http://www.captaindash.com/en/

Buffalo
Este es un sitio construido para presentar en la trabajo de la agencia de diseño web Buffalo, con sede en Brighton, Reino Unido. Buena navegación y propuesta visual.

http://www.buffalo-technology.com/es/

Berger & Fohr
Es un portafolio online de la agencia que muestra distintos recursos para contar las historias (contenidos) de los clientes. Dinámico y buen ejemplo de diseño minimalista.

http://bergerfohr.com/logos-marks-symbols/