Share
Como dijo el famoso Ferris Bueller: "La vida se mueve bastante rápido; si no te paras y miras a tu alrededor de vez en cuando, podrías perderte". Prestemos atención a sus sabios consejos y tomemos un momento para observar algunas de las tendencias de diseño web que vimos en 2011..
La web es una bestia en constante cambio, llena de defectos, imperfecciones y experimentación. - Dan Cederholm
El diseño web responsivo se está convirtiendo en un poco como una canción brillante pero exagerada. Parece que todos han expresado su opinión, y la agenda de Ethan Marcotte nunca se ha visto más saludable. Hay una buena razón para esto sin embargo; El concepto es simple, los motivos son lógicos, la tecnología es sencilla y los resultados son extremadamente satisfactorios..
En 2011 se produjo una explosión en la cantidad de sitios web creados de forma responsable, y la belleza de esto es que todos estamos involucrados en el desarrollo del proceso. Todavía está en su juventud, los diseñadores y los desarrolladores están inventando nuevos enfoques todo el tiempo, y estamos muy lejos de alcanzar las mejores prácticas reales. ¿Deberíamos primero diseñar para pantallas grandes y usar consultas de medios para degradar con gracia nuestros diseños para dispositivos móviles? ¿O deberíamos diseñar para dispositivos móviles primero, mejorando progresivamente para dispositivos más capaces? Paul Irish inició un interesante hilo en GitHub si desea sumergirse en la discusión.
Una cosa que RWD ha iluminado es el enfoque en el contenido. Aparte de todos los otros factores, el contenido de cualquier sitio web dado es lo importante; la carne y las dos verduras deben ser legibles, accesibles y claras en cualquier dispositivo. Los diseñadores ciertamente están teniendo esto en cuenta como es evidente en muchos de los sitios web emergentes de 2011.
Sin embargo, cuando todo esté dicho y hecho, incluso si estás un poco cansado de ver más tutoriales y artículos de RWD en ciernes, mantente al tanto. 2012 va a ver grandes desarrollos en la forma en que todos lo abordamos.
Compañero en el crimen para el diseño de respuesta es la red. 2011 ha visto que los marcos de la red fija realizan mejoras flexibles, sin mencionar la aparición de aún más herramientas para ayudarnos. Todos los siguientes marcos, herramientas y guías satisfacen las necesidades de hoy y ofrecen fluidez. La mayoría de estos sitios también muestran un gran diseño de respuesta, como muestran las miniaturas 1: 1 a continuación:
Obviamente, la tipografía no es una disciplina que surgió en 2011, pero es un área de diseño web que continúa creciendo y se facilita más que nunca gracias a las fuentes y los servicios web..
Dos aspectos notables de la tipografía son la estética (las fuentes web permiten a los diseñadores complacerse) y la creciente comprensión de que el tipo existe principalmente para leer. Las fuentes no tienen que ser microscópicas para aparecer, y el énfasis en el contenido primero nos empuja hacia una red llena de tipos grandes y hermosos.
2011 ha experimentado grandes avances en cuanto a las capacidades del navegador (¡y los números de versión!) Incluso Microsoft reconoció recientemente que las actualizaciones automáticas para Internet Explorer son probablemente una buena idea. Todo esto significa que los diseñadores web tienen más juguetes para jugar en términos de HTML y CSS, lo que de manera comprensible conduce a la creatividad como resultado de la tecnología. El 'porque puedo' se acerca, si te gusta.
No puedo pensar en un mejor título para este bit, lo siento. Entonces, ¿de qué estoy hablando? Desplazamiento vertical.
Es una tarea diaria para los diseñadores web minimizar la importancia del pliegue. El pliegue es imposible de definir, con la gran cantidad de dispositivos y resoluciones en estos días, por lo que el contenido "estar por encima" no debería ser la prioridad número uno de un cliente en una solución de diseño..
Estamos abrazando el desplazamiento vertical. El auge de los dispositivos móviles ha recordado a la gente que puede desplazarse y allí es Contenido relevante debajo de los primeros píxeles de una página web. Algunos diseñadores han llevado esto al siguiente nivel y han hecho del desplazamiento una parte fundamental de la experiencia de navegación..
Un enfoque es en los efectos de paralaje sutil.
Nota: Las imágenes a continuación, obviamente, no hacen justicia a los sitios web: ve y revísalos (y prepara la rueda del ratón ...)
Luego está la idea de que algún contenido puede desplazarse. hasta cierto punto. 2011 vio un amplio uso de este efecto; mantener a la vista los íconos sociales, los carritos de compras, las barras de menú, las llamadas a la acción, etc.
Entonces, ¿cómo se logra esto? A menudo, una combinación de jQuery y posicionamiento CSS. Aquí hay solo dos recursos para ayudarte:
Algunos sitios han llevado el concepto aún más lejos, animando elementos y convocando eventos cuando se alcanzan ciertos puntos verticales en la página:
Y luego hay ejemplos que llevan el desplazamiento hacia abajo de una página web a una dimensión totalmente nueva (realmente, échale un vistazo) ...
La diagonal es incómoda, no se adapta a los entornos actuales basados en cuadrículas, pero por alguna razón las líneas oblicuas han estado apareciendo por todas partes durante 2011. Es como un retroceso a un momento incluso antes de la corriente principal de Internet, y Encontraré otros recordatorios visuales de esa época también; Extrañas combinaciones de colores, efectos de iluminación, beige y bronce. extraño.
No puedo evitar que me recuerden los viejos anuncios de revistas con sus líneas diagonales abstractas, sus serifas, sus grandes cabellos, Joan Collins y sus perlas. Es una mirada que es extrañamente atractiva ...
Acercarse a los diseños de forma modular es, de nuevo, algo que favorece el diseño web responsivo. La gestión de áreas de un diseño en trozos modulares permite un reposicionamiento fluido y segrega el contenido claramente. Se podría argumentar que el aumento de las interfaces modulares se debe a la influencia de las aplicaciones. Cada vez más nos encontramos publicando (y accediendo) al contenido web a través de aplicaciones externas como Facebook y Twitter; Las líneas se difuminan entre las pantallas de escritorio y los dispositivos de mano..
Le pregunté al maestro Ivor, de la revista Themeforest, qué había visto pasar en el mercado número uno de Envato durante el año pasado. Observó un par de aspectos de tendencia:
2011 fue el año de Diseño minimalista en ThemeForest - Ivor Padilla
No tienes que mirar profundamente en los archivos de Themeforest para ver lo que significa ...
No hay manera de cubrir todos los desarrollos significativos en el diseño web de 2011, ¡así que participe con sus comentarios! ¿Qué tendencias te impactaron en 2011? ¿Dónde estamos parados en este momento y hacia dónde crees que van las cosas??
Accentsconagua