{"id":10952,"date":"2018-06-13T08:34:33","date_gmt":"2018-06-13T08:34:33","guid":{"rendered":"https:\/\/www.templatemonster.com\/es\/blog\/?p=10952"},"modified":"2022-09-12T13:19:48","modified_gmt":"2022-09-12T13:19:48","slug":"nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente","status":"publish","type":"post","link":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/","title":{"rendered":"Nueva selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web. \u00a1El dise\u00f1o es f\u00e1cil si lo haces de manera inteligente!"},"content":{"rendered":"<p>\u00bfEs posible que tengas demasiadas herramientas gratuitas para acelerar\/mejorar tu proceso de dise\u00f1o web? Por supuesto no es posible, a medida que nuevas tecnolog\u00edas avanzadas aparecen todos los d\u00edas. Y todos los d\u00edas los desarrolladores web&nbsp;descubren&nbsp;algo interesante y novedoso. Pero&nbsp;se tarda mucho tiempo en buscar contenidos relevantes en la red.<\/p>\n<p><!--more--><\/p>\n<p>Ahorra tu tiempo y energ\u00eda para la creaci\u00f3n.&nbsp;Estamos aqu\u00ed para saciar tu sed de conocimientos.&nbsp;En esta&nbsp;entrada te ofrecemos <strong>137&nbsp;herramientas y recursos gratuitos<\/strong>&nbsp;de desarrollo web que podr\u00edan interesar a los dise\u00f1adores y desarrolladores web.&nbsp;Estamos seguros de que algunas herramientas de dise\u00f1o web realmente simplificar\u00e1n&nbsp;tu&nbsp;trabajo,&nbsp;mientras que otras herramientas te sorprender\u00e1n o simplemente te mantendr\u00e1n al tanto con las tendencias actuales.<\/p>\n<p>Todas las herramientas, art\u00edculos, tutoriales, complementos, consejos y trucos presentados en este art\u00edculo no te costar\u00e1n un centavo. Si alguna herramienta no es totalmente gratuita, todav\u00eda tiene un per\u00edodo de prueba gratuito. Durante este tiempo podr\u00e1s probarla y usarla como lo desees&nbsp;para entender si realmente vale la pena comprar ella. Algunos de los productos de la lista tienen tanto planes gratuitos, como de pago, lo que tambi\u00e9n te permite familiarizarte con la innovaci\u00f3n sin pagar nada.<\/p>\n<p><em>Ten en cuenta, por favor, que todos los materiales de treceros de esta entrada son en ingl\u00e9s.<\/em><\/p>\n<p><strong>Esta selecci\u00f3n se divide en&nbsp;las siguientes secciones:<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#Herramientas de dise\u00f1o web\">Herramientas de dise\u00f1o web<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#Freebies para Sketch y Mac\">Freebies para Sketch y Mac<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#UI\/UX \u2013 libros \u00fatiles\">UI\/UX - libros \u00fatiles<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#Herramientas de codificaci\u00f3n y desarrollo web\">Herramientas de codificaci\u00f3n y desarrollo web<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#Lo imprescindible para desarrollador web\">Lo imprescindible para desarrollador web<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#CSS\">CSS<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#JavaScript\">JavaScript<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#ES6\">ES6<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#Plugins\">Plugins<\/a><\/li>\n<li><a href=\"https:\/\/monsterspost.com\/es\/2018\/06\/13\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#Jugar y aprender a codificar\">Jugar y aprender a codificar<\/a><\/li>\n<\/ul>\n<hr>\n<p><a name=\"Herramientas de dise\u00f1o web\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/01.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10960\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/01.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/01.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/01-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/01-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<ul>\n<li><a href=\"http:\/\/macaw.co\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Macaw<\/a> - Una herramienta de dise\u00f1o web que permite dejar de escribir c\u00f3digos y comenzar a dibujarlos. Macaw ofrece la misma flexibilidad que tu editor de im\u00e1genes favorito, pero tambi\u00e9n escribe HTML sem\u00e1ntico y CSS muy breve.<\/li>\n<li><a href=\"https:\/\/www.gravit.io\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Gravit<\/a> - Gravit es una herramienta online de dise\u00f1o profesional para dise\u00f1adores y usuarios regulares.&nbsp;Te permite crear hermosos logotipos, tarjetas de visita, sitios web, folletos y covers de redes sociales con su ayuda.<\/li>\n<li><a href=\"https:\/\/www.lucidpress.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Lucidpress<\/a> - Permite crear y compartir contenidos visuales impresionantes: folletos, volantes, boletines informativos, informes, publicaciones digitales, folletos en l\u00ednea, revistas digitales y m\u00e1s. Se elimina la curva de aprendizaje tradicional del software de dise\u00f1o, por lo que los dise\u00f1adores nuevos y experimentados no tendr\u00e1n problemas con su uso.<\/li>\n<li><a href=\"http:\/\/sparkle.cx\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Sparkle<\/a> - Herramienta de dibujo vectorial que te ofrece infinitas posibilidades de expresi\u00f3n. Sparkle no te&nbsp;limita&nbsp;a plantillas r\u00edgidas, y el&nbsp;layout es de forma libre. La herramienta es de pago, pero tiene una versi\u00f3n de prueba gratuita.<\/li>\n<li><a href=\"http:\/\/www.logogala.com\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">LogoGala<\/a> - Los dise\u00f1adores pueden demostrar&nbsp;sus trabajos en la galer\u00eda o simplemente navegar por la galer\u00eda en busca de inspiraci\u00f3n.<\/li>\n<li><a href=\"https:\/\/fbrctr.github.io\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Fabricator<\/a> - Organiza tu sistema de dise\u00f1o de la manera deseada. Se genera una gu\u00eda de estilo&nbsp;sobre la base de tu c\u00f3digo de kit de herramientas. Escribe la documentaci\u00f3n en el&nbsp;marco para que tu kit de herramientas sea f\u00e1cil de usar para otros desarrolladores. Crea prototipos r\u00e1pidamente.<\/li>\n<li><a href=\"http:\/\/uilang.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Uilang<\/a> - Uilang es bueno para crear componentes de interfaz de usuario personalizados, a\u00f1adir algo de interactividad a tu sitio, crear prototipos, etc. No se requiere ninguna experiencia en programaci\u00f3n.<\/li>\n<li><a href=\"http:\/\/anijs.github.io\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Anijs<\/a> - Una biblioteca para ampliar tus habilidades de dise\u00f1o web sin codificaci\u00f3n. Proporciona una mejor integraci\u00f3n entre codificadores y dise\u00f1adores, es f\u00e1cil y r\u00e1pido de usar, funciona bien en iPad, iPhone, Android y todos los navegadores modernos.<\/li>\n<li><a href=\"http:\/\/www.colorfavs.com\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">ColorFavs<\/a> - Este es el lugar que facilita la creaci\u00f3n y el descubrimiento de nuevos colores y paletas para todos tus proyectos.<\/li>\n<li><a href=\"http:\/\/froont.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Froont<\/a> - Crea p\u00e1ginas responsivas&nbsp;tu mismo, sin&nbsp;contratar a un desarrollador. Cada p\u00e1gina creada con FROONT es una p\u00e1gina est\u00e1tica que es f\u00e1cil de crear y se carga r\u00e1pidamente.<\/li>\n<li><a href=\"http:\/\/www.statnutapp.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">STATNUT<\/a> - STATNUT es un recurso principal para acceder a todas tus estad\u00edsticas web. La aplicaci\u00f3n es encantadora y colorida.<\/li>\n<li><a href=\"http:\/\/designfeed.io\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Designfeed<\/a> - En realidad, solo dices a Designfeed lo que quieres decir, y autom\u00e1ticamente se crea un sinf\u00edn de variaciones de dise\u00f1o para que elijas. La herramienta crea autom\u00e1ticamente versiones de tama\u00f1o perfecto de tu dise\u00f1o para publicar en todas tus plataformas sociales.<\/li>\n<li><a href=\"https:\/\/bonsai.pxf.io\/NKDr9b\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Bonsai<\/a> - Eplora las tarifas de freelance con Bonsai. Ayuda a m\u00e1s de 10.000 profesionales independientes a recibir pagos a tiempo. Obtendr\u00e1s 5 facturas gratuitas cuando te registres.<\/li>\n<li><a href=\"http:\/\/thepatternlibrary.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">The Pattern Library<\/a> - The Amazing Pattern Library es un proyecto&nbsp;creciente que&nbsp;recoge los patrones compartidos por los dise\u00f1adores m\u00e1s talentosos para que los uses libremente en tus dise\u00f1os. La colecci\u00f3n de patrones y la calidad de ellos son de primera clase.<\/li>\n<li><a href=\"https:\/\/reedsy.com\/write-a-book\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Write a Book<\/a> - \u00bfPlaneas compartir tus conocimientos en un libro o dise\u00f1ar un libro para un tercero? Esta hermosa herramienta de producci\u00f3n se encarga del formateo y la conversi\u00f3n, incluso antes de que hayas terminado de escribirlo.<\/li>\n<li><a href=\"http:\/\/sourcefoundry.org\/hack\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Hack<\/a> -&nbsp; Toma&nbsp;cualquier herramienta moderna de edici\u00f3n de fuentes y personal\u00edzala seg\u00fan tus necesidades. Incluye conjuntos oblicuos regulares, negritas, oblicuos y&nbsp;negritas monoespaciados para cubrir todas tus necesidades de resaltado de sintaxis. Proporciona m\u00e1s de 1500 glifos, incluyendo los conjuntos latinos, griegos modernos y cir\u00edlicos expandidos.<\/li>\n<li><a href=\"https:\/\/desygner.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Desygner<\/a> - Con Desygner puedes editar desde&nbsp;tu computadora, tableta o tel\u00e9fono, importar im\u00e1genes y textos desde Adobe PDF, PSD y Microsoft Powerpoint. Te ofrece millones de im\u00e1genes de uso gratuito para arrastrar y soltar en&nbsp;cualquier lugar, miles de fondos gratuitos, pegatinas y textos. Comparte en l\u00ednea o descarga como PDF, JPG o PNG completamente gratis.<\/li>\n<li><a href=\"http:\/\/cmdspace.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">CMD space<\/a> - Todo dise\u00f1ador necesita un portafolio. Esta herramienta se conecta a tu cuenta de Dribbble y te brinda la posibilidad de crear de inmediato un portafolio de dise\u00f1o.<\/li>\n<li><a href=\"https:\/\/wevideo.pxf.io\/2rzmrG\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">WeVideo<\/a> - WeVideo es una plataforma colaborativa de creaci\u00f3n de videos basada en la nube. No&nbsp;debes ser un profesional para crear videos de alta calidad. Sin embargo, puedes controlar el aspecto de tu video, incluyendo las transiciones, el movimiento r\u00e1pido \/ lento,&nbsp;Green Screen y mucho m\u00e1s. WeVideo te permite&nbsp;ahorrar el espacio de tu disco duro. Simplemente sube todo a la nube.<\/li>\n<li><a href=\"http:\/\/blog.semplicelabs.com\/studio-version\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Semplice<\/a> - El primer sistema totalmente responsive del portafolio de estudio de casos (case study)&nbsp;con funciones avanzadas para peque\u00f1os estudios y startups.<\/li>\n<li><a href=\"https:\/\/builditwith.me\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Build it with Me<\/a> - Build it with Me es una herramienta que ayuda a conectarte con los dise\u00f1adores y desarrolladores afines unidos por el mismo objetivo: crear aplicaciones interesantes y \u00fatiles.<\/li>\n<li><a href=\"http:\/\/visage.co\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Visage<\/a> - \u00bfNecesitas crear muchos contenidos visuales? Visage es una herramienta de dise\u00f1o que simplifica la creaci\u00f3n de contenidos de marca, a diferencia de trabajar con vendedores lentos y costosos.<\/li>\n<li><a href=\"http:\/\/ezgif.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Ezgif<\/a> - Ezgif.com es un creador de gifs en l\u00ednea y un conjunto de herramientas para la edici\u00f3n b\u00e1sica de gif. Aqu\u00ed puedes crear, cambiar el tama\u00f1o, recortar, invertir, optimizar y aplicar algunos efectos a tus gifs. Tambi\u00e9n puedes utilizar estas herramientas en l\u00ednea para casi cualquier otro tipo de imagen (jpeg, png, bmp, tiff).<\/li>\n<li><a href=\"https:\/\/sandbox.imgix.com\/create\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Imgix<\/a> - Con Imgix puedes&nbsp;cambiar de tama\u00f1o&nbsp;y procesar im\u00e1genes en tiempo real con&nbsp;los comandos sencillos de URL. Ingresa una URL de imgix o haz clic en un ejemplo y la zona de pruebas mostrar\u00e1 cada transformaci\u00f3n de imagen mientras editas y agregas nuevas operaciones.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"Freebies para Sketch y Mac\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/sketch-mac.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10970\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/sketch-mac.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/sketch-mac.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/sketch-mac-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/sketch-mac-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<ul>\n<li><a href=\"https:\/\/medium.com\/sketch-app-sources\/designing-with-meaningful-data-5456b40e172e#.hpr2wfjk9\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Craft<\/a> - Craft es el nuevo punto de referencia para las interfaces de usuario del complemento Sketch. Permite la manipulaci\u00f3n directa, tratamiento del tipo WYSIWYG para datos simulados. Tambi\u00e9n cuenta con una interfaz integrada sencilla para ampliar los datos de muestra al copiar y pegar archivos de texto plano. Hacer&nbsp;clic en los bloques de contenido de los sitios web existentes para incluir sus datos en tu propio dise\u00f1o es otra funci\u00f3n \u00fatil.<\/li>\n<li><a href=\"https:\/\/tombutterfield.gumroad.com\/l\/LAyuz?a=967376819\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Mobile Wireframe Kit<\/a> - Mobile Wireframe Kit es un documento de&nbsp;Sketch que consiste de&nbsp;algunos de los elementos de interfaz de usuario m\u00e1s utilizados en el dise\u00f1o de aplicaciones m\u00f3viles.<\/li>\n<li><a href=\"http:\/\/www.sketchapp.com\/extensions\/plugins\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Sketch Plugins<\/a> - Una colecci\u00f3n de complementos para Sketch creados por los desarrolladores terceros.<\/li>\n<li><a href=\"http:\/\/sketchtoolbox.com\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Sketch Toolbox<\/a> - Un administrador de complementos sencillo para Sketch. Te permite navegar por los complementos m\u00e1s populares disponibles para Sketch. Descarga e instala nuevos complementos con un solo clic. Autom\u00e1ticamente mantiene actualizados todos esos complementos.<\/li>\n<li><a href=\"http:\/\/sketch.land\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Sketch Land<\/a> - Una lista de los recursos m\u00e1s \u00fatiles para quienes usan Sketch.<\/li>\n<li><a href=\"http:\/\/labs.invisionapp.com\/craft\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Craft<\/a> - Craft es un conjunto de complementos para Sketch y Photoshop que te permite dise\u00f1ar con datos reales, importar datos ricos y duplicar assets de dise\u00f1o r\u00e1pidamente.<\/li>\n<li><a href=\"https:\/\/bjango.com\/designresources\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Bjango<\/a> - Un conjunto completo de plantillas de iconos de aplicaciones para Photoshop, Illustrator, Sketch y Affinity Designer.&nbsp;Hay plantillas&nbsp;para Android, iOS, OS X, Apple TV (TVOS), Apple Watch (watchOS), Windows, Windows Phone y favicons web.&nbsp;Adem\u00e1s&nbsp;te ofrece una colecci\u00f3n de acciones de Photoshop, scripts de Photoshop, reglas de Hazel, flujos de trabajo de OS X y otras cosas aleatorias para dise\u00f1adores&nbsp;y desarrolladores.<\/li>\n<li><a href=\"https:\/\/github.com\/andrewfiorillo\/sketch-palettes\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Sketch Palettes<\/a> - Un complemento de Sketch que te permite guardar y a\u00f1adir colores al selector de colores.<\/li>\n<li><a href=\"https:\/\/marvelapp.com\/prototype-with-sketch\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Marvel<\/a> - Marvel es un complemento para Sketch para crear prototipos m\u00f3viles y web.<\/li>\n<li><a href=\"https:\/\/github.com\/cognitom\/symbols-for-sketch\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Cognitom<\/a> - Un conjunto de plantillas para crear una fuente de s\u00edmbolos o fuente de iconos con Sketch.<\/li>\n<li><a href=\"http:\/\/facebook.github.io\/design\/devices.html\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Devices<\/a> - Una colecci\u00f3n de im\u00e1genes y archivos de&nbsp;Sketch de dispositivos populares.<\/li>\n<\/ul>\n<p><strong>Herramientas solo para&nbsp;Mac<\/strong><\/p>\n<ul>\n<li><a href=\"http:\/\/realmacsoftware.com\/rapidweaver\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">RapidWeaver<\/a> - Dise\u00f1a, crea y publica tu propio sitio web con esta magn\u00edfica herramienta para Mac.<\/li>\n<li><a href=\"http:\/\/cactusformac.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Cactus for MAC<\/a> - Un generador de sitios web est\u00e1ticos r\u00e1pido y f\u00e1cil que utiliza la mejor tecnolog\u00eda de dise\u00f1o web en una soluci\u00f3n elegante.<\/li>\n<li><a href=\"https:\/\/designcode.io\/ios9\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">iOS 9 GUI<\/a> - Este kit te permite analizar los elementos de la interfaz de usuario para iOS 9 en el formato vectorial del 100%. \u00dasalo para estudiar, presentar y dise\u00f1ar excelentes aplicaciones.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"UI\/UX - libros \u00fatiles\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/ui-ux.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10971\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/ui-ux.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/ui-ux.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/ui-ux-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/ui-ux-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<p><strong>Herramientas de&nbsp;UI\/UX<\/strong><\/p>\n<ul>\n<li><a href=\"http:\/\/collectui.com\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">UI<\/a> - Una inspiraci\u00f3n diaria recopilada del archivo de IU&nbsp;y m\u00e1s. M\u00e1s de 2200 dise\u00f1os&nbsp;agrupados en 117 categor\u00edas.<\/li>\n<li><a href=\"http:\/\/heat-map.co\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Heat Map<\/a> - El mapa de calor te ayudar\u00e1 a comprender qu\u00e9 elementos de las p\u00e1ginas web atraen m\u00e1s o menos atenci\u00f3n. El resultado generalmente est\u00e1 disponible en menos de 20 segundos. No es necesario insertar c\u00f3digos especiales o scripts. El algoritmo se basa en las investigaciones cient\u00edficas.<\/li>\n<li><a href=\"https:\/\/usabilitysquare.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Usability Square<\/a> - Este es el lugar donde los entusiastas de la usabilidad se re\u00fanen para probar ideas y productos y ahora tienes la posibilidad de obtener&nbsp;opiniones imparciales de personas reales. Los mapas de calor est\u00e1n disponibles al instante.<\/li>\n<li><a href=\"https:\/\/marvelapp.com\/user-testing\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Marvel<\/a> - Convierte&nbsp;tus dise\u00f1os y bocetos en prototipos de iOS, arrastr\u00e1ndolos y solt\u00e1ndolos en Marvel, env\u00eda tu prototipo a los usuarios y comienza las pruebas.&nbsp;Ve&nbsp;lo que sucede exactamente en cada punto de tu prototipo y luego comparte&nbsp;los resultados con tu equipo.<\/li>\n<\/ul>\n<p><strong>Art\u00edculos&nbsp;sobre UI\/UX<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/www.linkedin.com\/pulse\/why-were-doubling-down-buttons-nathaniel-hindman\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">URX<\/a> - Nate Hindman explica c\u00f3mo a\u00f1adir&nbsp;el bot\u00f3n 'Comprar' a tu aplicaci\u00f3n sin programar con URX.<\/li>\n<li><a href=\"http:\/\/dangrover.com\/blog\/2016\/01\/31\/more-chinese-mobile-ui-trends.html\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Chinese Mobile UI Trends<\/a> - M\u00e1s tendencias de la interfaz de usuario m\u00f3vil en China: un art\u00edculo de Dan Grover.<\/li>\n<li><a href=\"https:\/\/clk.tradedoubler.com\/click?p=264355&amp;a=3279527&amp;url=https%3A%2F%2Fblog.adobe.com%2Fen%2Ftopics%2Fdreamweaver\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Animation Principles<\/a> - Cinco principios de&nbsp;animaci\u00f3n efectiva en UX por Linn Vizard.<\/li>\n<li><a href=\"https:\/\/medium.com\/@MrAlanCooper\/ux-design-in-14-simple-steps-b8a0f2780769#.s9d881l3s\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">UX Design Steps<\/a> - Dise\u00f1o de UX en 14 pasos sencillos por Alan Cooper.<\/li>\n<li><a href=\"http:\/\/speckyboy.com\/2016\/02\/15\/micro-interactions\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Using Micro-interactions<\/a> - M\u00e9todos de uso de micro interacciones en tu sitio por Stephen Moyers.<\/li>\n<li><a href=\"http:\/\/www.creativebloq.com\/infographic\/9-ways-use-mind-control-web-design-21619276\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Mind Control in Web Design<\/a> - 9 Formas de utilizar el control mental en el dise\u00f1o web en una infograf\u00eda simple.<\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/less-painful-prototyping-tips\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Prototyping Tips<\/a> - Haz que los prototipos sean menos dolorosos de crear con estos consejos de Charles Costa.<\/li>\n<li><a href=\"https:\/\/www.smashingmagazine.com\/2016\/02\/create-content-wireframes-for-responsive-design\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Content Wireframes for Responsive Design<\/a> - Creaci\u00f3n de wireframes de contenido para dise\u00f1o&nbsp;we adpatble - un tutorial&nbsp;por Tom Green.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"Herramientas de codificaci\u00f3n y desarrollo web\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/041.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10967\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/041.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/041.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/041-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/041-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<ul>\n<li><a href=\"http:\/\/www.imcreator.com\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Im Creator<\/a> - Es algo&nbsp;m\u00e1s que un constructor de sitios web t\u00edpico. Aqu\u00ed usas rayas y pol\u00edmeros listos para la creaci\u00f3n. No necesitas codificar y los resultados son totalmente responsive y compatibles con Google. Tambi\u00e9n&nbsp;incorpora eCommerce y blogs.<\/li>\n<li><a href=\"http:\/\/stackhive.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">StackHive<\/a> - StackHive te permite dise\u00f1ar sitios web&nbsp;adaptables y&nbsp;n\u00edtidos&nbsp;por medio de&nbsp;una interfaz de arrastrar y soltar, y genera autom\u00e1ticamente c\u00f3digos de calidad de HTML, CSS y JS. Te proporciona amplios paneles de estilo y animaci\u00f3n para controlar todos los aspectos de tu dise\u00f1o e interacciones.<\/li>\n<li><a href=\"http:\/\/raml.org\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">RAML<\/a> - Con RAML puedes ver c\u00f3mo se ve tu API a medida que lo dise\u00f1as en forma de texto plano f\u00e1cil de leer. No tienes que escribir una sola l\u00ednea de c\u00f3digo. No solo puedes perfeccionar el dise\u00f1o de tu API, sino tambi\u00e9n crear un simulacro totalmente funcional para que los clientes, socios y tus ingenieros internos puedan revisarlo y aprovecharlo.<\/li>\n<li><a href=\"http:\/\/designresearchtechniques.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Design Research Techniques<\/a> - Este es un repositorio en l\u00ednea de T\u00e9cnicas de dise\u00f1o participativo. Estas t\u00e9cnicas ayudan a desarrollar un ciclo de vida del proyecto a trav\u00e9s de la participaci\u00f3n de m\u00faltiples partes interesadas, inclyendo los usuarios o audiencias potenciales, socios o equipos internos.<\/li>\n<li><a href=\"http:\/\/www.surrealcms.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Surreal CMS<\/a> - Surreal CMS se conecta a tu sitio web a trav\u00e9s de FTP, SFTP o Amazon S3 para realizar cambios. Nunca m\u00e1s tendr\u00e1s que preocuparte por las actualizaciones. Tus clientes solo podr\u00e1n editar el contenido dentro de los elementos especificados. Se realiza un seguimiento de todos los cambios para que puedas ver lo que hacen sus clientes e incluso volver a las versiones anteriores si es necesario. Prueba gratuita de 14 d\u00edas disponible.<\/li>\n<li><a href=\"https:\/\/github.com\/adobe\/brackets\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Brackets<\/a> - Un editor de texto de c\u00f3digo abierto para dise\u00f1adores web&nbsp;que se cre\u00f3&nbsp;con Adobe en JavaScript, HTML y CSS.<\/li>\n<li><a href=\"https:\/\/www.google.com\/webdesigner\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Web Designer<\/a> - Crea dise\u00f1os atractivos e interactivos basados \u200b\u200ben HTML5 y gr\u00e1ficos animados que se pueden&nbsp;funcionar en cualquier dispositivo. Este es un paquete de dise\u00f1o completo que te permite hacer realidad cualquier visi\u00f3n. La herramienta&nbsp;se encarga de&nbsp;HTML5 y CSS3 para que puedas centrarte en crear experiencias visuales maravillosas.<\/li>\n<li><a href=\"http:\/\/responsivewebdesigntester.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Responsive Web Design Tester<\/a> - Prueba tu dise\u00f1o en cualquier dispositivo, obten una vista previa r\u00e1pida de dise\u00f1os de sitios web adaptables en los dispositivos m\u00f3viles populares.<\/li>\n<li><a href=\"http:\/\/browsershots.org\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Browser Shots<\/a> - Browsershots&nbsp;hace capturas de pantalla de tu dise\u00f1o web en diferentes sistemas operativos y navegadores. De esta manera puedes comprobar la compatibilidad&nbsp;con navegadores web de tu sitio web en un solo lugar.<\/li>\n<li><a href=\"http:\/\/fenixwebserver.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Fenix Web Server<\/a> - Fenix \u200b\u200bes un servidor web de escritorio est\u00e1tico simple. Bueno para desarrolladores y dise\u00f1adores que trabajan con sitios est\u00e1ticos. Con Fenix \u200b\u200bpuedes habilitar\/deshabilitar servidores web est\u00e1ticos, y detecta autom\u00e1ticamente los puertos disponibles. Incluye un contenedor de solicitud, tiene la compatiblidad con Growl y el renderizado de Markdown y una herramienta de l\u00ednea de comando. Te permite administrar visualmente tus sitios web locales uno al lado del otro, con miniaturas, registros y mcuho m\u00e1s, y desarrollar localmente y compartir en l\u00ednea a trav\u00e9s del canal local.<\/li>\n<li><a href=\"http:\/\/nwjs.io\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">NW.js<\/a> - NW.js te permite llamar a todos los m\u00f3dulos de Node.js directamente desde DOM y&nbsp;ofrece una nueva forma de escribir aplicaciones en HTML5, CSS3, JS y WebGL.<\/li>\n<li><a href=\"http:\/\/commercejs.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Commerce.js<\/a> - La herramienta permite crear r\u00e1pidamente hermosas experiencias de comercio electr\u00f3nico que se inician con unas pocas l\u00edneas de c\u00f3digo.<\/li>\n<li><a href=\"https:\/\/developer.mozilla.org\/en-US\/docs\/Tools\/Valence\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Valence<\/a> - Valence es un complemento experimental que permite a las herramientas para desarrolladores de Firefox depurar una mayor variedad de navegadores, no solo los navegadores basados \u200b\u200ben Gecko Firefox, Firefox para Android y Firefox OS. Los objetos de depuraci\u00f3n iniciales son Chrome en Android, Chrome Desktop y Safari en iOS.<\/li>\n<li><a href=\"https:\/\/roots.io\/bedrock\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Bedrock<\/a> - Es un boilerplate de WordPress con herramientas de desarrollo modernas, una configuraci\u00f3n m\u00e1s sencilla y una estructura de carpetas mejorada.<\/li>\n<li><a href=\"https:\/\/mjml.io\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">MJML<\/a> - MJML es un lenguaje de makup que reduce el dolor de codificar un correo electr\u00f3nico responsive. Su sintaxis sem\u00e1ntica lo hace f\u00e1cil y directo y su biblioteca de componentes&nbsp;regulares enriquecida acelera&nbsp;tu desarrollo y aclara tu c\u00f3digo base de correo electr\u00f3nico.<\/li>\n<li><a href=\"https:\/\/getfirebug.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Firebug<\/a> - La herramienta de desarrollo web m\u00e1s popular y potente que permite inspeccionar HTML y modificar el estilo y el&nbsp;layout en tiempo real. Utiliza el depurador de JavaScript avanzado disponible para cualquier navegador, analiza con precisi\u00f3n el uso y el rendimiento de la red, ampl\u00eda Firebug y a\u00f1ade algunas caracter\u00edsticas para hacer que Firebug sea a\u00fan m\u00e1s poderoso.<\/li>\n<li><a href=\"https:\/\/developers.google.com\/web\/tools\/starter-kit\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Web Starter Kit<\/a> - Web Starter Kit es una manera f\u00e1cil de&nbsp;iniciar un nuevo proyecto.&nbsp;Dispone de todos los archivos que podr\u00edas necesitar para comenzar un nuevo proyecto web, incluyendo un proceso de compilaci\u00f3n, HTML y estilos repetitivos. Se incluye un dise\u00f1o responsive en el kit.<\/li>\n<li><a href=\"http:\/\/userforge.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">UserForge<\/a> - Crea representaciones realistas de tus grupos de usuarios con menos clics que con software de dise\u00f1o o procesadores de texto, manten&nbsp;a las partes interesadas sincronizadas en todas las etapas, invita a las personas a colaborar y contribuyir al proceso de iteraci\u00f3n mediante comentarios y discusiones sinceros, o simplemente comparte la URL \u00fanica con cualquier persona para acceder a la presentaci\u00f3n de solo lectura.<\/li>\n<li><a href=\"https:\/\/kore.io\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Kore<\/a> - Kore es un marco de aplicaci\u00f3n web f\u00e1cil de usar para escribir API web escalables en C. Sus principales objetivos son la seguridad, la escalabilidad y el desarrollo y despliegue r\u00e1pido de dichos APIs.<\/li>\n<li><a href=\"http:\/\/hood.ie\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Hoodie<\/a> - Hoodie es un back-end completo para tus aplicaciones: desarrolla tu c\u00f3digo de interfaz, con\u00e9ctalo a nuestra API y disfruta de tu aplicaci\u00f3n ya hecha.<\/li>\n<li><a href=\"http:\/\/tumult.com\/hype\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Tumult Hype<\/a> - Crea contenidos web hermosos de HTML5 sin codificar. El contenido web interactivo y las animaciones&nbsp;creadas con Tumult Hype funcionan en computadoras de escritorio, tel\u00e9fonos inteligentes y iPads.<\/li>\n<li><a href=\"http:\/\/djyde.github.io\/WebShell\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">WebShell<\/a> - WebShell es una aplicaci\u00f3n web integrada a la aplicaci\u00f3n OS X sin codificaci\u00f3n.<\/li>\n<li><a href=\"https:\/\/codefights.com\/bots\/bot_uber\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">UberBot<\/a> - Si quieres comparar tus habilidades y las de tus amigos, comparte el bot para ver si pueden superarlo.<\/li>\n<li><a href=\"http:\/\/www.watchpeoplecode.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">WatchPeopleCode<\/a> - Aqu\u00ed puedes ver livestreams de personas que est\u00e1n codificando.<\/li>\n<li><a href=\"https:\/\/mobirise.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Mobirise<\/a> - Mobirise es una aplicaci\u00f3n fuera de l\u00ednea para Windows y Mac para crear f\u00e1cilmente sitios web peque\u00f1os\/medianos, p\u00e1ginas de aterrizaje, curr\u00edculos y portafolios en l\u00ednea, sitios promocionales para aplicaciones, eventos, servicios y productos.<\/li>\n<li><a href=\"http:\/\/grapesjs.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">GrapesJS<\/a> - GrapesJS es una herramienta de pr\u00f3xima generaci\u00f3n para crear plantillas sin codificar.<\/li>\n<li><a href=\"https:\/\/plyfe.me\/cms\/signup\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Plyfe<\/a> - Crea tarjetas interactivas: atrae, entiende y convierte a las audiencias con el creciente cat\u00e1logo de tarjetas interactivas de Plyfe. Simplemente elige una tarjeta interactiva, sube im\u00e1genes, videos, gifs y publ\u00edcalos en cualquier lugar.<\/li>\n<li><a href=\"http:\/\/mailmalade.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Mailmalade<\/a> - Esta herramienta permite crear r\u00e1pidamente correos electr\u00f3nicos&nbsp;de HTML compatibles con tus archivos de dise\u00f1o. Ni siquiera necesitar\u00e1s tus conocimientos de codificaci\u00f3n.<\/li>\n<li><a href=\"http:\/\/challengehunt.github.io\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Challenge Hunt<\/a> - Challenge Hunt es un concurso de programaci\u00f3n de c\u00f3digo abierto y un agregador de hackathon. Puedes ver todos los concursos de codificaci\u00f3n activos y futuros, hackathons, contrataciones y desaf\u00edos de ciencias de datos en un solo lugar.<\/li>\n<li><a href=\"https:\/\/www.lytmus.io\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Lytmus<\/a> - Lytmus es una herramienta de entrevista en vivo para personas que entrevistan a ingenieros. Realiza entrevistas para&nbsp;desarrolladores de back-end, front-end, full-stack, m\u00f3vil y analistas de productos. Elige entre 21 idiomas, 6 marcos y m\u00e1s de 10 herramientas en una computadora virtual en tu navegador.<\/li>\n<li><a href=\"https:\/\/mytips.co\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">My Tips<\/a> - Una herramienta para crear sugerencias de herramientas en pantalla oportunas y relevantes y tutoriales de productos sin codificaci\u00f3n.<\/li>\n<li><a href=\"http:\/\/etleap.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Etleap<\/a> - Esta herramienta te permite conectar todas las fuentes de datos que te interesan, analizar tus datos m\u00e1s r\u00e1pido que nunca y preocuparte nunca m\u00e1s por ETL.<\/li>\n<li><a href=\"http:\/\/code-fight.club\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Code Fight Club<\/a> - Este es un verdadero club de lucha para codificadores. Aqu\u00ed puedes votar, comentar o iniciar tu propio concurso de c\u00f3digo.<\/li>\n<li><a href=\"https:\/\/experimental-platform.github.io\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Experimental Platform<\/a> - Como eres&nbsp;desarrollador,&nbsp;puede ser divertido para ti construir algunas de las siguientes cosas con la plataforma experimental. Un indicador de calidad del aire sencillo con una luz inteligente que cambia de verde a rojo dependiendo de los niveles de CO\u2082. Temporizador de cocina basado en voz. Las c\u00e1maras de seguridad basadas en IP que se&nbsp;ponen en marcha cada vez que&nbsp;cierras tu casa con un reloj inteligente.<\/li>\n<\/ul>\n<p><strong>Herramientas de colaboraci\u00f3n para el desarrollo web<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/www.figma.com\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Figma<\/a> - Con figma puedes hacer trabajos de dise\u00f1o en l\u00ednea, trabajar con otros en el mismo dise\u00f1o y al mismo tiempo. Tu trabajo se guarda constantemente (las versiones anteriores son accesibles con un solo clic). La herramienta funciona en cualquier sistema operativo y su versi\u00f3n de Preview Release es gratuita.<\/li>\n<li><a href=\"http:\/\/simple.team\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Simple Team<\/a> - Una gran herramienta para desarrolladores y dise\u00f1adores.&nbsp;Reune&nbsp;a tu equipo&nbsp;en una sola plataforma que permite a sus miembros dise\u00f1ar, desarrollar y comunicarse.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"Lo imprescindible para desarrollador web\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/05.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10961\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/05.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/05.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/05-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/05-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<ul>\n<li><a href=\"https:\/\/www.smashingmagazine.com\/2016\/02\/getting-ready-for-http2\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Getting ready for HTTP\/2<\/a> -&nbsp;Prepararte para HTTP\/2: una gu\u00eda para dise\u00f1adores web y desarrolladores por Rachel Andrew.<\/li>\n<li><a href=\"https:\/\/www.smashingmagazine.com\/2016\/02\/everything-about-google-accelerated-mobile-pages\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Google Accelerated Mobile Pages<\/a> - Convierte&nbsp;tu AMP en 11: todo lo que necesitas saber sobre las p\u00e1ginas m\u00f3viles aceleradas de Google por Christian Cantrell.<\/li>\n<li><a href=\"https:\/\/www.keycdn.com\/blog\/improve-google-ranking\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Improve Google Ranking<\/a> - 5 Maneras de mejorar el ranking de Google en los SERP con un CDN de Brian Jackson.<\/li>\n<li><a href=\"https:\/\/aerotwist.com\/blog\/the-anatomy-of-a-frame\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">A Frame<\/a> - La anatom\u00eda de un frame de Aerotwist.<\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/cleaning-house-after-internet-explorer\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Cleaning After Internet Explorer<\/a> - Limpiar&nbsp;despu\u00e9s de Internet Explorer por Adrian Sandu.<\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/jade-tutorial-for-beginners\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Jade Tutorial for Beginners<\/a> - Un tutorial de Jade para principiantes por Sanjay Guruprasad.<\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/remote-debugging-for-front-end-developers\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Remote Debugging<\/a> - Depuraci\u00f3n remota para desarrolladores de front-end por Panayiotis Velisarakos.<\/li>\n<li><a href=\"http:\/\/bradfrost.com\/blog\/post\/frontend-design\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Frontend Design<\/a> - Dise\u00f1o de frontend&nbsp;por Brad Frost.<\/li>\n<li><a href=\"https:\/\/packtpub.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Packt Pub<\/a> - Aqu\u00ed puedes ver algunos de los libros y videos m\u00e1s nuevos, emocionantes y&nbsp;populares para dise\u00f1adores y desarrolladores que han sido elegido manualmente por los editores del sitio.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"CSS\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/061.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10968\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/061.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/061.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/061-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/061-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<p><strong>Herramientas de CSS<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/digital.com\/tools\/html-cheatsheet\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">HTML Cheat Sheet<\/a> - Esta interactiva hoja de trucos de HTML contiene una lista completa de todos los elementos de HTML, incluyendo sus descripciones, ejemplos de c\u00f3digo y vistas previas en vivo.<\/li>\n<li><a href=\"http:\/\/enjoycss.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Enjoy CSS<\/a> - Este es un generador de CSS avanzado para crear estilos gr\u00e1ficos ricos sin codificaci\u00f3n.<\/li>\n<li><a href=\"http:\/\/csstypeset.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">CSS Typeset<\/a> - Simplemente pega el texto que deseas modificar, y luego copia y pega el CSS generado en tu hoja de estilo.<\/li>\n<li><a href=\"http:\/\/bitsofco.de\/the-one-css-feature\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">One CSS Feature<\/a> - La \u00fanica funci\u00f3n de CSS que realmente queremos por bitsofcode.<\/li>\n<li><a href=\"http:\/\/codepen.io\/tmrDevelops\/pen\/VeRvKX\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Imperfect Buttons<\/a> - &nbsp;Botones de borde dibujados a mano.&nbsp;Escrito&nbsp;por Tiffany Rayside.<\/li>\n<li><a href=\"http:\/\/www.poormansstyleguide.com\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Poor Man's Styleguide<\/a> - Es una gu\u00eda de estilo de frontend r\u00e1pido y sucio, dise\u00f1ado para ser copiado y pegado en tu CMS. Si no eres Twitter Bootstrap, no tienes tiempo ni dinero para crear una biblioteca de patrones CSS din\u00e1mica personalizada, utiliza esta gu\u00eda de estilo.<\/li>\n<li><a href=\"http:\/\/vanseodesign.com\/css\/sass-placeholders\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Sass Placeholders<\/a> - Sass:&nbsp;Marcadores de posici\u00f3n y selectores de @extend-only&nbsp;por Steven Bradley.<\/li>\n<li><a href=\"http:\/\/codepen.io\/oxsouls\/pen\/EPMgLG\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Penguin<\/a> - Penguin: sin HTML, sin JS por Abdullah Abusall<\/li>\n<\/ul>\n<p><strong>Art\u00edculos sobre CSS<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/www.templatemonster.com\/startup-hub\/responsive-web-design-tutorial\/\" target=\"_blank\" rel=\"noopener noreferrer\">Responsive Web Design Tutorial<\/a> - Tutorial de dise\u00f1o web adaptable: preguntas, mitos, problemas y soluciones reales de Jeff Bell.<\/li>\n<li><a href=\"http:\/\/www.noupe.com\/development\/css-custom-properties-how-to-use-variables-in-chrome-49-95998.html\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">How to Use Variables in Chrome 49<\/a> - Propiedades personalizadas de CSS: c\u00f3mo usar variables en Chrome 49 por Ioanni Mitsakis.<\/li>\n<li><a href=\"https:\/\/css-tricks.com\/on-object-fit-and-object-position\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Object Fit and Object Position<\/a> - Una descripci\u00f3n general r\u00e1pida de `object-fit` y`object-position` por Robin Rendle.<\/li>\n<li><a href=\"http:\/\/thenewcode.com\/414\/Make-a-Dynamic-Portfolio-with-CSS-Scrolling-Snap-Points\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Dynamic Portfolio with CSS Scrolling Snap Points<\/a> - Crea un portafolio din\u00e1mico con Snap Points de desplazamiento de CSS mediante el nuevo c\u00f3digo.<\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/taking-double-trouble-pull-quotes\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Pull Quotes<\/a> - Sacando el doble problema de las citas&nbsp;por Alex Walker.<\/li>\n<li><a href=\"https:\/\/justmarkup.com\/log\/2016\/02\/theme-switcher-using-css-custom-properties\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Theme Switcher<\/a> - Cambiador&nbsp;de temas que usa propiedades personalizadas de CSS&nbsp;por Michael Scharnagl.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"JavaScript\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/07.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10962\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/07.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/07.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/07-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/07-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<p><strong>Herramientas de JS<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/sivehttp:\/\/mern.io\/rs.org\/learn-js\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Learn JS<\/a> - C\u00f3mo aprender JavaScript por Derek Sivers.<\/li>\n<li><a href=\"http:\/\/mern.io\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">MERN<\/a> - MERN es una herramienta que facilita la creaci\u00f3n de aplicaciones isom\u00f3rficas utilizando Mongo, Express, React y NodeJS. Minimiza el tiempo de configuraci\u00f3n y lo pone al d\u00eda con las tecnolog\u00edas probadas.<\/li>\n<li><a href=\"http:\/\/www.real-world-ember.com\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Ember<\/a> - Programaci\u00f3n funcional en Ember - Jeffrey Biles entrevista a talentosos desarrolladores de Ember de todo el mundo, compartiendo sus desaf\u00edos, pasiones y triunfos.<\/li>\n<\/ul>\n<p><strong>Art\u00edculos sobre JS<\/strong><\/p>\n<ul>\n<li><a href=\"http:\/\/www.sitepoint.com\/generating-pdfs-from-web-pages-on-the-fly-with-jspdf\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Generating PDFs from Web Pages<\/a> - &nbsp;Generaci\u00f3n de archivos PDF de p\u00e1ginas web sobre la marcha con jsPDF por Massimo Cassandro.<\/li>\n<li><a href=\"https:\/\/medium.com\/developers-writing\/animating-the-unanimatable-1346a5aab3cd#.ntjxraeu0\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Animating the Unanimatable<\/a> - Animar lo inanimado. Transiciones suaves de reordenamiento en React.js por Joshua Comeau.<\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/how-to-consume-laravel-api-with-angularjs\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Consuming Laravel API with AngularJS<\/a> - C\u00f3mo consumir Laravel API con AngularJS por Francesco Malatesta.<\/li>\n<li><a href=\"https:\/\/github.com\/johnpapa\/angular-styleguide\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Angular Styleguide<\/a> - Un punto de partida para los equipos de desarrollo de Angular.<\/li>\n<li><a href=\"http:\/\/www.c-sharpcorner.com\/blogs\/call-rest-service-in-angularjs\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Rest Service in AngularJS<\/a> -&nbsp;Llamar Rest Service&nbsp;en AngularJS&nbsp;por Gul Md Ershad.<\/li>\n<li><a href=\"http:\/\/www.telerik.com\/blogs\/angularjs-developer-tools-list\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Building SPAs with AngularJS<\/a> - Herramientas esenciales para construir SPAs con AngularJS por Nora Georgieva.<\/li>\n<li><a href=\"https:\/\/medium.com\/tech-quizlet\/smooth-game-animations-in-react-df43ece916c8#.pljzm2kve\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Animations in React<\/a> - Suaves animaciones de juego en React&nbsp;por Jen Liu.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"ES6\"><\/a><\/p>\n<p><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/08.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10963\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/08.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/08.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/08-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/08-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><br \/>\n<strong>Herramientas de&nbsp;<\/strong><strong>ES6<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/duckduckgo.com\/?q=es6+cheatsheet&amp;ia=answer&amp;iax=1\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">ES6<\/a> - Lista de trucos de ES6.<\/li>\n<li><a href=\"https:\/\/github.com\/liady\/es6-library-minimal\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">ES6 Library<\/a> -&nbsp;Lo&nbsp;m\u00ednimo para una biblioteca ES6.<\/li>\n<li><a href=\"https:\/\/descartes.io\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Descartes<\/a> - Descartes es una biblioteca experimental para escribir CSS en JavaScript para programadores.<\/li>\n<li><a href=\"https:\/\/github.com\/fergiemcdowall\/search-index\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Search Index<\/a> - \u00cdndice de b\u00fasqueda es un motor de b\u00fasqueda de texto persistente para el navegador y Node.js.<\/li>\n<\/ul>\n<p><strong>Art\u00edculos sobre ES6<\/strong><\/p>\n<ul>\n<li><a href=\"https:\/\/spin.atomicobject.com\/2016\/02\/16\/how-javascript-promises-work\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">JavaScript Promises<\/a> - JavaScript Promises - c\u00f3mo funcionan por Matt Behrens.<\/li>\n<li><a href=\"https:\/\/dzone.com\/articles\/javascript-how-to-define-process-a-promise-object\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">JS Promise Object<\/a> - C\u00f3mo definir y procesar&nbsp;JS Promise Object por Ajitesh Kumar.<\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/sending-emails-gmail-javascript-api\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Emails with Gmail JavaScript API<\/a> - Env\u00edo de correos electr\u00f3nicos con la API de JavaScript de Gmail por Jamie Shields.<\/li>\n<li><a href=\"http:\/\/www.sitepoint.com\/ajaxjquery-getjson-simple-example\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\" class=\"broken_link\">Ajax\/jQuery.getJSON Example<\/a> - Ejemplo sencillo de Ajax\/jQuery.getJSON&nbsp;por Florian Rappl.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"Plugins\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/09.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10964\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/09.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/09.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/09-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/09-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<ul>\n<li><a href=\"https:\/\/wakatime.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Waka Time<\/a> - Este es un complemento para cuantificar tu codificaci\u00f3n. Las m\u00e9tricas, las estad\u00edsticas y el seguimiento del tiempo se generan autom\u00e1ticamente sobre la base de&nbsp;tu actividad de programaci\u00f3n.<\/li>\n<li><a href=\"http:\/\/callmecavs.com\/bricks.js\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Bricks.js<\/a> - Un generador r\u00e1pido de mamposter\u00eda para elementos de ancho fijo.<\/li>\n<li><a href=\"https:\/\/github.com\/VPenkov\/okayNav\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">okayNav jQuery Plugin<\/a> - Este complemento&nbsp;se dedica a colapsar progresivamente los enlaces de navegaci\u00f3n en una navegaci\u00f3n fuera de la pantalla en lugar de hacerlo para todos los enlaces al mismo tiempo.<\/li>\n<li><a href=\"https:\/\/github.com\/atayahmet\/jquery.easypin\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">jQuery easypin<\/a> -&nbsp;Un plugin sencillo y r\u00e1pido que fija objetos en las im\u00e1genes.<\/li>\n<li><a href=\"http:\/\/design.iamvdo.me\/stickyElements\/\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Sticky Elements<\/a> - Crea elementos adhesivos y enlaces adhesivos.<\/li>\n<\/ul>\n<hr>\n<p><a name=\"Jugar y aprender a codificar\"><\/a><\/p>\n<p style=\"text-align: center\"><a href=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/10.jpg\"><img decoding=\"async\" loading=\"lazy\" class=\"aligncenter size-full wp-image-10965\" src=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/10.jpg\" alt=\"\" width=\"670\" height=\"400\" srcset=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/10.jpg 670w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/10-300x179.jpg 300w, https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/10-335x200.jpg 335w\" sizes=\"(max-width: 670px) 100vw, 670px\" \/><\/a><\/p>\n<ul>\n<li><a href=\"http:\/\/boxislandgame.com\/hourofcode\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Hour of Code<\/a> - En esta edici\u00f3n especial de Hora de c\u00f3digo de Box Island, t\u00fa\/tus hijos aprender\u00e1n los conceptos b\u00e1sicos de algoritmos, secuencias, bucles y condicionales. El tutorial es dirigido por los estudiantes y adecuado para todas las edades.<\/li>\n<li><a href=\"https:\/\/www.codingame.com\/start\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Codingame<\/a> - Aprende y mejora tus habilidades de codificaci\u00f3n mientras juegas.<\/li>\n<li><a href=\"https:\/\/www.gethopscotch.com\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">Hopscotch<\/a> - Explora los fundamentos de CS como abstracci\u00f3n, variables, condicionales, bucles y m\u00e1s, mientras haces cosas divertidas.<\/li>\n<li><a href=\"https:\/\/meteor.toys\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">MeteorToys<\/a> -&nbsp;Herramientas incre\u00edblemente \u00fatiles de desarrollo&nbsp;que ayudan a crear excelentes aplicaciones. El uso de MeteorToys aumenta la velocidad de tu&nbsp;soluci\u00f3n de&nbsp;problemas y te ayuda a crear soluciones m\u00e1s r\u00e1pidas y funcionales.<\/li>\n<li><a href=\"http:\/\/www.scratchjr.org\" target=\"_blank\" rel=\"noopener noreferrer nofollow\">ScratchJr<\/a> - Con ScratchJr incluso los ni\u00f1os peque\u00f1os pueden programar sus propias historias y juegos interactivos.&nbsp;Durante el proceso aprenden a resolver problemas, dise\u00f1ar proyectos y expresarse creativamente&nbsp;con sus computadoras. Adecuado para ni\u00f1os de 5-7 a\u00f1os.<\/li>\n<\/ul>\n<hr>\n<p>Fuente: \"<a href=\"https:\/\/monsterspost.com\/free-web-development-tools-and-design-resources\/\" target=\"_blank\" rel=\"noopener noreferrer\">New Free Web Design Tools &amp; Resources Shortcut. Design is Easy if You Do it Smart!<\/a>\" por Helga Moreno<\/p>\n","protected":false},"excerpt":{"rendered":"<p>\u00bfEs posible que tengas demasiadas herramientas gratuitas para acelerar\/mejorar tu proceso de dise\u00f1o web? Por supuesto no es posible, a medida que nuevas tecnolog\u00edas avanzadas aparecen todos los d\u00edas. Y todos los d\u00edas los desarrolladores web&nbsp;descubren&nbsp;algo interesante y novedoso. Pero&nbsp;se tarda mucho tiempo en buscar contenidos relevantes en la red.<\/p>\n","protected":false},"author":1334762,"featured_media":10969,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[26,5],"tags":[126],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v19.11 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web<\/title>\n<meta name=\"description\" content=\"En esta entrada te ofrecemos 137 herramientas y recursos gratuitos de desarrollo web que podr\u00edan interesar a los dise\u00f1adores y desarrolladores web.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web\" \/>\n<meta property=\"og:description\" content=\"En esta entrada te ofrecemos 137 herramientas y recursos gratuitos de desarrollo web que podr\u00edan interesar a los dise\u00f1adores y desarrolladores web.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog de TemplateMonster\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/TemplateMonsterEspana\" \/>\n<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/profile.php?id=100004881674652\" \/>\n<meta property=\"article:published_time\" content=\"2018-06-13T08:34:33+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2022-09-12T13:19:48+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/featured_image8.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"900\" \/>\n\t<meta property=\"og:image:height\" content=\"538\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Diane Parks\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@TMonster_ES\" \/>\n<meta name=\"twitter:site\" content=\"@TMonster_ES\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Diane Parks\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"20 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/\"},\"author\":{\"name\":\"Diane Parks\",\"@id\":\"https:\/\/monsterspost.com\/es\/#\/schema\/person\/9347a229c99d039260b529468e03bb3c\"},\"headline\":\"Nueva selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web. \u00a1El dise\u00f1o es f\u00e1cil si lo haces de manera inteligente!\",\"datePublished\":\"2018-06-13T08:34:33+00:00\",\"dateModified\":\"2022-09-12T13:19:48+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/\"},\"wordCount\":4762,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/monsterspost.com\/es\/#organization\"},\"keywords\":[\"recursos gratis\"],\"articleSection\":[\"Desarrollo web\",\"Gratis\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/\",\"url\":\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/\",\"name\":\"Selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web\",\"isPartOf\":{\"@id\":\"https:\/\/monsterspost.com\/es\/#website\"},\"datePublished\":\"2018-06-13T08:34:33+00:00\",\"dateModified\":\"2022-09-12T13:19:48+00:00\",\"description\":\"En esta entrada te ofrecemos 137 herramientas y recursos gratuitos de desarrollo web que podr\u00edan interesar a los dise\u00f1adores y desarrolladores web.\",\"breadcrumb\":{\"@id\":\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/monsterspost.com\/es\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Nueva selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web. \u00a1El dise\u00f1o es f\u00e1cil si lo haces de manera inteligente!\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/monsterspost.com\/es\/#website\",\"url\":\"https:\/\/monsterspost.com\/es\/\",\"name\":\"Blog de TemplateMonster\",\"description\":\"Just another MonsterPost Sites site\",\"publisher\":{\"@id\":\"https:\/\/monsterspost.com\/es\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/monsterspost.com\/es\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/monsterspost.com\/es\/#organization\",\"name\":\"MonstersPost Espa\u00f1a\",\"url\":\"https:\/\/monsterspost.com\/es\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/monsterspost.com\/es\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2020\/03\/Logo-TM.png\",\"contentUrl\":\"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2020\/03\/Logo-TM.png\",\"width\":180,\"height\":180,\"caption\":\"MonstersPost Espa\u00f1a\"},\"image\":{\"@id\":\"https:\/\/monsterspost.com\/es\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.instagram.com\/template_monster\/\",\"https:\/\/www.pinterest.com\/templatemonster\/\",\"https:\/\/www.youtube.com\/user\/TemplateMonsterCo\/\",\"https:\/\/www.facebook.com\/TemplateMonsterEspana\",\"https:\/\/twitter.com\/TMonster_ES\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/monsterspost.com\/es\/#\/schema\/person\/9347a229c99d039260b529468e03bb3c\",\"name\":\"Diane Parks\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/monsterspost.com\/es\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/9dc57114df7de4f9c97b5d1f73e7c5ff?s=96&d=https%3A%2F%2Fmonsterspost.com%2Fwp-content%2Fthemes%2Fredesign%2Fimages%2Fdefault_avatar.jpg&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/9dc57114df7de4f9c97b5d1f73e7c5ff?s=96&d=https%3A%2F%2Fmonsterspost.com%2Fwp-content%2Fthemes%2Fredesign%2Fimages%2Fdefault_avatar.jpg&r=g\",\"caption\":\"Diane Parks\"},\"description\":\"Diane trabja como una redactora del blog MonsterPost Espa\u00f1a desde hace muchos a\u00f1os. No imagina su vida sin escribir, aprender algo nuevo cada d\u00eda, desarollarse personalmente y profesionalmente, y compartir sus conocimientos y experiencia con los lectores del blog. \u00a1S\u00edguela en Facebook!\",\"sameAs\":[\"https:\/\/www.facebook.com\/profile.php?id=100004881674652\"],\"url\":\"https:\/\/monsterspost.com\/es\/author\/diane\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web","description":"En esta entrada te ofrecemos 137 herramientas y recursos gratuitos de desarrollo web que podr\u00edan interesar a los dise\u00f1adores y desarrolladores web.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/","og_locale":"es_ES","og_type":"article","og_title":"Selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web","og_description":"En esta entrada te ofrecemos 137 herramientas y recursos gratuitos de desarrollo web que podr\u00edan interesar a los dise\u00f1adores y desarrolladores web.","og_url":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/","og_site_name":"Blog de TemplateMonster","article_publisher":"https:\/\/www.facebook.com\/TemplateMonsterEspana","article_author":"https:\/\/www.facebook.com\/profile.php?id=100004881674652","article_published_time":"2018-06-13T08:34:33+00:00","article_modified_time":"2022-09-12T13:19:48+00:00","og_image":[{"width":900,"height":538,"url":"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2018\/06\/featured_image8.jpg","type":"image\/jpeg"}],"author":"Diane Parks","twitter_card":"summary_large_image","twitter_creator":"@TMonster_ES","twitter_site":"@TMonster_ES","twitter_misc":{"Escrito por":"Diane Parks","Tiempo de lectura":"20 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#article","isPartOf":{"@id":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/"},"author":{"name":"Diane Parks","@id":"https:\/\/monsterspost.com\/es\/#\/schema\/person\/9347a229c99d039260b529468e03bb3c"},"headline":"Nueva selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web. \u00a1El dise\u00f1o es f\u00e1cil si lo haces de manera inteligente!","datePublished":"2018-06-13T08:34:33+00:00","dateModified":"2022-09-12T13:19:48+00:00","mainEntityOfPage":{"@id":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/"},"wordCount":4762,"commentCount":0,"publisher":{"@id":"https:\/\/monsterspost.com\/es\/#organization"},"keywords":["recursos gratis"],"articleSection":["Desarrollo web","Gratis"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/","url":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/","name":"Selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web","isPartOf":{"@id":"https:\/\/monsterspost.com\/es\/#website"},"datePublished":"2018-06-13T08:34:33+00:00","dateModified":"2022-09-12T13:19:48+00:00","description":"En esta entrada te ofrecemos 137 herramientas y recursos gratuitos de desarrollo web que podr\u00edan interesar a los dise\u00f1adores y desarrolladores web.","breadcrumb":{"@id":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/monsterspost.com\/es\/nueva-seleccion-herramientas-recursos-gratuitos-diseno-web-diseno-facil-lo-haces-manera-inteligente\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/monsterspost.com\/es\/"},{"@type":"ListItem","position":2,"name":"Nueva selecci\u00f3n de herramientas y recursos gratuitos de dise\u00f1o web. \u00a1El dise\u00f1o es f\u00e1cil si lo haces de manera inteligente!"}]},{"@type":"WebSite","@id":"https:\/\/monsterspost.com\/es\/#website","url":"https:\/\/monsterspost.com\/es\/","name":"Blog de TemplateMonster","description":"Just another MonsterPost Sites site","publisher":{"@id":"https:\/\/monsterspost.com\/es\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/monsterspost.com\/es\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/monsterspost.com\/es\/#organization","name":"MonstersPost Espa\u00f1a","url":"https:\/\/monsterspost.com\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/monsterspost.com\/es\/#\/schema\/logo\/image\/","url":"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2020\/03\/Logo-TM.png","contentUrl":"https:\/\/monsterspost.com\/es\/wp-content\/uploads\/sites\/4\/2020\/03\/Logo-TM.png","width":180,"height":180,"caption":"MonstersPost Espa\u00f1a"},"image":{"@id":"https:\/\/monsterspost.com\/es\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.instagram.com\/template_monster\/","https:\/\/www.pinterest.com\/templatemonster\/","https:\/\/www.youtube.com\/user\/TemplateMonsterCo\/","https:\/\/www.facebook.com\/TemplateMonsterEspana","https:\/\/twitter.com\/TMonster_ES"]},{"@type":"Person","@id":"https:\/\/monsterspost.com\/es\/#\/schema\/person\/9347a229c99d039260b529468e03bb3c","name":"Diane Parks","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/monsterspost.com\/es\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/9dc57114df7de4f9c97b5d1f73e7c5ff?s=96&d=https%3A%2F%2Fmonsterspost.com%2Fwp-content%2Fthemes%2Fredesign%2Fimages%2Fdefault_avatar.jpg&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/9dc57114df7de4f9c97b5d1f73e7c5ff?s=96&d=https%3A%2F%2Fmonsterspost.com%2Fwp-content%2Fthemes%2Fredesign%2Fimages%2Fdefault_avatar.jpg&r=g","caption":"Diane Parks"},"description":"Diane trabja como una redactora del blog MonsterPost Espa\u00f1a desde hace muchos a\u00f1os. No imagina su vida sin escribir, aprender algo nuevo cada d\u00eda, desarollarse personalmente y profesionalmente, y compartir sus conocimientos y experiencia con los lectores del blog. \u00a1S\u00edguela en Facebook!","sameAs":["https:\/\/www.facebook.com\/profile.php?id=100004881674652"],"url":"https:\/\/monsterspost.com\/es\/author\/diane\/"}]}},"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/posts\/10952"}],"collection":[{"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/users\/1334762"}],"replies":[{"embeddable":true,"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/comments?post=10952"}],"version-history":[{"count":9,"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/posts\/10952\/revisions"}],"predecessor-version":[{"id":25653,"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/posts\/10952\/revisions\/25653"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/media\/10969"}],"wp:attachment":[{"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/media?parent=10952"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/categories?post=10952"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/monsterspost.com\/es\/wp-json\/wp\/v2\/tags?post=10952"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}