Sin embargo, cuando se trata de las tendencias, es muy dif\u00edcil arreglar un mont\u00f3n de informaci\u00f3n disponible en la Web. El autor de este post ha le\u00eddo casi 70 art\u00edculos, y la preparaci\u00f3n de esta entrada le tom\u00f3 cerca de 3 d\u00edas!<\/p>\n
Por lo tanto, en este post te ofrecemos una lista completa de las tendencias de 2016<\/strong> para que puedas olvidar de la investigaci\u00f3n tediosa. Algunas de las tendencias de esta lista alcanzaron o casi alcanzaron la cima de su popularidad, por lo que estamos esperando su desarrollo futuro y mejora en el a\u00f1o 2016. En otras palabras, por favor, no te sorprendas cuando encuentres los viejos amigos de 2015 en esta lista.<\/p>\n Bloques clave de la lista de tendencias en dise\u00f1o web para 2016 (haz clic para saltar): * * *<\/p>\n <\/a><\/a>Dise\u00f1o<\/p>\n Este tipo de dise\u00f1o fue una de las tendencias dominantes en 2015. En pocas palabras, se trata de la\u00a0divisi\u00f3n del sitio en dos partes: 2 im\u00e1genes diferentes con 2 objetivos y CTA diferentes.<\/p>\n El a\u00f1o pasado la mayor\u00eda de los sitios y aplicaciones utilizaron los colores \"seguros\" (neutrales) como varios matices de azul y colores apagados. Adem\u00e1s, ellos conten\u00edan pocos elementos en rojo (para resaltar alertas y notificaciones). En 2016 aparecer\u00e1n nuevas variaciones de colores,\u00a0 mucho m\u00e1s saturadas y vibrantes. Tal vez incluso ne\u00f3n o fluorescentes.<\/p>\n La tipograf\u00eda es el arte de usar tipos de letras. Como los dise\u00f1adores est\u00e1n mejorando todos los aspectos del dise\u00f1o, la tipograf\u00eda no es una excepci\u00f3n. El dise\u00f1o plano y el minimalismo aprovechan el poder de las tipograf\u00edas grandes y dram\u00e1ticas\u00a0 para hacer declaraciones fuertes. El a\u00f1o pr\u00f3ximo traer\u00e1 m\u00e1s ejemplos creativos del uso de fuentes.<\/p>\n La rejilla de bloques funciona especialmente bien en sitios de comercio electr\u00f3nico. Es muy eficaz en la presentaci\u00f3n de productos. Con su ayuda una p\u00e1gina tiene un aspecto ordenado. Adem\u00e1s, te permite jugar con el tama\u00f1o de los bloques para enfatizar su importancia (el m\u00e1s grande - el m\u00e1s importante).<\/p>\n Adem\u00e1s, el a\u00f1o 2016 traer\u00e1 m\u00e1s dise\u00f1os creativos y lejos de los principios r\u00edgidos del sistema de rejilla. Ciertamente, la narraci\u00f3n y la interactividad alta fomentan este tipo de rebeli\u00f3n contra las rejillas cl\u00e1sicas.<\/p>\n Se dice que los grids reemplazar\u00e1n Bootstrap, Foundation, y UI Kit...<\/p>\n Ahora Flexbox es compatible con todos los navegadores web modernos, lo que implica CSS limpio, sitios web m\u00e1s r\u00e1pidos y menos hacks de dise\u00f1o. Flexbox se adapta naturalmente a los cambios de la ventana del navegador web, por lo que el rendimiento de los sistemas populares de rejilla adaptativa se vuelve innecesario.<\/p>\n Originalmente inventadas por Pinterest, hoy en d\u00eda se utilizan tarjetas (muy similares a rejillas) en varias p\u00e1ginas web por lo que dividen toda la informaci\u00f3n en partes peque\u00f1as y f\u00e1ciles de escanear. Cada tarjeta representa un concepto unificado. Como ellas funcionan como \"contenedores de contenido\", su forma rectangular permite f\u00e1cilmente organizar ellas y ahorrar espacio.<\/p>\n Una p\u00e1gina web sin men\u00fas y pesta\u00f1as (m\u00e1s bien, ellos est\u00e1n ocultos) tiene un aspecto inusual y muy limpio. As\u00ed, los usuarios se centran s\u00f3lo en las cosas m\u00e1s importantes.<\/p>\n Material Design es un lenguaje de dise\u00f1o desarrollado por Google. Fue anunciado el 25 de junio de 2014 en la conferencia de Google I\/O. Muchas aplicaciones utilizan este nuevo lenguaje de dise\u00f1o y creemos que en el a\u00f1o 2016 su cantidad aumentar\u00e1 a\u00fan m\u00e1s.<\/p>\n No importa cu\u00e1ntos a\u00f1os han pasado, los sitios planos todav\u00eda son muy populares. El dise\u00f1o plano est\u00e1 evolucionando continuamente. Gracias a los principios del dise\u00f1o plano, los usuarios nunca perder\u00e1n ni una parte importante del contenido.<\/p>\n Esta t\u00e9cnica ha sido utilizada por muchos a\u00f1os, pero lleg\u00f3 a su pico de popularidad s\u00f3lo en los \u00faltimos a\u00f1os. Se hizo popular r\u00e1pidamente porque es f\u00e1cil de comprender y se carga con mayor rapidez. La tendencia del dise\u00f1o plano se ve en todas partes, empezando por los blogs de peque\u00f1as empresas y terminando por las p\u00e1ginas web de las marcas m\u00e1s famosas del mundo.<\/p>\n Hay una idea\/concepto de que un dise\u00f1o es completo s\u00f3lo si todos los elementos innecesarios est\u00e1n eliminados. En 2016 esta idea se desarrollar\u00e1 como los dise\u00f1adores buscar\u00e1n nuevas maneras de simplificar sus dise\u00f1os por medio de la eliminaci\u00f3n de los elementos no esenciales.<\/p>\n Como en nuestros d\u00edas menos es m\u00e1s, un sitio de una sola p\u00e1gina o un dise\u00f1o simplificado de varias p\u00e1ginas\u00a0 atraer\u00e1 a m\u00e1s usuarios. Nadie quiere navegar por m\u00faltiples p\u00e1ginas. Con el\u00a0 n\u00famero creciente de personas que acceden a Internet por sus tel\u00e9fonos m\u00f3viles, el dise\u00f1o de una sola p\u00e1gina se vuelva a\u00fan m\u00e1s conveniente.<\/p>\n En los \u00faltimos a\u00f1os la mayor\u00eda de los sitios web han utilizado \"banding\" o anchura: un elemento de dise\u00f1o para que las cosas como im\u00e1genes y secciones se ocupen visualmente todo el ancho de la ventana del navegador. Antes de que esta tendencia se hizo popular, la mayor\u00eda de los sitios web ten\u00edan el ancho fijado y eran centrados.<\/p>\n Los a\u00f1os 80 con las computadoras enormes y los tel\u00e9fonos celulares de bulto son una nueva fuente de inspiraci\u00f3n para los dise\u00f1adores web contempor\u00e1neos. Iconos pixelados, fondos gal\u00e1cticos, estrellas y planetas m\u00f3viles e interactivas ser\u00e1n muy populares el a\u00f1o 2016.<\/p>\n Una p\u00e1gina de inicio personalizada es una invenci\u00f3n interesante. B\u00e1sicamente, se utiliza para presentar la idea principal del sitio - su objetivo clave - en una p\u00e1gina altamente optimizada. Ella tiene que llamar la atenci\u00f3n de los visitantes e invitar a realizar una acci\u00f3n espec\u00edfica.<\/p>\n En otras palabras, p\u00e1ginas de inicio personalizadas son un tipo de p\u00e1ginas de aterrizaje. Hasta cierto punto se diferencian de otros dise\u00f1os de sitios web y son a menudo m\u00e1s visuales.<\/p>\n Esta tendencia no pierde su popularidad. Y no va a desaparecer del dise\u00f1o este a\u00f1o...\u00a0 Hay muchas formas geom\u00e9tricas que los dise\u00f1adores pueden utilizar. Ellas no s\u00f3lo facilitan la navegaci\u00f3n por el sitio, sino llaman la atenci\u00f3n de los usuarios.<\/p>\n La moda de usar botones llamativos se ha ido. El uso de los botones transparentes\/vacios es otra tendencia que florecer\u00e1 en 2016. Los botones transparentes se caracterizan por tener s\u00f3lo el contorno del bot\u00f3n junto con uno o dos palabras en el centro. Por lo general, son menos hostigosos y ayudan a resaltar el contenido m\u00e1s importante.<\/p>\n El mayor problema de los dise\u00f1adores contempor\u00e1neos consiste en que es muy dif\u00edcil ser original. Suponemos que la originalidad obtendr\u00e1 la forma del aumento de la cantidad de los elementos personalizados combinados con las animaciones bien elaboradas. Sin embargo, no hay ninguna soluci\u00f3n universal, as\u00ed que, para ser original uno debe desplegar esfuerzos.<\/p>\n <\/a>Im\u00e1genes<\/p>\n Se trata de una gran tendencia:\u00a0una imagen grande que salta a la vista cuando se abre una p\u00e1gina web. Es fascinante y llama la atenci\u00f3n al contenido. No hay\u00a0distracciones, todo est\u00e1\u00a0limpio y ordenado. Una ventaja\u00a0importante del dise\u00f1o de pantalla completa es que ayuda a\u00a0los usuarios a encontrar y entender la informaci\u00f3n que est\u00e1n buscando. Como una imagen de fondo se puede utilizar un video o una imagen de producto o servicio que se ofrece.<\/p>\n \u00bfQuer\u00edas destacar de tu competencia? Entonces, simplemente no sigas\u00a0esta tendencia.<\/p>\n Es una tendencia ascendente. Un\u00a0v\u00eddeo de fondo que se reproduce autom\u00e1ticamente\u00a0sin duda atraer\u00e1\u00a0la atenci\u00f3n del visitante. Por otro lado, este v\u00eddeo tambi\u00e9n aumente el valor de la p\u00e1gina web. Pero no distrae a nadie de los contenidos; todo lo contrario, llama la atenci\u00f3n al bot\u00f3n de\u00a0llamada\u00a0a la acci\u00f3n.<\/p>\n En dos\u00a0palabras, se trata de\u00a0una l\u00ednea borrosa entre lo real\u00a0y lo que est\u00e1 creado o imaginado en proyectos de dise\u00f1o web. Y los resultados de esta 'mezcla' son muy\u00a0impresionantes.\u00a0Esta tendencia tambi\u00e9n implica la\u00a0creaci\u00f3n de im\u00e1genes que parecen reales, pero no son tales.<\/p>\n Los dise\u00f1adores comenzar\u00e1n a prestar a\u00fan m\u00e1s atenci\u00f3n a las fotos vivas\u00a0que\u00a0muestran\u00a0varias emociones de la gente.\u00a0Es verdad que hoy en d\u00eda algunos\u00a0sitios web usan sus propias fotograf\u00edas en sus p\u00e1ginas de inicio o entradas de blog en lugar de utilizar fotos stock. Otros sitios abandonan las fotos de stock y optan por\u00a0v\u00eddeos, infograf\u00edas, o incluso GIFes\u00a0que\u00a0ayudan a transmitir su mensaje.<\/p>\n Conjuntos de iconos son tambi\u00e9n sustituidos\u00a0por\u00a0algo m\u00e1s personalizado. Hay un mont\u00f3n de\u00a0recursos en Internet, as\u00ed que, es muy f\u00e1cil recoger unos e implementarlos en su p\u00e1gina web, pero incluso un\u00a0peque\u00f1o toque personal en forma de iconos personalizados puede ayudarte a\u00a0resplandecer.<\/p>\n Los monitores con alta\u00a0densidad de p\u00edxeles han revelado que los formatos regulares de im\u00e1genes\u00a0no siempre funcionan como se esperaba en la web moderna. As\u00ed, las im\u00e1genes\u00a0.jpg y .png a veces tienen un aspecto pixelado en las pantallas retina. Hoy en d\u00eda, la compatibilidad\u00a0de los navegadores con\u00a0Scalable Vector Graphics (SVG) y las fuentes de iconos f\u00e1ciles de implementar\u00a0son\u00a0soluciones\u00a0fant\u00e1sticas de\u00a0este problema.<\/p>\n El formato SVG ha estado en uso durante muchos a\u00f1os. Y todav\u00eda est\u00e1 de\u00a0extrema importancia. Gracias a\u00a0SVG, las im\u00e1genes no pierden\u00a0su nitidez, sea cual fuere\u00a0el dispositivo que se utiliza. \u00a0<\/span><\/p>\n <\/a>Animaci\u00f3n Para un sitio web es siempre crucial contar una historia por medio de su\u00a0contenido. El dise\u00f1o web de\u00a02016 probablemente se centrar\u00e1 en la narraci\u00f3n animada que es realmente impresionante. A los usuarios les gustan\u00a0historias. Y las p\u00e1ginas web que\u00a0cuentan historias llaman\u00a0inmediatamente la atenci\u00f3n. Es genial cuando se desplaza por\u00a0la p\u00e1gina y el sitio web cuenta la historia de la compa\u00f1\u00eda.<\/p>\n Cualquier cosa puede convertirse en\u00a0un fondo din\u00e1mico, empezando por\u00a0una imagen poderosa y terminando por un fondo en\u00a03D o incluso un v\u00eddeo. Agregar un video de\u00a0fondo es una manera perfecta\u00a0de llamar la atenci\u00f3n de las personas como\u00a0el ojo humano es atra\u00eddo por el movimiento.<\/p>\n Muchos profesionales creen que el slider es la\u00a0primera cosa que debe ser eliminada\u00a0del sitio web que contiene otros\u00a0elementos que\u00a0se mueven, se desvanecen y se desplazan. Este a\u00f1o aparecer\u00e1n m\u00e1s\u00a0dise\u00f1os est\u00e1ticos con menos partes m\u00f3viles. Sin embargo, las galer\u00edas y presentaciones seguir\u00e1n siendo formas efectivas de mostrar\u00a0m\u00faltiples im\u00e1genes en\u00a0sitios de fotograf\u00eda, presentaciones de productos y portafolios.<\/p>\n Por otro lado, los sitios web con diapositivas pueden llegar a ser una alternativa a los sitios web con sliders. Se trata de\u00a0una especie de evoluci\u00f3n de sliders. Los sliders muestran im\u00e1genes u otros contenidos dentro de alg\u00fan marco. A su vez, las diapositivas de\u00a0pantalla completa permiten a los usurios\u00a0actualizar\u00a0el fondo entero con uno solo\u00a0clic. Este a\u00f1o esperamos\u00a0ver un mont\u00f3n de sitios que utilizan este concepto.<\/p>\n Cinemagraphs (cinemagraf\u00edas) disfrutan\u00a0de una amplia difusi\u00f3n. Ellas\u00a0son im\u00e1genes regulares\u00a0con una parte seleccionada animada, por lo general es un detalle sutil que llama la atenci\u00f3n de los espectadores. No son nuevas, pero el \u00e9xito de las \"fotos vivas\", que son parecidas\u00a0a las\u00a0cinemagraf\u00edas, en los \u00faltimos iPhones juega un papel clave en la retenci\u00f3n de su popularidad en\u00a02016.<\/p>\n En pocas palabras, una p\u00e1gina web a menudo tiene\u00a03 o 4 \u00e1reas: cada con su propia intenci\u00f3n, como un\u00a0registro, una compra, una encuesta, etc. Inicialmente presentan\u00a0poco\u00a0contenido, pero cuando\u00a0se elige\u00a0alg\u00fan\u00a0'flujo de trabajo', una mini aplicaci\u00f3n se activar\u00e1 para\u00a0completar la tarea\u00a0prevista. As\u00ed, al hacer clic en un elemento de registro,\u00a0esa zona se convertir\u00e1 en un asistente de registro, ya sea directamente en esa \u00e1rea, cambiando opcionalmente su ubicaci\u00f3n y tama\u00f1o, o en una ventana modal.<\/p>\n Esta t\u00e9cnica puede\u00a0ser particularmente \u00fatil en las aplicaciones web, en las cuales, en lugar de transferirse a una nueva pantalla para introducir algunos datos o completar una tarea, un \u00e1rea\u00a0simplemente se transforma\u00a0para que la tarea sea completada all\u00ed mismo.<\/p>\n Scrolling<\/a><\/p>\n Scroll largo es realmente muy atractivo. Esta herramienta\u00a0permite contar una historia al visitante, quien no tendr\u00e1\u00a0que hacer clic en ninguna\u00a0cosa. Apple es uno de los sitios que aprovechan\u00a0esta t\u00e9cnica. La mayor parte de los nuevos sitios web son m\u00e1s\u00a0largos que las p\u00e1ginas web anteriores. Dado que los dispositivos m\u00f3viles se vuelven m\u00e1s populares, cada vez m\u00e1s sitios optan por scrolling\u00a0en lugar de vinculaci\u00f3n, especialmente en sus p\u00e1ginas de inicio.<\/p>\n Los efectos Parallax son realmente geniales. En breves t\u00e9rminos, ellos\u00a0crean una ilusi\u00f3n de movimiento y profundidad de 3D, alterando las velocidades de scroll\u00a0del fondo y del\u00a0primer plano.<\/p>\n Cuando est\u00e1 bien hecho, parallax scrolling complace a los ojos.\u00a0La tecnic\u00e1\u00a0m\u00e1s com\u00fan\u00a0es usar una im\u00e1gen\u00a0del fondo, dos im\u00e1genes (una \"m\u00e1s cerca\" que la otra), o incluso un v\u00eddeo, y colocar\u00a0un bloque de texto en el primer plano.<\/p>\n Aunque hay varias opiniones sobre scrolljacking, muchos dise\u00f1adores\u00a0web prueban esta opci\u00f3n. Sin embargo, a la hora de implementar\u00a0scrolljacking debes tener en cuenta una cosa importante:\u00a0no combines\u00a0este truco con otros plugins, como, por ejemplo, scroll infinito horizontal.<\/p>\n Otro\u00a0secreto es a\u00f1adir anclajes con t\u00edtulos adecuados para que los lectores puedan leer ellos. En t\u00e9rminos de\u00a0accesibilidad, la aplicaci\u00f3n de scrolljacking podr\u00eda ser an\u00e1loga a las pesta\u00f1as, especialmente en la definici\u00f3n de los anclajes y sus papeles\u00a0en ARIA.<\/p>\n Scrolljacking es una t\u00e9cnica dif\u00edcil de implementar\u00a0y por lo tanto es m\u00e1s f\u00e1cil describir que aplicar ella. Sospechamos\u00a0que en cuanto Apple renuncie a\u00a0ella, sus aficionados seguir\u00e1n\u00a0su ejemplo.<\/p>\n Se dice que la\u00a0tendencia del uso de scroll vertical en lugar de\u00a0clicking seguir\u00e1 desarrollando en 2016. Sin embargo, a\u00a0veces, el scroll infinito\u00a0puede resultar\u00a0una experiencia horrible. \u00bfNo te parece que tener que 'scroll' 50 veces para ver el contenido del sitio puede\u00a0enfurecer a cualquiera?<\/p>\n <\/a>Usabilidad<\/p>\n El dise\u00f1o web es un negocio rentable, por lo que necesita comenzar a hablar el lenguaje de los negocios. Es decir,\u00a0el lenguaje de m\u00e9tricas, click-through-rates, conversiones, canales y anal\u00edtica. Si eres un\u00a0profesional independiente, es probable que ya tengas acceso a estas herramientas. Si no eres, las compa\u00f1\u00edas como Apropose pueden ayudarte. Ella\u00a0es\u00a0uno de los l\u00edderes en el mercado.<\/p>\n Es\u00a0evidente que el dise\u00f1o se centra\u00a0cada vez menos en\u00a0la est\u00e9tica y cada vez m\u00e1s en\u00a0la experiencia del usuario. Un sitio,\u00a0que se\u00a0carga r\u00e1pidamente y\u00a0lleva a\u00a0usuario al lugar deseado, siempre tiene \u00e9xito.\u00a0Hoy en d\u00eda, la velocidad\u00a0de respuesta de\u00a0la interfaz de usuario es tan importante como su dise\u00f1o.<\/p>\n Los d\u00edas de los botones de acci\u00f3n y elementos secundarios de la interfaz \u00a0est\u00e1n contados... Se puede notar esto\u00a0en la mayor\u00eda de las aplicaciones web modernas. Los ejemplos m\u00e1s ilustrativos son:\u00a0cualquier cosa en Google Suite, as\u00ed como otras aplicaciones como Airbnb.<\/p>\n Dise\u00f1o responsive\u00a0se\u00a0parece\u00a0cada vez menos a\u00a0una tendencia y cada vez m\u00e1s a\u00a0una pr\u00e1ctica buena. Eso ocurri\u00f3 gracias al aumento del uso de Internet m\u00f3vil. El dise\u00f1o adaptativo\u00a0representa una manera relativamente simple y barata\u00a0de crear un sitio web completamente\u00a0funcional y optimizado para m\u00f3viles.<\/p>\n Como dice el otro, hoy en d\u00eda todos los sitios se parecen entre s\u00ed.\u00a0Pero tener un aspecto similar no es necesariamente una mala cosa. No hay ninguna raz\u00f3n para reinventar la rueda. Los patrones de interfaces de usuario deben garantizar una buena experiencia de usuario. Mientras que algunos critican patrones, su difusi\u00f3n permite que la funci\u00f3n sea f\u00e1cilmente reconocible por\u00a0los usuarios.<\/p>\n Por ejemplo, siempre buscas un formulario\u00a0de registro si quieres\u00a0registrarte en un sitio web. Por lo general, esta funci\u00f3n\u00a0puede ser realizada por\u00a0un formulario que se debe\u00a0rellenar o por un bot\u00f3n que permite\u00a0utilizar una cuenta de red social para inscribirse.<\/p>\n El dise\u00f1o web est\u00e1 moviendo hacia el dise\u00f1o de m\u00f3dulos\u00a0y componentes en lugar de p\u00e1ginas web completas. Todos sabemos que tenemos\u00a0elementos repetidos en diferentes pantallas, y que estos elementos deben funcionar\u00a0independientemente, y al mismo tiempo combinarse bien\u00a0con el resto del sitio.<\/p>\n Hoy en d\u00eda\u00a0preocupamos no s\u00f3lo por el dise\u00f1o de\u00a0estos componentes, sino tambi\u00e9n por la realizaci\u00f3n de sus funciones individuales. Los componentes y m\u00f3dulos permiten replicar la misma funcionalidad en todas partes del sitio.<\/p>\n Esta tendencia apareci\u00f3 por una amplia difusi\u00f3n de dise\u00f1os adaptativos. A\u00fan m\u00e1s sitios y aplicaciones incorporan formularios\u00a0de pantalla completa (incluso formularios de inicio de sesi\u00f3n). Haz clic en \"login\" o \"contacto\" y se abrir\u00e1\u00a0un formulario de pantalla completa\u00a0por encima de la p\u00e1gina actual sin llevarte a\u00a0una p\u00e1gina diferente. \u00a1Echa un vistazo al formulario del sitio\u00a0Eighty East!<\/p>\n En cuanto a la usabilidad,\u00a0habitualmente se distinguen dos delitos graves. Son realmente\u00a0terribles. En primer lugar, se trata de\u00a0pop-ups comprados\u00a0por marcas en aras\u00a0de la comercializaci\u00f3n de contenidos.<\/p>\n El segundo delito es relacionado con los textos de los\u00a0mensajes de pop-ups. El mensaje que criticamos se parece a\u00a0'Si Usted no se inscribe, Usted (el usuario) es...'.<\/p>\n Otra tendencia importante que hemos notado es la adici\u00f3n de vistas previas (previsualizaciones) de productos a\u00a0las p\u00e1ginas web o p\u00e1ginas de aterrizaje\u00a0personalizadas. Ellas permiten\u00a0examinar\u00a0productos\u00a0en acci\u00f3n. \u00a1Eche un vistazo al ejemplo del sitio de Slack!<\/p>\n Sin embargo, no es obligatorio utilizar animaciones en las\u00a0previsualizaciones de productos. Algunas p\u00e1ginas de aterrizaje utilizan sencillas capturas de pantalla en formato\u00a0PNG.<\/p>\n Webydo es otro ejemplo brillante con una animaci\u00f3n en vivo en la p\u00e1gina de inicio. Esto permite ver Webydo en acci\u00f3n sin tener que buscar una\u00a0demostraci\u00f3n del producto.<\/p>\n El mundo de desarrollo de front-end ha cambiado significamente. Hoy en d\u00eda se utilizan con mayor frecuencia task runners\/sistemas como Gulp y Grunt\u00a0para realizar una serie de tareas que antes eran completadas\u00a0manualmente.\u00a0Las m\u00e1quinas no cometen errores, por lo que cuanto m\u00e1s automatizas tu sistema,\u00a0menos problemas tendr\u00e1s (en teor\u00eda).<\/p>\n Estas herramientas b\u00e1sicamente ejecutan c\u00f3digos JS que automatizan partes del flujo de trabajo, ya sean c\u00f3digos personalizados JS o scripts\u00a0escritos por otros.<\/p>\n El dise\u00f1o de interfaz de usuario es una parte esencial del dise\u00f1o de experiencia de usuario\u00a0pero no es el objetivo clave.\u00a0Hace 5 a\u00f1os no sab\u00edamos\u00a0casi nada de UX o c\u00f3mo se aplic\u00f3 al dise\u00f1o de interfaz. Y ahora tenemos recursos como UX Stack Exchange y libros gratuitos sobre\u00a0UX.<\/p>\n <\/a>Loading<\/p>\n Es un truco genial que es probable que veamos en 2016. La idea consiste en\u00a0tomar una versi\u00f3n muy peque\u00f1a de una imagen grande, aplicar\u00a0el desenfoque gaussiano a ella, mostrar ella en lugar de la versi\u00f3n original, y a continuaci\u00f3n cargar gradualmente la imagen grande en el fondo.<\/p>\n Pensamos que los d\u00edas de estas animaciones fueron contados a\u00a0mediados de los a\u00f1os 2000. Sin embargo, sorprendentemente, las animaciones o los iconos de carga han regresado. Su objetivo es simple:\u00a0entretener a los visitantes mientras\u00a0se carga la p\u00e1gina.<\/p>\n No es una\u00a0tendencia muy popular, pero con el aumento del\u00a0'peso' de las p\u00e1ginas web\u00a0actuales\u00a0es probablemente que\u00a0se quede, aunque si tu sitio web no se carga en menos de ocho segundos, entonces algo va mal, muy mal.<\/p>\n En los sitios web con un mont\u00f3n de\u00a0contenido, Lazy Loading permite a los visitantes ver el\u00a0contenido del sitio web de inmediato sin tener que esperar hasta que se cargue\u00a0toda la p\u00e1gina. Esto funciona\u00a0especialmente bien en\u00a0los sitios visuales, como, por ejemplo, Facebook, Instagram o Pinterest.<\/p>\n <\/a>Herramientas para Dise\u00f1adores<\/p>\n Sketch App<\/a>\u00a0es una aplicaci\u00f3n (s\u00f3lo para Mac) creada espec\u00edficamente para dise\u00f1adores web. Se trata del\u00a0ambiente de trabajo que permite\u00a0incrustar\u00a0elementos vectoriales en cualquier interfaz, y al mismo tiempo\u00a0ofrece muchas caracter\u00edsticas similares a las\u00a0de Photoshop, como, por ejemplo, efectos de texto y estilos de capas. Si Sketch sigue ofreciendo la mejor experiencia del dise\u00f1o de interfaz de usuario, entonces, su popularidad seguir\u00e1 creciendo en el a\u00f1o\u00a02016<\/span>.<\/p>\n Una nueva tendencia emergente est\u00e1 relacionada con la capacidad de compartir documentos de dise\u00f1o dentro de las aplicaciones de chat. Hay que prestar atenci\u00f3n al ejemplo que permite colocar las anotaciones y los comentarios directamente por encima del documento. Esto ofrece a los dise\u00f1adores una forma limpia de compartir su trabajo con todos los miembros del equipo.<\/p>\n Slack<\/a>\u00a0es la m\u00e1s popular aplicaci\u00f3n de chat que tiene muchas caracter\u00edsticas \u00fatiles.<\/span><\/p>\n Gestores de paquetes ganan popularidad tan r\u00e1pidamente que son pr\u00e1cticamente obligatorios para los desarrolladores de sitios web modernos. Las soluciones como \u00a0<\/span>Bower<\/a> y NPM<\/a> pueden ahorrar un mont\u00f3n de tiempo. Ellos requieren ciertos conocimientos de comandos para la terminal, pero una vez que te acostumbras a l proceso, nunca querr\u00e1s dejarlo.<\/p>\n Las limitaciones de las herramientas de creaci\u00f3n de prototipos siempre causan muchos problemas con la probaci\u00f3n del contenido real y din\u00e1mico. Hay innumerables plugins Sketch \/ Adobe para resolver ellos. Se est\u00e1 convirtiendo en la norma para que los dise\u00f1adores tengan habilidades de codificaci\u00f3n, por lo que es m\u00e1s natural abrir el inspector para sobrescribir p\u00e1ginas vivas o crear un prototipo jQuery desde cero.<\/p>\n Permitiendo a los dise\u00f1adores centrarse en las interacciones en lugar de desplazar el contenido y la informaci\u00f3n, se ayuda a ellos a pensar en la web de una manera fundamentalmente diferente.<\/p>\n <\/a>C\u00f3digos<\/p>\n Recientemente hemos notado un aumento de plugins y caracter\u00edsticas personalizadas adjuntas a los sitios web con el objetivo espec\u00edfico de la gesti\u00f3n de eventos t\u00e1ctiles.<\/p>\n Los plugins como Photoswipe<\/a> y Dragend.js<\/a> est\u00e1n creados para manejar las acciones 'swiping' y ' tapping' en pantallas t\u00e1ctiles. Parece que los desarrolladores web est\u00e1n construyendo sitios web no s\u00f3lo adaptativos, sino tambi\u00e9n t\u00e1ctiles.<\/p>\n Si navegas por la Web, sin duda, encontrar\u00e1s algunas caracter\u00edsticas realmente impresionantes que se basan exclusivamente en los eventos t\u00e1ctiles.<\/p>\n Los componentes web est\u00e1n tratando de resolver los problemas de complejidad. La p\u00e1gina web WebComponents (http:\/\/webcomponents.org\/) tiene grandes recursos y materiales para ayudar a los desarrolladores a entender este tema.<\/p>\n Mientras que los componentes no tienen el estado de la corriente principal, ellos son discutidos por los desarrolladores profesionales de todo el mundo. Google ha lanzado Polymer<\/a> que es un marco que permite agregar componentes web a trav\u00e9s de JS y HTML.<\/p>\n No es pr\u00e1ctico utilizar ellos en los principales proyectos de los clientes por el momento. Sin embargo, la tecnolog\u00eda est\u00e1 disponible y con un poco de pr\u00e1ctica se puede dominar los conceptos con facilidad.<\/p>\n Cada vez m\u00e1s navegadores web se vuelven compatibles con CSS3 y as\u00ed estamos llegando finalmente a una etapa en la que algunos de los nuevos m\u00f3dulos de layout CSS3 pueden ser utilizados de forma segura. Es verdad que polyfills y fallbacks son todav\u00eda utilizados, pero CSS3 Flexbox (Flexible Box Layout) es ya compatible con las \u00faltimas versiones de todos los navegadores web populares.<\/p>\n La tendencia no puede alterar sustancialmente los dise\u00f1os, pero el c\u00f3digo CSS3 ser\u00e1 m\u00e1s sencillo y fiable.<\/p>\n CSS shapes permiten a un dise\u00f1ador transformar su dise\u00f1o en formas como, por ejemplo, un c\u00edrculo. El resultado tiene un aspecto bueno, pero hasta el momento, no es compatible con todos los navegadores.<\/p>\n Los preprocesadores no salen de moda desde hace muchos a\u00f1os, pero s\u00f3lo recientemente se convirtieron en el corriente destacable en el dise\u00f1o \/desarrollo web. Hoy en d\u00eda parece extra\u00f1o escribir CSS como Sass\/SCSS puedeofrecer mucho m\u00e1s.<\/p>\n Uno de los beneficios es una oferta creciente de bibliotecas de Sass\u00a0 mixin. Mixins simples son similares a fragmentos de c\u00f3digo o funciones b\u00e1sicas que generan c\u00f3digos repetibles en CSS.<\/p>\n Algunos mixins est\u00e1n disponibles en las bibliotecas como Bourbon.\u00a0 Por otro lado, puedes buscar mixins Sass\/SCSS en GitHub.<\/p>\n En comparaci\u00f3n con las opciones anteriores para server-side JS, ninguna otra no gana popularidad tan r\u00e1pidamente como \u00a0<\/span>Node.js<\/a>. Los desarrolladores de JavaScript se han enamorado de esta biblioteca que entra en competencia directa con otros lenguajes de back-end como Python<\/a>\u00a0<\/span>or\u00a0<\/span>PHP<\/a>.<\/p>\n Nodo permite a los desarrolladores crear sitios web utilizando uno solo idioma tanto para c\u00f3digos de frontend, como para backend. Y los recursos como \u00a0<\/span>Node Package Manager<\/a>\u00a0 aumentan a\u00fan m\u00e1s el valor de Node.js.<\/p>\n Apoyamos la idea del uso de las herramientas adecuadas para realizar todo tipo de tareas. Y cuando se trata del desarrollo de aplicaciones m\u00f3viles, estas herramientas son Java<\/a> para Android, Objective-C\/Swift<\/a> para iOS.<\/p>\n Pero no todo el mundo quiere aprender un nuevo idioma s\u00f3lo para crear una aplicaci\u00f3n m\u00f3vil. Afortunadamente las bibliotecas alternativas como NativeScript<\/a>\u00a0<\/span>o React Native<\/a>\u00a0 facilitan este proceso. Ahora hacerse un programador de apliaciones m\u00f3viles es m\u00e1s f\u00e1cil,\u00a0particularmente gracias a JavaScript. PhoneGap<\/a> es otra opci\u00f3n que se basa en c\u00f3digos HTML\/CSS\/JS.<\/p>\n Mientras que el proceso de creaci\u00f3n no var\u00eda mucho, JS se est\u00e1 convirtiendo r\u00e1pidamente en una soluci\u00f3n perfecta para los programadores que quieren desarrollar aplicaciones m\u00f3viles sin tener que aprender un nuevo idioma.<\/p>\n Algunos dise\u00f1adores piensan que no deber\u00edan escribir c\u00f3digos, mientras que otros creen que es absolutamente normal. Un buen dise\u00f1o es una imagen bonita sin c\u00f3digo. Sin embargo, ser\u00eda m\u00e1s pr\u00e1ctico si un dise\u00f1ador se centra en ambos sus aspectos.<\/p>\n Entonces, \u00bfhay una respuesta definitiva? Algunos dicen que los dise\u00f1adores web que saben codificar frontend son m\u00e1s demandades en el mercado. Sin embargo, si alg\u00fan dise\u00f1ador no quer\u00eda escribir c\u00f3digos... \u00bfVale la pena aprender s\u00f3lo para competir? Creemos que la respuesta m\u00e1s clara es hacer lo que quieras.<\/p>\n El aprendizaje en l\u00ednea se vuelve cada vez m\u00e1s popular debido a la aparici\u00f3n de nuevos cursos y sitios web. Los sitios conocidos como Treehouse<\/a> y CodeSchool<\/a> o<\/span>frecen cursos incre\u00edbles, as\u00ed como los nuevos Bitfountain<\/a> y Learn-Verified<\/a>.<\/p>\n Si hay algo que quer\u00edas aprender, probablemente podr\u00e1s encontrar un curso adecuado para aprenderlo en l\u00ednea - especialmente si quer\u00edas aprender las t\u00e9cnicas digitales, como el dise\u00f1o de interfaz de usuario o el desarrollo de aplicaciones.<\/p>\n Sol\u00edamos ejecutar todos los programas en escritorios. Pero hoy en d\u00eda nos sorprende el n\u00famero de aplicaciones web disponibles gratuitamente en l\u00ednea. Hay aplicaciones para todo tipo de tareas, comenzando por la codificaci\u00f3n \/ decodificaci\u00f3n de URL y terminando por el editor de Markdown completamente gratis. Incluso Google Drive ofrece los productos de Microsoft Office disponibles en el navegador (totalmente gratis).<\/p>\n Hoy en d\u00eda la mayor parte del tr\u00e1fico viene de tel\u00e9fonos m\u00f3viles. Por lo tanto, es necesario construir contenidos en aplicaciones m\u00f3viles. Esto tiene sentido como s\u00f3lo el 14% del tiempo gastado en un dispositivo m\u00f3vil, se gasta en el navegador, mientras que el resto es gastado en las aplicaciones m\u00f3viles.<\/p>\n <\/a>Pron\u00f3stico Futurista<\/p>\n Como Internet y Tecnolog\u00eda permiten que Web Sem\u00e1ntica se convierta en una realidad, creemos que esta es otra cosa que los dise\u00f1adores e ingenieros van a hacer en 2016. En nuestra opini\u00f3n, ellos se centrar\u00e1n en la mejora de UX con Wearables, Realidad Aumentada y Realidad Virtual.<\/p>\n Wearables est\u00e1n apareciendo por todas partes. M\u00e1s pronto o m\u00e1s tarde los dise\u00f1adores e ingenieros se sentir\u00e1n interesados por esta categor\u00eda.<\/p>\n Wove es un ejemplo de los gadgets de los cuales estamos hablando.<\/p>\n Los aparatos y soluciones de realidad aumentada se vuelven m\u00e1s avanzados y asequibles.<\/p>\n HoloLens de Microsoft<\/p>\n \u00a0OculusVR<\/p>\n Al igual que los espectadores en el teatro est\u00e1n esperando que sus actores favoritos jueguen sus papeles en el espect\u00e1culo, cada a\u00f1o los dise\u00f1adores y desarrolladores web celebran la llegada del A\u00f1o Nuevo esperando la aparici\u00f3n de nuevas tendencias.<\/p>\n","protected":false},"author":1334762,"featured_media":5475,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[24],"tags":[439],"yoast_head":"\n
\n<\/strong><\/p>\n\n
![\"Tendencias-Dise\u00f1ot\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/1Tendencia-Layout.jpg\")
<\/a><\/p>\nPantalla Dividida\/Split Screen<\/h3>\n
![\"Tendencias-Split-Screen\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/2Tendencia-Split-Screen.jpg\")
<\/a><\/p>\n
\nUso Audaz de Colores<\/h3>\n
![\"3Tendencia-colores\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/3Tendencia-colores.jpg\")
<\/a><\/p>\n
\nTipograf\u00eda<\/h3>\n
![\"4Tendencia-Tipografia\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/4Tendencia-Tipografia.jpg\")
<\/a><\/p>\n
\nRejilla de Bloques \/ Blocks Grid<\/h3>\n
![\"5Tendencia-Grid\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/5Tendencia-Grid.jpg\")
<\/a><\/p>\nFlexbox redefinir\u00e1 los sistemas de rejilla adaptativa (responsive grid)<\/h3>\n
![\"6Tendencia-Flexbox\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/6Tendencia-Flexbox.jpg\")
<\/a><\/p>\n
\nDise\u00f1os con Tarjetas<\/h3>\n
![\"7Tendencia-card-layouts\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/7Tendencia-card-layouts.jpg\")
<\/a><\/p>\n
\nSin Cabecera\/Pie de p\u00e1gina<\/h3>\n
![\"8Tendencia-sin-header-footer\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/8Tendencia-sin-header-footer.jpg\")
<\/a><\/p>\n
\nEl auge de Material Design<\/h3>\n
![\"9Tendencia-Material-Design\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/9Tendencia-Material-Design.jpg\")
<\/a><\/p>\n
\nFlat Design nunca pasa de moda<\/h3>\n
![\"10Tendencia-Flat-Design\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/10Tendencia-Flat-Design.jpg\")
<\/a><\/p>\n
\nDise\u00f1o Semi-Plano<\/h3>\n
![\"11Tendencia-Semi-flat-design\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/11Tendencia-Semi-flat-design.jpg\")
<\/a><\/p>\n
\nElimincaci\u00f3n de Elementos Innecesarios a Favor de la Simplicidad<\/h3>\n
![\"12Tendencia-sin-innecesarios-elementos\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/12Tendencia-sin-innecesarios-elementos.jpg\")
<\/a><\/p>\n
\nMenos P\u00e1ginas<\/h3>\n
![\"13Tendencia-Minimalist\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/13Tendencia-Minimalist.jpg\")
<\/a><\/p>\n
\nAnchura Fijada<\/h3>\n
![\"14Tendencia-anchura-fijada\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/14Tendencia-anchura-fijada.jpg\")
<\/a><\/p>\n
\nEstilo Vintage Inspirado en los A\u00f1os 80<\/h3>\n
![\"15Tendencia-Vintage\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/15Tendencia-Vintage.jpg\")
<\/a><\/p>\n
\nP\u00e1ginas de Inicio Personalizadas se Quedar\u00e1n en 2016<\/h3>\n
![\"16Tendencia-Custom-homepages\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/16Tendencia-Custom-homepages.jpg\")
<\/a><\/p>\n
\nVarias Formas Geom\u00e9tricas<\/h3>\n
![\"17Tendencia-formas-geometricas\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/17Tendencia-formas-geometricas.jpg\")
<\/a><\/p>\n
\nBotones Transparentes<\/h3>\n
![\"18Tendencia-Botones-Transparentes\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/18Tendencia-Botones-Transparentes.jpg\")
<\/a><\/p>\n
\n\u00c9nfasis en la Originalidad<\/h3>\n
![\"19Tendencia-Imagenes\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/19Tendencia-Imagenes.jpg\")
<\/a><\/p>\nUna Sola Imagen<\/h3>\n
![\"20Tendencia-sola-imagen\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/20Tendencia-sola-imagen.jpg\")
<\/a><\/p>\n
\nV\u00eddeo de Fondo de\u00a0Pantalla Completa<\/h3>\n
![\"21Tendencia-Full-screen-video-fondo\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/21Tendencia-Full-screen-video-fondo.jpg\")
<\/a><\/p>\n
\nDesenfoque Realidad-Imaginaci\u00f3n<\/h3>\n
![\"22Tendencia-blur\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/22Tendencia-blur.jpg\")
<\/a><\/p>\n
\nReales Fotos\u00a0Stock<\/h3>\n
![\"23Tendencia-Natural-stock-photography\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/23Tendencia-Natural-stock-photography.jpg\")
<\/a><\/p>\n
\nVibrantes Ilustraciones e Iconografias\u00a0Personalizadas<\/h3>\n
![\"24Tendencia-ilustraciones-iconos-personalizados\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/24Tendencia-ilustraciones-iconos-personalizados.jpg\")
<\/a><\/p>\n
\n
\n![\"\"](\"https:\/\/monsterspost.com\/wp-content\/uploads\/2016\/01\/animation.jpg?64ba4f\")
<\/p>\nHistoria Animada<\/h3>\n
![\"\"](\"https:\/\/monsterspost.com\/wp-content\/uploads\/2016\/01\/Animated-story.jpg?64ba4f\")
<\/a><\/p>\n
\nFondos Din\u00e1micos<\/h3>\n
![\"\"](\"https:\/\/monsterspost.com\/wp-content\/uploads\/2016\/01\/Dynamic-Backgrounds.jpg?64ba4f\")
<\/a><\/p>\n
\nM\u00e1s Contenido Est\u00e1tico\u00a0\/\u00a0Menos Partes que se Mueven<\/h3>\n
![\"\"](\"https:\/\/monsterspost.com\/wp-content\/uploads\/2016\/01\/More-Static-Content-Less-moving-parts.jpg?64ba4f\")
<\/a><\/p>\n
\nCinemagraf\u00edas<\/h3>\n
![\"\"](\"https:\/\/monsterspost.com\/wp-content\/uploads\/2016\/01\/Coffee-Machine.gif?64ba4f\")
<\/a><\/p>\n
\nMicro Experiencias<\/h3>\n
![\"29Tendencia-Micro-experiencias\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/29Tendencia-Micro-experiencias.jpg\")
<\/a><\/p>\n
\n![\"\"](\"https:\/\/monsterspost.com\/wp-content\/uploads\/2016\/01\/Scrolling.jpg?64ba4f\")
<\/p>\nScroll Largo<\/h3>\n
![\"30Tendencia-Long-Scroll\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/30Tendencia-Long-Scroll.jpg\")
<\/a><\/p>\n
\nParallax Scrolling<\/h3>\n
![\"31Tendencia-Parallax-scrolling\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/31Tendencia-Parallax-scrolling.jpg\")
<\/a><\/p>\n
\nScrolljacking<\/h3>\n
![\"32Tendencia-Scrolljacking\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/32Tendencia-Scrolljacking.jpg\")
<\/a><\/p>\n
\nReducci\u00f3n de Altura de P\u00e1gina<\/h3>\n
![\"44_Designers-Toolkit\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/44_Designers-Toolkit.jpg\")
<\/a><\/p>\nDatos accesibles para tomar\u00a0decisiones de dise\u00f1o basadas en datos<\/h3>\n
![\"34_1Tendencia\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/34_1Tendencia.jpg\")
<\/a><\/p>\n
\nRendimiento<\/h3>\n
Interfaz de Usuario de\u00a0Respuesta Inmediata<\/h3>\n
![\"35Tendencia-Immediate-response-UI\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/35Tendencia-Immediate-response-UI.jpg\")
<\/a><\/p>\n
\nDise\u00f1o Responsive<\/h3>\n
![\"36Tendencia-Responsive-\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/36Tendencia-Responsive-.jpg\")
<\/a><\/p>\n
\nProliferaci\u00f3n de Patrones de Interfaces de Usuario<\/h3>\n
![\"37Tendencia-UI-patrones\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/37Tendencia-UI-patrones.jpg\")
<\/a><\/p>\n
\nDise\u00f1ar\u00a0m\u00f3dulos y componentes en lugar de p\u00e1ginas enteras<\/h3>\n
Formularios de Pantalla Completa<\/h3>\n
![\"38Tendencia-formularios-full-screen\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/38Tendencia-formularios-full-screen.jpg\")
<\/a><\/p>\n
\nVentanas Emergentes Pasivas y Agresivas<\/h3>\n
![\"39Tendencia-pop-ups\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/39Tendencia-pop-ups.jpg\")
<\/a><\/p>\n
\nVistas Previas en Vivo<\/h3>\n
![\"40Tendencia-resenas-productos\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/40Tendencia-resenas-productos.jpg\")
<\/a><\/p>\n
\n![\"40_1geticonjar\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/40_1geticonjar.jpg\")
<\/a><\/p>\n
\n![\"40_2webydo\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/40_2webydo.jpg\")
<\/a><\/p>\n
\nTask Runners<\/h3>\n
![\"41_gulpjs\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/41_gulpjs.jpg\")
<\/a><\/p>\n
\n![\"41_1gruntjs\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/41_1gruntjs.jpg\")
<\/a><\/p>\n
\nEnfoque en Dise\u00f1o de UX<\/h3>\n
![\"42Tendencia-foco-en-UX\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/42Tendencia-foco-en-UX.jpg\")
<\/a><\/p>\n
\n![\"42_2loading\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/42_2loading.jpg\")
<\/a><\/p>\nM\u00e9todo\u00a0\u201cblur up\u201d<\/h3>\n
Animaciones \u201cLoading\u201d \u00a0\/ precargadores<\/h3>\n
![\"43Tendencia-preloaders\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/43Tendencia-preloaders.jpg\")
<\/a><\/p>\n
\nLazy Loading<\/h3>\n
![\"44Tendencia-Lazy-Loading\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/44Tendencia-Lazy-Loading.jpg\")
<\/a><\/p>\n
\n<\/a><\/p>\nAplicacion Sketch para Dise\u00f1ar\u00a0UI<\/h3>\n
Herramientas de Colaboraci\u00f3n para Dise\u00f1o<\/h3>\n
![\"45Tendencia-Notable\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/45Tendencia-Notable.jpg\")
<\/a><\/p>\n
\nGestores de Paquetes<\/h3>\n
Los dise\u00f1adores van a crear prototipos en los navegadores web para centrarse en las interacciones en lugar del dise\u00f1o<\/h3>\n
![\"46Tendencia-seesparkbox\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/46Tendencia-seesparkbox.jpg\")
<\/a><\/p>\n
\n![\"47_coding\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/47_coding.jpg\")
<\/a><\/p>\nCaracter\u00edsticas 'T\u00e1ctiles'<\/h3>\n
\nCrecimiento de Componentes Web<\/h3>\n
\nCSS3 finalmente impactar\u00e1 layouts<\/h3>\n
\nCSS shapes<\/h3>\n
\nSass\/SCSS mixins<\/h3>\n
![\"48Tendencia-Free-Sass-SCSS-mixins\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/48Tendencia-Free-Sass-SCSS-mixins.jpg\")
<\/a><\/p>\n
\nServer-side JavaScript<\/h3>\n
\nNative JS Aplicaciones M\u00f3viles<\/h3>\n
\nDise\u00f1adores aprenden codificaci\u00f3n<\/h3>\n
\nRecursos para aprender en l\u00ednea<\/h3>\n
![\"49-Learn-Verified\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/49-Learn-Verified.jpg\")
<\/a><\/p>\n
\nHerramientas y Aplicaciones Gratis<\/h3>\n
\nDise\u00f1o de aplicaciones m\u00f3viles<\/h3>\n
![\"50Tendencia-Futuristic-forecast\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/50Tendencia-Futuristic-forecast.jpg\")
<\/a><\/p>\n
\nWearables (dispositivos ponibles)<\/h3>\n
![\"51Tendencia-Wove\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/51Tendencia-Wove.jpg\")
<\/a><\/p>\n
\nRealidad Aumentada y VR<\/h3>\n
![\"52hololens\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/52hololens.jpg\")
<\/a><\/p>\n![\"53oculus\"](\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2016\/01\/53oculus.jpg\")
<\/a><\/p>\n
\nFuente: \"Dig Deeper - 65 Web Design Trends of 2016<\/a>\" por HelgaMoreno<\/a><\/h3>\n<\/div>\n","protected":false},"excerpt":{"rendered":"