﻿{"id":15040,"date":"2025-02-04T11:00:00","date_gmt":"2025-02-04T10:00:00","guid":{"rendered":"https:\/\/www.sortlist.es\/blog\/?p=15040"},"modified":"2025-04-01T13:17:40","modified_gmt":"2025-04-01T11:17:40","slug":"mockup-web","status":"publish","type":"post","link":"https:\/\/www.sortlist.es\/blog\/mockup-web\/","title":{"rendered":"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo"},"content":{"rendered":"\n<p>El proceso de<strong> dise\u00f1o y <\/strong><a href=\"https:\/\/www.sortlist.es\/desarrollo-web\/espana-es\" target=\"_blank\" rel=\"noreferrer noopener\"><strong>desarrollo <\/strong>de un sitio web<\/a> est\u00e1 cargado de detalles que pueden pasarse por alto (colores, <a href=\"https:\/\/www.sortlist.es\/blog\/tipografias\/\" target=\"_blank\" rel=\"noreferrer noopener\">tipograf\u00edas<\/a>, im\u00e1genes, enlaces, botones, redireccionamientos, etc.) y que tienen un impacto importante en la calidad, la experiencia del usuario y el rendimiento de tu sitio. Afortunadamente, existen recursos como el mockup web que te permiten <strong>ver, revisar y someter a opiniones <\/strong>tu sitio web incluso antes de que est\u00e9 disponible para cualquiera.<\/p>\n\n\n\n<p>A lo largo de este art\u00edculo, revisamos en detalle la <strong>importancia <\/strong>de este recurso y por qu\u00e9 no puedes trabajar sin \u00e9l. Adem\u00e1s, te mostramos los pasos que debes seguir para crear tu maqueta y someter a opiniones el <a href=\"https:\/\/www.sortlist.es\/blog\/diseno-web-conoce-buenas-practicas-para-triunfar\/\" target=\"_blank\" rel=\"noreferrer noopener\">dise\u00f1o de tu sitio<\/a>.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n     \n    <div id=\"module_key_takeaways--block_ac50d6ad8fc70be676d61d776dc34e5d\" class=\"sl_custom_module module_key_takeaways is_preview\">\n        <div class=\"module_key_takeaways__wrapper\">\n            \n\n<h3 class=\"wp-block-heading\">Puntos clave del art\u00edculo<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Importancia del Mockup Web<\/strong>: Los mockups son herramientas esenciales en el proceso de dise\u00f1o, ya que permiten detectar errores e inconsistencias antes de desarrollar el sitio web, ahorrando tiempo y dinero.<\/li>\n\n\n\n<li><strong>Visualizaci\u00f3n y Feedback<\/strong>: Los mockups ofrecen una forma de revisar la estructura y dise\u00f1o del sitio web, permitiendo presentar la maqueta a los interesados para obtener opiniones y realizar ajustes necesarios.<\/li>\n\n\n\n<li><strong>Proceso de Creaci\u00f3n<\/strong>: La creaci\u00f3n de un mockup implica seleccionar una herramienta de dise\u00f1o, crear wireframes, a\u00f1adir elementos visuales y de branding, y recoger opiniones para refinar el dise\u00f1o.<\/li>\n\n\n\n<li><strong>Beneficios de los Mockups<\/strong>: Identifican inconsistencias visuales, permiten modificar elementos antes del desarrollo, comparan diferentes ideas de dise\u00f1o, y re\u00fanen feedback de todos los stakeholders.<\/li>\n\n\n\n<li><strong>Recomendaci\u00f3n de Herramientas<\/strong>: El art\u00edculo destaca herramientas como Adobe XD, Figma, Canva, Marvel y UXPin, explicando sus caracter\u00edsticas y ventajas espec\u00edficas para la creaci\u00f3n de mockups.<\/li>\n<\/ul>\n\n\n        <\/div>\n    <\/div>\n\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">\u00bfQu\u00e9 es un mockup y cu\u00e1ndo se necesita?<\/h2>\n\n\n\n<p>Empecemos por el principio. \u00bfQu\u00e9 es exactamente un mockup de un sitio web? Se trata de una <strong>maqueta est\u00e1tica <\/strong>que te permite revisar una<strong> versi\u00f3n preliminar <\/strong>y detectar cualquier error o inconsistencia en los detalles. Adem\u00e1s, sirve para que puedas mostr\u00e1rselo a tus stakeholders, recopilar opiniones y hacer los ajustes necesarios.<\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1023\" height=\"559\" src=\"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22.png\" alt=\"\u00bfQu\u00e9 es un mockup y cu\u00e1ndo se necesita?\" class=\"wp-image-15044\" srcset=\"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22.png 1023w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-768x420.png 768w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-50x27.png 50w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-288x157.png 288w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-576x315.png 576w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-339x185.png 339w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-678x370.png 678w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-373x204.png 373w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-746x408.png 746w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-691x378.png 691w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-973x532.png 973w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-478x261.png 478w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-956x522.png 956w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-516x282.png 516w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-22-680x372.png 680w\" sizes=\"auto, (max-width: 1023px) 100vw, 1023px\" \/><figcaption class=\"wp-element-caption\">Fuente: <a href=\"https:\/\/www.mockplus.com\/blog\/post\/website-mockup\">Mockplus<\/a><\/figcaption><\/figure><\/div>\n\n\n<p><\/p>\n\n\n\n<p>Es importante dejar claro que en el mockup no puedes probar la funcionalidad del sitio. Su funci\u00f3n es solo de <a href=\"https:\/\/www.sortlist.es\/blog\/la-guia-definitiva-para-el-buen-diseno-web\/\" target=\"_blank\" rel=\"noreferrer noopener\">dise\u00f1o<\/a>, de ah\u00ed que entre en escena justo cuando tu <a href=\"https:\/\/www.sortlist.es\/diseno-web\/espana-es\" target=\"_blank\" rel=\"noreferrer noopener\">equipo de dise\u00f1o web<\/a> llegue al punto de crear los <strong>wireframes<\/strong>. El mockup les permite agregar todos los <strong>elementos visuales y de branding<\/strong> (colores, tipograf\u00edas, im\u00e1genes, iconos, botones, etc.) para lograr esa simulaci\u00f3n de tu sitio web que es tan necesaria en este proceso.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">\u00bfQu\u00e9 prop\u00f3sito cumple el mockup antes del desarollo web?<\/h3>\n\n\n\n<p>Este recurso de dise\u00f1o web cumple dos grandes prop\u00f3sitos. El primero, como mencionamos anteriormente, te permite <strong>ver con detalle toda la estructura y el dise\u00f1o<\/strong> de tu sitio para entender mejor c\u00f3mo se relacionan los elementos entre s\u00ed, c\u00f3mo entran en juego los colores y las tipograf\u00edas, y, sobre todo, para que puedas organizar y analizar la jerarqu\u00eda visual.&nbsp;<\/p>\n\n\n\n<p>El segundo es que<strong> te permite ahorrar tiempo y dinero<\/strong>. Imagina que dise\u00f1aste tu sitio web y, sin hacer una maqueta, lo pasas a la fase de desarrollo. Las probabilidades de que tengas que hacer alg\u00fan cambio de dise\u00f1o son bastante altas. En cambio, si creas una maqueta, puedes detectar r\u00e1pidamente los errores o cambios necesarios. Recuerda que siempre va a ser mucho m\u00e1s sencillo reemplazar una imagen, sustituir un color o incrementar la jerarqu\u00eda visual en una maqueta que en una l\u00ednea de c\u00f3digo de tu sitio web activo.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">4 beneficios de hacer el mockup de tu sitio web<\/h2>\n\n\n\n<p>Hasta ahora ha quedado claro por qu\u00e9 debes crear un prototipo de tu sitio web durante el proceso de dise\u00f1o y antes de empezar con el <a href=\"https:\/\/www.sortlist.es\/blog\/guia-completa-desarrollo-web-principiante-avanzado\/\" target=\"_blank\" rel=\"noreferrer noopener\">desarrollo<\/a>. Sin embargo, consideramos pertinente se\u00f1alar cuatro grandes beneficios de hacerlo.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Es el espacio perfecto para <strong>identificar inconsistencias visuales <\/strong>y errores de dise\u00f1o.<\/li>\n\n\n\n<li>Te permite<strong> modificar elementos visuales<\/strong> y de branding antes de que tu sitio web pase a la fase de desarrollo.<\/li>\n\n\n\n<li>Te da la oportunidad de <strong>probar y comparar diferentes ideas<\/strong> y conceptos de dise\u00f1o para identificar cu\u00e1l resuena mejor con tu p\u00fablico objetivo.<\/li>\n\n\n\n<li>Ofrece <strong>m\u00e1xima visibilidad <\/strong>a todos tus stakeholders en el proyecto y re\u00fane los comentarios y sugerencias de todos los involucrados en un mismo lugar.&nbsp;<\/li>\n<\/ol>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">6 pasos para hacer el mockup de tu p\u00e1gina web<\/h2>\n\n\n\n<p>El proceso de <strong>creaci\u00f3n de un mockup<\/strong> es corto: en solo <strong>5<\/strong> pasos lo tienes listo. El sexto paso de nuestra lista es una recomendaci\u00f3n de lo que puedes hacer despu\u00e9s de que la maqueta de tu sitio web est\u00e9 lista.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<div id=\"module_call-to-action--block_c438ca164d443537fb41daaa87e0eb68\" class=\"sl_custom_module module_call-to-action align_text_left\">\n    <div class=\"module_call-to-action__wrapper\">\n        <h4 class=\"js-texte-typing\">Toma la mejor desici\u00f3n                            <span class=\"js-texte-typing-text\"><\/span>\n                    <\/h4>\n        \n        <p>Descubre las agencias de dise\u00f1o web m\u00e1s relevantes para tu negocio.<\/p>\n\n        \n            \n                <span class=\"js-ga-gutenbergBlock-callToAction btn btn-blue\" target=\"_self\" rel=\"nofollow noopener\" data-o=\"aHR0cHM6Ly93d3cuc29ydGxpc3QuZXMvcHJvamVjdC9uZXc\/YXV0b2xvYWQ9dHJ1ZQ==\">Nuevo proyecto<\/span>\n\n            \n            <\/div>\n<\/div>\n\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Paso 1: Selecciona la herramienta de dise\u00f1o con la que vas a trabajar<\/h3>\n\n\n\n<p>Lo primero que debes hacer es revisar y analizar las diferentes <strong>herramientas de dise\u00f1o<\/strong> que cuenten con las funcionalidades necesarias para hacer un mockup.&nbsp;<\/p>\n\n\n\n<p>En la pr\u00f3xima secci\u00f3n de este art\u00edculo, te mostramos algunas de <strong>nuestras favoritas <\/strong>(Canva, Figma, Adobe XD, etc.). No te limites a ellas. Hay una gran variedad de mockup generators, incluso algunos gratuitos y otros de pago.&nbsp;<\/p>\n\n\n\n<p>Cuando hayas revisado varias opciones, es bueno que te detengas a analizar su coste, funcionalidades y opiniones de otros usuarios. Selecciona la que te resulte m\u00e1s sencilla de usar y se ajuste a las necesidades de tu proyecto.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Paso 2: crea los bocetos iniciales y el wireframe<\/h3>\n\n\n\n<p>Comienza el proceso dise\u00f1ando el <strong>wireframe <\/strong>de tu sitio web. Es decir, con un boceto inicial que incluye los <strong>elementos b\u00e1sicos:<\/strong> men\u00fa de navegaci\u00f3n, encabezados, pies de p\u00e1gina, bloques de contenido, marcadores de posici\u00f3n de im\u00e1genes, botones de llamada a la acci\u00f3n, campos de b\u00fasqueda, logotipos y marcadores de posici\u00f3n de texto.<\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"1060\" height=\"754\" src=\"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23.png\" alt=\"wireframe de tu sitio web\" class=\"wp-image-15045\" srcset=\"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23.png 1060w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-768x546.png 768w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-50x36.png 50w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-288x205.png 288w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-576x410.png 576w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-339x241.png 339w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-678x482.png 678w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-373x265.png 373w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-746x531.png 746w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-691x492.png 691w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-973x692.png 973w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-1048x745.png 1048w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-478x340.png 478w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-956x680.png 956w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-516x367.png 516w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-1032x734.png 1032w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-23-680x484.png 680w\" sizes=\"auto, (max-width: 1060px) 100vw, 1060px\" \/><figcaption class=\"wp-element-caption\">Fuente: <a href=\"https:\/\/www.sketch.com\/blog\/wireframe-examples\/\">Sketch<\/a><\/figcaption><\/figure><\/div>\n\n\n<p><\/p>\n\n\n\n<p>Cuando tengas el wireframe listo (puedes tener incluso varias versiones), es importante que lo compartas con tus principales stakeholders y les pidas sus <strong>opiniones y comentarios.<\/strong> Seguramente deber\u00e1s hacer algunos ajustes, como incluir secciones o eliminar otras.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Paso 3: a\u00f1ade los elementos clave de dise\u00f1o<\/h3>\n\n\n\n<p>Sobre la versi\u00f3n final del wireframe, empezar\u00e1s a agregar los <strong>elementos de branding y de UI.<\/strong> Es decir, los textos, im\u00e1genes, animaciones, v\u00eddeos, elementos gr\u00e1ficos, botones, llamadas a la acci\u00f3n, formularios de contacto, paleta de colores, tipograf\u00edas, logotipo, etc.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code>&lt;iframe width=\"560\" height=\"315\" src=\"https:\/\/www.youtube.com\/embed\/2400MwF21Ds?si=ld3dSDoQdDRLKUq5\" title=\"YouTube video player\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen&gt;&lt;\/iframe&gt;<\/code><\/pre>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Paso 4: prueba y recoge opiniones<\/h3>\n\n\n\n<p>Ahora que tienes la maqueta completa, debes probarla. Muchas de las herramientas que compartimos m\u00e1s abajo te permiten enviar tu maqueta a tus diferentes <strong>grupos de inter\u00e9s <\/strong>y recoger sus <strong>comentarios y opiniones<\/strong> en el mismo tablero. As\u00ed tienes toda la informaci\u00f3n en un solo lugar y te resulta m\u00e1s sencillo gestionarla.&nbsp;<\/p>\n\n\n\n<p>P\u00eddeles que eval\u00faen la amigabilidad con el usuario, la <strong>experiencia del usuario<\/strong>, el <strong>dise\u00f1o <\/strong>y la usabilidad.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Paso 5: redise\u00f1a lo que sea necesario<\/h3>\n\n\n\n<p>A partir de los comentarios recibidos, debes empezar a hacer las <strong>ediciones <\/strong>del prototipo de tu sitio web. Prioriza aquellas que tengan un impacto en la <strong>experiencia del usuario<\/strong> y que se repitan varias veces.&nbsp;<\/p>\n\n\n\n<p>Cuando hayas realizado todos los cambios necesarios, pasar\u00e1s al \u00faltimo y definitivo paso.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Paso 6: convierte el mockup de tu sitio web en un prototipo<\/h3>\n\n\n\n<p>Para terminar, cuando tengas el mockup aprobado, puedes hacer el prototipo de tu sitio web. Se trata de una versi\u00f3n m\u00e1s avanzada que permite probar la <strong>funcionalidad <\/strong>del sitio y de cada uno de los elementos incluidos en \u00e9l.<\/p>\n\n\n\n<p><\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" width=\"1184\" height=\"859\" src=\"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24.png\" alt=\"onvierte el mockup de tu sitio web en un prototipo\" class=\"wp-image-15046\" style=\"width:835px;height:auto\" srcset=\"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24.png 1184w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-768x557.png 768w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-50x36.png 50w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-288x209.png 288w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-576x418.png 576w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-339x246.png 339w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-678x492.png 678w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-373x271.png 373w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-746x541.png 746w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-691x501.png 691w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-973x706.png 973w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-1048x760.png 1048w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-478x347.png 478w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-956x694.png 956w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-516x374.png 516w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-1032x749.png 1032w, https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-24-680x493.png 680w\" sizes=\"auto, (max-width: 1184px) 100vw, 1184px\" \/><figcaption class=\"wp-element-caption\">Fuente: <a href=\"https:\/\/www.radiant.digital\/wireframe-mockup-and-prototype-whats-the-difference\/\">Radiant Digital<\/a><\/figcaption><\/figure><\/div>\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">5 herramientas para crear un mockup<\/h2>\n\n\n\n<p>Como te prometimos, a continuaci\u00f3n te explicamos un poco sobre las cinco <strong>herramientas de dise\u00f1o<\/strong> que te recomendamos utilizar para crear tu mockup. Todas ellas est\u00e1n cargadas de funcionalidades espec\u00edficas para ayudarte en este proceso.&nbsp;<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Adobe XD<\/h3>\n\n\n\n<p><a href=\"https:\/\/helpx.adobe.com\/support\/xd.html\" target=\"_blank\" rel=\"noreferrer noopener\">Adobe XD<\/a> es una de las opciones m\u00e1s completas del mercado, ya que combina tres factores importantes: <strong>facilidad de uso, funcionalidad avanzada y colaboraci\u00f3n eficiente<\/strong>. De esta forma, facilita y agiliza el proceso de creaci\u00f3n de dise\u00f1os mockup y prototipos.&nbsp;<\/p>\n\n\n\n<p>Esta herramienta se caracteriza por tener una interfaz intuitiva, por facilitar la integraci\u00f3n con otras herramientas de Adobe (como Photoshop e Illustrator), por permitir a los equipos trabajar juntos en tiempo real y por su ecosistema de complementos que brindan funcionalidades adicionales y se adaptan a las necesidades espec\u00edficas de cada proyecto, ampliando las capacidades b\u00e1sicas del programa.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Figma<\/h3>\n\n\n\n<p><a href=\"https:\/\/www.figma.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Figma<\/a> es una herramienta muy popular entre dise\u00f1adores y <a href=\"https:\/\/www.sortlist.es\/desarrollo-web\/espana-es\" target=\"_blank\" rel=\"noreferrer noopener\">equipos de desarrollo<\/a> por su capacidad de<strong> colaboraci\u00f3n en tiempo real,<\/strong> por poder acceder a ella desde cualquier dispositivo gracias a su <strong>base en la nube <\/strong>y por su fuerte enfoque en la consistencia y facilidad de uso. En otras palabras, es una herramienta potente y vers\u00e1til para crear mockups.<\/p>\n\n\n\n<p>Figma cuenta con componentes reutilizables y la capacidad de crear bibliotecas de estilos, lo que te ayuda a mantener la consistencia en el dise\u00f1o. Adem\u00e1s, con esta herramienta puedes acceder al historial de versiones de tu proyecto para ver y revertir cambios cuando sea necesario.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Canva<\/h3>\n\n\n\n<p><a href=\"https:\/\/www.canva.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Canva<\/a> es una herramienta muy valorada entre los dise\u00f1adores por su accesibilidad y versatilidad. Es una opci\u00f3n <strong>altamente recomendada para crear mockups<\/strong>, pues cuenta con una interfaz intuitiva y f\u00e1cil de usar. Adem\u00e1s, dispone de una amplia colecci\u00f3n de plantillas, im\u00e1genes, iconos y fuentes, lo que facilita la creaci\u00f3n de dise\u00f1os atractivos y profesionales sin necesidad de empezar desde cero. Por otro lado, te permite personalizar cada elemento del dise\u00f1o y adaptar las plantillas a las necesidades espec\u00edficas de tu proyecto.<\/p>\n\n\n\n<p>Est\u00e1 basada en la nube, por lo que puedes acceder a ella desde cualquier dispositivo con conexi\u00f3n a internet y permite que tu equipo pueda trabajar juntos en un mismo proyecto, compartir comentarios y hacer ediciones en tiempo real.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Marvel<\/h3>\n\n\n\n<p><a href=\"https:\/\/marvelapp.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">Marvel<\/a> es otra gran opci\u00f3n si est\u00e1s buscando una herramienta de dise\u00f1o para crear prototipos interactivos. Con ella puedes<strong> transformar dise\u00f1os est\u00e1ticos en prototipos <\/strong>interactivos sin necesidad de saber escribir c\u00f3digo. Adem\u00e1s, al basarse en la nube, puedes acceder a tus proyectos desde cualquier dispositivo con conexi\u00f3n a internet.<\/p>\n\n\n\n<p>Esta aplicaci\u00f3n admite la importaci\u00f3n de dise\u00f1os desde otras herramientas populares como Sketch y tambi\u00e9n ofrece la funcionalidad de crear dise\u00f1os directamente en su plataforma. Pero lo m\u00e1s interesante es que incluye funciones de pruebas de usuario que permiten obtener informaci\u00f3n valiosa y observar c\u00f3mo los usuarios interact\u00faan con los prototipos mediante grabaciones de pantalla, audio y v\u00eddeo.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h3 class=\"wp-block-heading\">UXPin<\/h3>\n\n\n\n<p><a href=\"https:\/\/www.uxpin.com\/\" target=\"_blank\" rel=\"noreferrer noopener\">UXPin<\/a> es una herramienta muy potente para dise\u00f1adores de <a href=\"https:\/\/www.sortlist.es\/blog\/que-es-ux-ui\/\" target=\"_blank\" rel=\"noreferrer noopener\">UI\/UX<\/a> que te permite crear desde dise\u00f1os mockup hasta prototipos que incluyan interacciones y animaciones complejas. Adem\u00e1s, permite la<strong> colaboraci\u00f3n en tiempo real<\/strong>, lo que facilita el trabajo en equipo y la integraci\u00f3n inmediata de comentarios.&nbsp;<\/p>\n\n\n\n<p>Al igual que otras opciones, es una herramienta<strong> basada en la nube<\/strong> que puede integrarse f\u00e1cilmente con herramientas populares como Sketch, Photoshop y Slack, lo que ampl\u00eda sus capacidades y facilita su uso en flujos de trabajo preexistentes.<\/p>\n\n\n\n<p><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusi\u00f3n<\/h2>\n\n\n\n<p>Incluir el desarrollo de prototipos no es un capricho del dise\u00f1ador de tu sitio web. Es un paso que te permite hacerte una primera idea de c\u00f3mo ser\u00e1 para que, antes de escribir el c\u00f3digo, puedas hacer los cambios necesarios a nivel de dise\u00f1o, incluyendo tipograf\u00edas, paletas de colores, iconos, im\u00e1genes y jerarqu\u00eda visual.&nbsp;<\/p>\n\n\n\n<p>Dicho esto, para tu pr\u00f3ximo desarrollo web, pide a tu <a href=\"https:\/\/www.sortlist.es\/diseno-web\/espana-es\" target=\"_blank\" rel=\"noreferrer noopener\">agencia de dise\u00f1o<\/a> que no se salte este paso y que te permita hacer todos los comentarios pertinentes para lograr un resultado \u00f3ptimo y reducir los tiempos y costes de desarrollo web.&nbsp;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>El proceso de dise\u00f1o y desarrollo de un sitio web est\u00e1 cargado de detalles que pueden pasarse por alto (colores, tipograf\u00edas, im\u00e1genes, enlaces, botones, redireccionamientos, etc.) y que tienen un impacto importante en la calidad, la experiencia del usuario y el rendimiento de tu sitio. Afortunadamente, existen recursos como el mockup web que te permiten [&hellip;]<\/p>\n","protected":false},"author":83,"featured_media":15047,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_sb_is_suggestion_mode":false,"_sb_show_suggestion_boards":false,"_sb_show_comment_boards":false,"_sb_suggestion_history":"","_sb_update_block_changes":"","content-type":"","om_disable_all_campaigns":false,"footnotes":""},"categories":[35],"class_list":["post-15040","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desarrollo-y-producto"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo<\/title>\n<meta name=\"description\" content=\"El mockup web no es un capricho. En el dise\u00f1o web es eso que te permite tener una primera impresi\u00f3n de c\u00f3mo ser\u00e1 tu p\u00e1gina.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.sortlist.es\/blog\/mockup-web\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo\" \/>\n<meta property=\"og:description\" content=\"El mockup web no es un capricho. En el dise\u00f1o web es eso que te permite tener una primera impresi\u00f3n de c\u00f3mo ser\u00e1 tu p\u00e1gina.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.sortlist.es\/blog\/mockup-web\/\" \/>\n<meta property=\"og:site_name\" content=\"Sortlist Blog\" \/>\n<meta property=\"article:published_time\" content=\"2025-02-04T10:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-04-01T11:17:40+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-25.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1220\" \/>\n\t<meta property=\"og:image:height\" content=\"862\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Clara Gil\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Clara Gil\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/\"},\"author\":{\"name\":\"Clara Gil\",\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/#\\\/schema\\\/person\\\/a404968f5ec32ed866088e9f48ffb4b9\"},\"headline\":\"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo\",\"datePublished\":\"2025-02-04T10:00:00+00:00\",\"dateModified\":\"2025-04-01T11:17:40+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/\"},\"wordCount\":2006,\"image\":{\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cdn.blog.production.sortlist.cloud\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2025\\\/01\\\/image-25.png\",\"articleSection\":[\"Desarrollo web y Producto\"],\"inLanguage\":\"es\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/\",\"url\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/\",\"name\":\"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/cdn.blog.production.sortlist.cloud\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2025\\\/01\\\/image-25.png\",\"datePublished\":\"2025-02-04T10:00:00+00:00\",\"dateModified\":\"2025-04-01T11:17:40+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/#\\\/schema\\\/person\\\/a404968f5ec32ed866088e9f48ffb4b9\"},\"description\":\"El mockup web no es un capricho. En el dise\u00f1o web es eso que te permite tener una primera impresi\u00f3n de c\u00f3mo ser\u00e1 tu p\u00e1gina.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/#primaryimage\",\"url\":\"https:\\\/\\\/cdn.blog.production.sortlist.cloud\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2025\\\/01\\\/image-25.png\",\"contentUrl\":\"https:\\\/\\\/cdn.blog.production.sortlist.cloud\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2025\\\/01\\\/image-25.png\",\"width\":1220,\"height\":862,\"caption\":\"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/mockup-web\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/\",\"name\":\"Sortlist Blog\",\"description\":\"Nuestras Gu\u00edas de Marketing\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/#\\\/schema\\\/person\\\/a404968f5ec32ed866088e9f48ffb4b9\",\"name\":\"Clara Gil\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\\\/\\\/cdn.blog.production.sortlist.cloud\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2024\\\/06\\\/avatar_user_83_1718114633.png\",\"url\":\"https:\\\/\\\/cdn.blog.production.sortlist.cloud\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2024\\\/06\\\/avatar_user_83_1718114633.png\",\"contentUrl\":\"https:\\\/\\\/cdn.blog.production.sortlist.cloud\\\/wp-content\\\/uploads\\\/sites\\\/6\\\/2024\\\/06\\\/avatar_user_83_1718114633.png\",\"caption\":\"Clara Gil\"},\"description\":\"Passionate about keeping up with new marketing and sales trends and sharing what she's learned through the Sortlist Blog. She is also a full-time mom.\",\"url\":\"https:\\\/\\\/www.sortlist.es\\\/blog\\\/author\\\/claragil\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo","description":"El mockup web no es un capricho. En el dise\u00f1o web es eso que te permite tener una primera impresi\u00f3n de c\u00f3mo ser\u00e1 tu p\u00e1gina.","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:\/\/www.sortlist.es\/blog\/mockup-web\/","og_locale":"es_ES","og_type":"article","og_title":"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo","og_description":"El mockup web no es un capricho. En el dise\u00f1o web es eso que te permite tener una primera impresi\u00f3n de c\u00f3mo ser\u00e1 tu p\u00e1gina.","og_url":"https:\/\/www.sortlist.es\/blog\/mockup-web\/","og_site_name":"Sortlist Blog","article_published_time":"2025-02-04T10:00:00+00:00","article_modified_time":"2025-04-01T11:17:40+00:00","og_image":[{"width":1220,"height":862,"url":"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-25.png","type":"image\/png"}],"author":"Clara Gil","twitter_card":"summary_large_image","twitter_misc":{"Escrito por":"Clara Gil","Tiempo de lectura":"10 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/#article","isPartOf":{"@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/"},"author":{"name":"Clara Gil","@id":"https:\/\/www.sortlist.es\/blog\/#\/schema\/person\/a404968f5ec32ed866088e9f48ffb4b9"},"headline":"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo","datePublished":"2025-02-04T10:00:00+00:00","dateModified":"2025-04-01T11:17:40+00:00","mainEntityOfPage":{"@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/"},"wordCount":2006,"image":{"@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-25.png","articleSection":["Desarrollo web y Producto"],"inLanguage":"es"},{"@type":"WebPage","@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/","url":"https:\/\/www.sortlist.es\/blog\/mockup-web\/","name":"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo","isPartOf":{"@id":"https:\/\/www.sortlist.es\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/#primaryimage"},"image":{"@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/#primaryimage"},"thumbnailUrl":"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-25.png","datePublished":"2025-02-04T10:00:00+00:00","dateModified":"2025-04-01T11:17:40+00:00","author":{"@id":"https:\/\/www.sortlist.es\/blog\/#\/schema\/person\/a404968f5ec32ed866088e9f48ffb4b9"},"description":"El mockup web no es un capricho. En el dise\u00f1o web es eso que te permite tener una primera impresi\u00f3n de c\u00f3mo ser\u00e1 tu p\u00e1gina.","breadcrumb":{"@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.sortlist.es\/blog\/mockup-web\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/#primaryimage","url":"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-25.png","contentUrl":"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2025\/01\/image-25.png","width":1220,"height":862,"caption":"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo"},{"@type":"BreadcrumbList","@id":"https:\/\/www.sortlist.es\/blog\/mockup-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.sortlist.es\/blog\/"},{"@type":"ListItem","position":2,"name":"\u00bfC\u00f3mo hacer un mockup web? 6 pasos para lograrlo"}]},{"@type":"WebSite","@id":"https:\/\/www.sortlist.es\/blog\/#website","url":"https:\/\/www.sortlist.es\/blog\/","name":"Sortlist Blog","description":"Nuestras Gu\u00edas de Marketing","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.sortlist.es\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Person","@id":"https:\/\/www.sortlist.es\/blog\/#\/schema\/person\/a404968f5ec32ed866088e9f48ffb4b9","name":"Clara Gil","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2024\/06\/avatar_user_83_1718114633.png","url":"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2024\/06\/avatar_user_83_1718114633.png","contentUrl":"https:\/\/cdn.blog.production.sortlist.cloud\/wp-content\/uploads\/sites\/6\/2024\/06\/avatar_user_83_1718114633.png","caption":"Clara Gil"},"description":"Passionate about keeping up with new marketing and sales trends and sharing what she's learned through the Sortlist Blog. She is also a full-time mom.","url":"https:\/\/www.sortlist.es\/blog\/author\/claragil\/"}]}},"_links":{"self":[{"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/posts\/15040","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/users\/83"}],"replies":[{"embeddable":true,"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/comments?post=15040"}],"version-history":[{"count":3,"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/posts\/15040\/revisions"}],"predecessor-version":[{"id":15081,"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/posts\/15040\/revisions\/15081"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/media\/15047"}],"wp:attachment":[{"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/media?parent=15040"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.sortlist.es\/blog\/wp-json\/wp\/v2\/categories?post=15040"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}