{"id":3305,"date":"2020-12-18T13:00:00","date_gmt":"2020-12-18T12:00:00","guid":{"rendered":"https:\/\/carontestudio.com\/blog\/?p=3305"},"modified":"2021-09-23T11:16:03","modified_gmt":"2021-09-23T09:16:03","slug":"como-crear-un-prototipo-web-online","status":"publish","type":"post","link":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/","title":{"rendered":"C\u00f3mo crear un prototipo web online"},"content":{"rendered":"\n<p>Si est\u00e1s buscando crear un <strong>prototipo web <\/strong><em><strong>online<\/strong> <\/em>es muy probable que te encuentres en pleno proceso creativo. Concretamente en una de las etapas iniciales m\u00e1s importantes y determinantes del proceso de creaci\u00f3n de una web.  Por eso, si quieres averiguar qu\u00e9 es el prototipado y <strong>c\u00f3mo crear un prototipo web <em>online<\/em><\/strong>, hoy despejaremos tus dudas. \u00a1Vamos a ello!<\/p>\n\n\n\n<!--more-->\n\n\n\n<p>En el presente art\u00edculo no solo abordaremos el concepto de prototipado y su proceso m\u00e1s com\u00fan, sino que tambi\u00e9n te sugeriremos varias de las mejores herramientas para crear un prototipo web <em>online <\/em>o de manera local. En cualquier caso, comencemos por el principio.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Qu\u00e9 es el prototipado web<\/h2>\n\n\n\n<p>Lo que muchos usuarios no tienen en cuenta acerca del proceso creativo de una web, es la planificaci\u00f3n del desarrollo. Un sitio web requiere de una estructura, distribuci\u00f3n y flujo de informaci\u00f3n correctamente definidos. De esta manera, es posible disponer de manera coherente nuestro contenido y mejorar la experiencia de usuario. Adem\u00e1s, facilitaremos el guiado del usuario a nuestros objetivos o llamadas a la acci\u00f3n determinadas, como, por ejemplo, que contacten con nosotros o compren nuestros productos.<\/p>\n\n\n\n<div class=\"row\"><div class=\"col-md-4 visible-md visible-lg\"><p class=\"lead\">Una buena web requiere planificaci\u00f3n: Estructura, distribuci\u00f3n, flujo de informaci\u00f3n&#8230;<\/p><\/div><div class=\"col-xs-12 col-sm-7 col-md-4\">\n\n\n\n<p>Por otro lado, no podemos olvidar que un correcto prototipado puede facilitar en sobremanera nuestra posterior tarea SEO. Por eso, nuestra labor como dise\u00f1adores es procurar ofrecer un prototipo web lo m\u00e1s l\u00f3gico y comprensible posible.<\/p>\n\n\n\n<\/div><div class=\"col-xs-12 col-sm-5 col-md-4\"><div class=\"left-divider\"><div class=\"slogan-filled-small\">Trabajar el prototipo<\/div><div class=\"slogan-filled-small\">facilita el trabajo<\/div><div class=\"slogan-outlined-big\">SEO<\/div><\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">Para qu\u00e9 sirve un prototipado web<\/h2>\n\n\n\n<p>Como bien dec\u00edamos al inicio del art\u00edculo, el prototipado es un boceto del sitio web. Forma parte del proceso creativo de una web y, m\u00e1s concretamente, del inicio de este. No obstante, cabe recalcar que el prototipado es el proceso posterior al \u00abWireframe\u00bb. En dicho proceso se realiza un esquema basado \u00fanicamente en l\u00edneas, como su propio nombre indica. En el <em>wireframe <\/em>se indica c\u00f3mo se dispondr\u00e1 el contenido en cada p\u00e1gina de nuestra web: los elementos interactivos, textos, im\u00e1genes y videos, etc. Adem\u00e1s, las distintas secciones esquematizadas en el <em>wireframe<\/em>,<em> <\/em>se enlazan entre s\u00ed para indicar la navegaci\u00f3n entre ellas.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Herramientas para prototipos web online<\/h2>\n\n\n\n<p>Existen varios programas para prototipar, pero aqu\u00ed vamos a analizar algunos de los sitios webs que nos permiten <strong>hacer prototipos web <em>online<\/em><\/strong>, con opciones muy interesantes.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">InVision<\/h3>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p><a href=\"https:\/\/www.invisionapp.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">InVision<\/a> es una de las herramientas de prototipado m\u00e1s conocidas. Que no te enga\u00f1e su dise\u00f1o minimalista: Con ella podremos crear un prototipo web que incluya animaciones y diagramas. No solo nos servir\u00e1 para nuestra p\u00e1gina web, sino que, adem\u00e1s, podremos hacer prototipos de aplicaciones m\u00f3viles. InVision revolucion\u00f3 las herramientas de prototipado presentando una nueva forma de gesti\u00f3n de proyectos, fase a fase.<\/p>\n\n\n\n<p>Una de sus ventajas es la <strong>sincronizaci\u00f3n con otras herramientas<\/strong> como Photoshop, lo que agiliza y facilita el trabajo. Su interfaz es muy intuitiva y permite trabajar online en tiempo real, agilizando el flujo de trabajo.<\/p>\n\n\n\n<p>InVision dispone de una <strong>opci\u00f3n gratuita de prueba<\/strong> con algunas limitaciones, como el n\u00famero de usuarios y proyectos, restringidos a 3. Suficiente para probar y ver si hace falta dar el salto a las suscripciones de pago.<\/p>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"734\" height=\"708\" src=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/anotaciones-invision.jpg\" alt=\"Anotaciones InVision\" class=\"wp-image-3340\" srcset=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/anotaciones-invision.jpg 734w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/anotaciones-invision-300x289.jpg 300w\" sizes=\"auto, (max-width: 734px) 100vw, 734px\" \/><\/figure>\n<\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-image solidline\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"563\" src=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipo-web-invision-1024x563.jpg\" alt=\"Prototipo web InVision\" class=\"wp-image-3337\" srcset=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipo-web-invision-1024x563.jpg 1024w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipo-web-invision-300x165.jpg 300w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipo-web-invision-768x422.jpg 768w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipo-web-invision.jpg 1413w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption>Prototipado web con InVision<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Adobe XD<\/h3>\n\n\n\n<p>\u00bfHace falta explicar qui\u00e9n es Adobe? El rey indiscutible de los programas de dise\u00f1o no pod\u00eda dejar pasar la ocasi\u00f3n de presentar su propio software de prototipado. Se trata de <a href=\"https:\/\/www.adobe.com\/es\/products\/xd.html\" target=\"_blank\" rel=\"noreferrer noopener\">Adobe XD<\/a>, una herramienta de <strong>prototipado de p\u00e1ginas web y aplicaciones m\u00f3viles<\/strong> muy completa y cuidada, como todos los trabajos de Adobe.<\/p>\n\n\n\n<p>Como imaginar\u00e1s, la principal ventaja de esta aplicaci\u00f3n es que, al pertenecer a Adobe, permite una comunicaci\u00f3n e interacci\u00f3n excepcional con el resto del <em>software <\/em>del fabricante, como Illustrator o After Effects.<\/p>\n\n\n\n<p>Evidentemente sus ventajas no acaban ah\u00ed: Puedes <strong>dise\u00f1ar en tiempo real<\/strong>, permitiendo la colaboraci\u00f3n entre varios usuarios; La <strong>interactividad <\/strong>de los prototipos te permitir\u00e1n no solo crear animaciones, sino, tambi\u00e9n, elementos interactivos que te dar\u00e1n una visi\u00f3n muy fiel a c\u00f3mo quedar\u00e1 la web o aplicaci\u00f3n; Puedes acompa\u00f1ar los dise\u00f1os de <strong>comentarios <\/strong>e indicaciones; Permite probar los bocetos web en diferentes dispositivos&#8230; Todo ello con una interfaz cuidada e intuitiva, con el sello de Adobe.<\/p>\n\n\n\n<div class=\"wp-block-image solidline\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"385\" src=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-adobe-xd-1024x385.jpg\" alt=\"Prototipado web con Adobe XD\" class=\"wp-image-3333\" srcset=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-adobe-xd-1024x385.jpg 1024w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-adobe-xd-300x113.jpg 300w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-adobe-xd-768x289.jpg 768w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-adobe-xd-1536x578.jpg 1536w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-adobe-xd.jpg 1727w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption>Prototipado web con Adobe XD<\/figcaption><\/figure><\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Moqups<\/h3>\n\n\n\n<div class=\"wp-block-columns is-layout-flex wp-container-core-columns-is-layout-9d6595d7 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<p>Una opci\u00f3n muy c\u00f3moda es <a href=\"https:\/\/moqups.com\/\">Moqups<\/a>. Su plataforma nos facilita la creaci\u00f3n de prototipos <strong>totalmente online<\/strong> y, lo mejor de todo, no es necesario instalar ning\u00fan <em>plugin <\/em>ni aplicaci\u00f3n. Adem\u00e1s cuenta con una opci\u00f3n gratuita, con la que podemos crear proyectos sencillos con ciertas restricciones (n\u00ba de objetos y tama\u00f1o de proyecto). Si esta opci\u00f3n se nos queda peque\u00f1a tenemos una serie de opciones de membres\u00eda con pago mensual.<\/p>\n\n\n\n<p>Su aspecto y herramientas hacen que su uso sea <strong>f\u00e1cil e intuitivo<\/strong>, similar a otros programas de dise\u00f1o. Sus opciones permiten crear una maqueta de c\u00f3mo quedar\u00e1 el proyecto web final, con un resultado m\u00e1s que bueno. Moqups pone a tu disposici\u00f3n una serie de botones y <strong>elementos predise\u00f1ados<\/strong> que te facilitar\u00e1n, a\u00fan m\u00e1s, el dise\u00f1o de tu p\u00e1gina web. Todo esto hace que podamos tener un prototipo web online en muy poco tiempo y con un ahorro considerable de esfuerzo.<\/p>\n\n\n\n<p>Moqups tambi\u00e9n dispone de una <a href=\"https:\/\/chrome.google.com\/webstore\/detail\/moqups-%C2%B7-mockups-wirefram\/nlfbhphohgafllkjnakmdppmmkjfbnke\" target=\"_blank\" rel=\"noreferrer noopener\">extensi\u00f3n para Google Chrome<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large solidline\"><img loading=\"lazy\" decoding=\"async\" width=\"919\" height=\"509\" src=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/moqups-interfaz.jpg\" alt=\"Moqups dise\u00f1o web\" class=\"wp-image-3343\" srcset=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/moqups-interfaz.jpg 919w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/moqups-interfaz-300x166.jpg 300w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/moqups-interfaz-768x425.jpg 768w\" sizes=\"auto, (max-width: 919px) 100vw, 919px\" \/><figcaption>Interfaz de Moqups<\/figcaption><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\">\n<div class=\"wp-block-cover\" style=\"background-image:url(https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/moqups-image.jpg)\"><div class=\"wp-block-cover__inner-container is-layout-flow wp-block-cover-is-layout-flow\">\n<p class=\"has-text-align-center has-large-font-size\"><\/p>\n<\/div><\/div>\n<\/div>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\">MockFlow<\/h3>\n\n\n\n<p><a href=\"https:\/\/mockflow.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">MockFlow<\/a> te da la opci\u00f3n de trabajar online desde su plataforma web o instalar su aplicaci\u00f3n en tu ordenador personal. Escojas la opci\u00f3n que escojas tendr\u00e1s en tu mano una herramienta ideal para el prototipado web y de aplicaciones m\u00f3viles. Sus <strong>elementos predise\u00f1ados <\/strong>te ahorrar\u00e1n una buena cantidad de tiempo. No solo se trata de botones y elementos sueltos, sino que dispone de <strong>temas<\/strong> que presentan conjuntos coherentes de elementos dise\u00f1ados.<\/p>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"376\" src=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-mockflow-1024x376.jpg\" alt=\"Temas para prototipado web con MockFlow\" class=\"wp-image-3330\" srcset=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-mockflow-1024x376.jpg 1024w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-mockflow-300x110.jpg 300w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-mockflow-768x282.jpg 768w, https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/prototipado-web-mockflow.jpg 1243w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><figcaption>Temas predefinidos para prototipado web<\/figcaption><\/figure><\/div>\n\n\n\n<p>El <strong>trabajo en equipo <\/strong>es un punto que han cuidado al dise\u00f1ar esta herramienta de prototipado, trabajando en la nube y organizando roles de usuario con diferentes permisos de uso. Gracias a ello los participantes pueden trabajar en tiempo real, compartir comentarios y realizar aprobaciones de dise\u00f1o.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusi\u00f3n<\/h2>\n\n\n\n<p>Como expertos en <a href=\"https:\/\/carontestudio.com\/diseno-web\/diseno-web-vitoria\">dise\u00f1o web<\/a>, podemos asegurar que un buen proyecto web pasa, indudablemente, por una fase de prototipado. No dejes que las prisas te hagan saltar este paso fundamental. Con la ayuda de estas herramientas de prototipado web conseguir\u00e1s, en poco tiempo, un boceto web que te ahorrar\u00e1 tiempo y esfuerzo posteriores&#8230; e inesperadas sorpresas. \u00bfCu\u00e1l es tu herramienta favorita?<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Si quieres averiguar qu\u00e9 es el prototipado y c\u00f3mo crear un prototipo web online, hoy despejaremos tus dudas. \u00a1Vamos a ello!<\/p>\n","protected":false},"author":3,"featured_media":3349,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[53,94],"tags":[],"class_list":["post-3305","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-diseno-grafico","category-diseno-web"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.5 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>C\u00f3mo crear un prototipo web online - Caronte Web Studio<\/title>\n<meta name=\"description\" content=\"Si quieres averiguar qu\u00e9 es el prototipado y c\u00f3mo crear un prototipo web online, hoy despejaremos tus dudas. \u00a1Vamos a ello!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"C\u00f3mo crear un prototipo web online - Caronte Web Studio\" \/>\n<meta property=\"og:description\" content=\"Si quieres averiguar qu\u00e9 es el prototipado y c\u00f3mo crear un prototipo web online, hoy despejaremos tus dudas. \u00a1Vamos a ello!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/\" \/>\n<meta property=\"og:site_name\" content=\"Blog de maketing | Caronte\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/carontewebstudio\/\" \/>\n<meta property=\"article:published_time\" content=\"2020-12-18T12:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2021-09-23T09:16:03+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/como-crear-prototipo-web-online.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1250\" \/>\n\t<meta property=\"og:image:height\" content=\"737\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"David de Lamo\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"David de Lamo\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"6 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/\"},\"author\":{\"name\":\"David de Lamo\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#\\\/schema\\\/person\\\/2104191b75663e9e9ca47f821c5f92cf\"},\"headline\":\"C\u00f3mo crear un prototipo web online\",\"datePublished\":\"2020-12-18T12:00:00+00:00\",\"dateModified\":\"2021-09-23T09:16:03+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/\"},\"wordCount\":1133,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/como-crear-prototipo-web-online.jpg\",\"articleSection\":[\"Dise\u00f1o gr\u00e1fico\",\"Dise\u00f1o web\"],\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/\",\"url\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/\",\"name\":\"C\u00f3mo crear un prototipo web online - Caronte Web Studio\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/como-crear-prototipo-web-online.jpg\",\"datePublished\":\"2020-12-18T12:00:00+00:00\",\"dateModified\":\"2021-09-23T09:16:03+00:00\",\"description\":\"Si quieres averiguar qu\u00e9 es el prototipado y c\u00f3mo crear un prototipo web online, hoy despejaremos tus dudas. \u00a1Vamos a ello!\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/#primaryimage\",\"url\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/como-crear-prototipo-web-online.jpg\",\"contentUrl\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/wp-content\\\/uploads\\\/2020\\\/12\\\/como-crear-prototipo-web-online.jpg\",\"width\":1250,\"height\":737,\"caption\":\"C\u00f3mo crear prototipo web online\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/como-crear-un-prototipo-web-online\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Portada\",\"item\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"C\u00f3mo crear un prototipo web online\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/\",\"name\":\"Blog de marketing | Caronte\",\"description\":\"En nuestro blog encontrar\u00e1s art\u00edculos semanales sobre SEO, marketing online, programaci\u00f3n web y mucho m\u00e1s.\",\"publisher\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#organization\",\"name\":\"Caronte - Agencia de marketing\",\"url\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/wp-content\\\/uploads\\\/2025\\\/06\\\/caronte-agencia-de-marketing-logo.png\",\"contentUrl\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/wp-content\\\/uploads\\\/2025\\\/06\\\/caronte-agencia-de-marketing-logo.png\",\"width\":1090,\"height\":155,\"caption\":\"Caronte - Agencia de marketing\"},\"image\":{\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/carontewebstudio\\\/\",\"https:\\\/\\\/www.instagram.com\\\/caronte_studio\\\/\",\"https:\\\/\\\/www.tiktok.com\\\/@carontewebstudio\",\"https:\\\/\\\/www.youtube.com\\\/@carontewebstudio\",\"https:\\\/\\\/es.linkedin.com\\\/company\\\/carontewebstudio\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/#\\\/schema\\\/person\\\/2104191b75663e9e9ca47f821c5f92cf\",\"name\":\"David de Lamo\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/110df00c652880b6b00cc45fe489d819ac3f1e805e379a5adefc8fce4d1f548c?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/110df00c652880b6b00cc45fe489d819ac3f1e805e379a5adefc8fce4d1f548c?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/110df00c652880b6b00cc45fe489d819ac3f1e805e379a5adefc8fce4d1f548c?s=96&d=mm&r=g\",\"caption\":\"David de Lamo\"},\"description\":\"David de Lamo te descubre, en el blog de Caronte Web Studio, las tendencias de dise\u00f1o, tanto gr\u00e1fico como web. Nuestro responsable del \u00e1rea de dise\u00f1o en Caronte Web Studio te cuenta todo lo que debes saber sobre imagen de empresa, carteler\u00eda, dise\u00f1o gr\u00e1fico, dise\u00f1o web, papeler\u00eda, rotulaciones... Aprende con \u00e9l y sum\u00e9rgete en el apasionante mundo del dise\u00f1o.\",\"sameAs\":[\"http:\\\/\\\/www.carontestudio.com\"],\"url\":\"https:\\\/\\\/carontestudio.com\\\/blog\\\/author\\\/david\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"C\u00f3mo crear un prototipo web online - Caronte Web Studio","description":"Si quieres averiguar qu\u00e9 es el prototipado y c\u00f3mo crear un prototipo web online, hoy despejaremos tus dudas. \u00a1Vamos a ello!","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:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/","og_locale":"es_ES","og_type":"article","og_title":"C\u00f3mo crear un prototipo web online - Caronte Web Studio","og_description":"Si quieres averiguar qu\u00e9 es el prototipado y c\u00f3mo crear un prototipo web online, hoy despejaremos tus dudas. \u00a1Vamos a ello!","og_url":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/","og_site_name":"Blog de maketing | Caronte","article_publisher":"https:\/\/www.facebook.com\/carontewebstudio\/","article_published_time":"2020-12-18T12:00:00+00:00","article_modified_time":"2021-09-23T09:16:03+00:00","og_image":[{"width":1250,"height":737,"url":"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/como-crear-prototipo-web-online.jpg","type":"image\/jpeg"}],"author":"David de Lamo","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"David de Lamo","Tiempo de lectura":"6 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/#article","isPartOf":{"@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/"},"author":{"name":"David de Lamo","@id":"https:\/\/carontestudio.com\/blog\/#\/schema\/person\/2104191b75663e9e9ca47f821c5f92cf"},"headline":"C\u00f3mo crear un prototipo web online","datePublished":"2020-12-18T12:00:00+00:00","dateModified":"2021-09-23T09:16:03+00:00","mainEntityOfPage":{"@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/"},"wordCount":1133,"commentCount":0,"publisher":{"@id":"https:\/\/carontestudio.com\/blog\/#organization"},"image":{"@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/#primaryimage"},"thumbnailUrl":"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/como-crear-prototipo-web-online.jpg","articleSection":["Dise\u00f1o gr\u00e1fico","Dise\u00f1o web"],"inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/","url":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/","name":"C\u00f3mo crear un prototipo web online - Caronte Web Studio","isPartOf":{"@id":"https:\/\/carontestudio.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/#primaryimage"},"image":{"@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/#primaryimage"},"thumbnailUrl":"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/como-crear-prototipo-web-online.jpg","datePublished":"2020-12-18T12:00:00+00:00","dateModified":"2021-09-23T09:16:03+00:00","description":"Si quieres averiguar qu\u00e9 es el prototipado y c\u00f3mo crear un prototipo web online, hoy despejaremos tus dudas. \u00a1Vamos a ello!","breadcrumb":{"@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/#primaryimage","url":"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/como-crear-prototipo-web-online.jpg","contentUrl":"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2020\/12\/como-crear-prototipo-web-online.jpg","width":1250,"height":737,"caption":"C\u00f3mo crear prototipo web online"},{"@type":"BreadcrumbList","@id":"https:\/\/carontestudio.com\/blog\/como-crear-un-prototipo-web-online\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Portada","item":"https:\/\/carontestudio.com\/blog\/"},{"@type":"ListItem","position":2,"name":"C\u00f3mo crear un prototipo web online"}]},{"@type":"WebSite","@id":"https:\/\/carontestudio.com\/blog\/#website","url":"https:\/\/carontestudio.com\/blog\/","name":"Blog de marketing | Caronte","description":"En nuestro blog encontrar\u00e1s art\u00edculos semanales sobre SEO, marketing online, programaci\u00f3n web y mucho m\u00e1s.","publisher":{"@id":"https:\/\/carontestudio.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/carontestudio.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/carontestudio.com\/blog\/#organization","name":"Caronte - Agencia de marketing","url":"https:\/\/carontestudio.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/carontestudio.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2025\/06\/caronte-agencia-de-marketing-logo.png","contentUrl":"https:\/\/carontestudio.com\/blog\/wp-content\/uploads\/2025\/06\/caronte-agencia-de-marketing-logo.png","width":1090,"height":155,"caption":"Caronte - Agencia de marketing"},"image":{"@id":"https:\/\/carontestudio.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/carontewebstudio\/","https:\/\/www.instagram.com\/caronte_studio\/","https:\/\/www.tiktok.com\/@carontewebstudio","https:\/\/www.youtube.com\/@carontewebstudio","https:\/\/es.linkedin.com\/company\/carontewebstudio"]},{"@type":"Person","@id":"https:\/\/carontestudio.com\/blog\/#\/schema\/person\/2104191b75663e9e9ca47f821c5f92cf","name":"David de Lamo","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/secure.gravatar.com\/avatar\/110df00c652880b6b00cc45fe489d819ac3f1e805e379a5adefc8fce4d1f548c?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/110df00c652880b6b00cc45fe489d819ac3f1e805e379a5adefc8fce4d1f548c?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/110df00c652880b6b00cc45fe489d819ac3f1e805e379a5adefc8fce4d1f548c?s=96&d=mm&r=g","caption":"David de Lamo"},"description":"David de Lamo te descubre, en el blog de Caronte Web Studio, las tendencias de dise\u00f1o, tanto gr\u00e1fico como web. Nuestro responsable del \u00e1rea de dise\u00f1o en Caronte Web Studio te cuenta todo lo que debes saber sobre imagen de empresa, carteler\u00eda, dise\u00f1o gr\u00e1fico, dise\u00f1o web, papeler\u00eda, rotulaciones... Aprende con \u00e9l y sum\u00e9rgete en el apasionante mundo del dise\u00f1o.","sameAs":["http:\/\/www.carontestudio.com"],"url":"https:\/\/carontestudio.com\/blog\/author\/david\/"}]}},"_links":{"self":[{"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/posts\/3305","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/comments?post=3305"}],"version-history":[{"count":21,"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/posts\/3305\/revisions"}],"predecessor-version":[{"id":3348,"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/posts\/3305\/revisions\/3348"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/media\/3349"}],"wp:attachment":[{"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/media?parent=3305"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/categories?post=3305"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/carontestudio.com\/blog\/wp-json\/wp\/v2\/tags?post=3305"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}