Integración de Duda en una plataforma SaaS (1 de 3)

March 26, 2021
0 minute read

Ofrecer sitios web puede ser una gran victoria para las empresas de SaaS en términos de reducción de la deserción, aumento de los ingresos y aumento de la satisfacción del cliente.

Imagína los beneficios de proporcionarles a tus usuarios una solución de sitio web instantánea y sin inconvenientes, adaptada a tu contenido personalizado, todo ello desde la interfaz de usuario de tu plataforma SaaS.

¿Cuánto tiempo ahorrarían tus clientes si el contenido de su sitio web estuviera siempre actualizado con los cambios que hacen durante el uso diario de tu producto? Los beneficios para ti y tus usuarios serían inmensos.

Estarías muy contento porque podrías cobrar por la gestión de una mayor parte del negocio de tus clientes, y tus clientes estarían agradecidos por el ahorro de tiempo adicional y la comodidad que ahora les proporciona tu plataforma.

Supongamos que has investigado y has decidido que aliarte con un constructor de sitios web es el paso correcto para tu negocio. Naturalmente, has elegido Duda, ya que es el único editor que puedes hacer realmente tuyo.

Con características como una interfaz de usuario de white label, API para la generación programática de sitios, y la capacidad de enviar datos directamente desde tu plataforma hasta los sitios web de tus usuarios, Duda es el constructor de sitios web más integrable en el mercado.

Ya no tendrás que lidiar con la pesadilla de mantenimiento de los sitios defectuosos de WordPress, ni tendrás que desviar tus valiosos recursos de desarrollo para crear un editor de sitios web interno. Duda te proporcionará todo lo que necesitas para aumentar tus recursos principales con capacidades de construcción de sitios web que fascinará a tus clientes.

Todo esto suena muy bien, pero si actúas como en la mayoría de las empresas SaaS, tu preocupación es saber exactamente lo que implica una integración.

Esta serie de blog posts te guiará a través de los pasos necesarios para permitirles a tus usuarios crear sitios maravillosamente diseñados con un simple clic.

En Duda, ese proceso comienza con la creación de las plantillas que tus usuarios elegirán cuando construyan un nuevo sitio. Y ese es precisamente el tema que vamos a cubrir en este primer post...


PLANTILLAS INTERCONECTADAS

Con las plantillas de Duda, tienes la posibilidad de separar el contenido del diseño. Si has utilizado previamente WordPress, este es probablemente un concepto familiar.

Creas un tema (diseño), y luego publicas una página o post (contenido). Cuando un usuario visita el sitio web, WordPress inserta el contenido en el diseño y muestra la página web. 

Duda funciona de forma similar: las plantillas no solo almacenan el diseño, sino también las conexiones de datos que permiten implantar el contenido en el diseño de la plantilla.

Puedes pensar en estas plantillas conectadas como una promesa. Es como si le estuvieses diciendo a la plantilla: "Voy a enviarte algunos datos en algún momento en el futuro. Cuando los recibas, tienes que mostrarlos aquí".


plataforma saas

El contenido real del sitio se almacena en la Biblioteca de Contenidos de la plantilla. La biblioteca de contenidos es una serie de pares de etiquetas/valores que contienen contenido.

Algunas etiquetas las proporcionamos naturalmente, pero puedes añadir etiquetas adicionales siempre que las necesites. Puedes añadir los valores de estas etiquetas manualmente dentro de la interfaz de usuario del editor de Duda, o a través de nuestra API.

Cuando conectas un widget de tu plantilla a los datos de la biblioteca, puedes elegir de una lista de etiquetas disponibles. Esta es la promesa que mencioné anteriormente. Esta acción le indica a la plantilla que el valor de la biblioteca de contenidos identificado por esta etiqueta es lo que debe mostrarse en este lugar.


plataforma saas

Tus usuarios probablemente están entrando en un tesoro de contenido simplemente a través del uso diario de tu plataforma SaaS. Tu producto también podría estar procesando datos adicionales utilizando ese contenido.

Al pensar en la creación de tu plantilla, toma nota de todas estas entradas y salidas de datos dentro de tu producto, y decide qué valores serían pertinentes para mostrar en un sitio web. Para cada dato que elijas, añade una etiqueta correspondiente en la Biblioteca de Contenidos. Algunos ejemplos de datos útiles podrían ser:



  • Nombre de la empresa
  • Logotipo de la empresa
  • Direcciones físicas
  • Direcciones de email
  • Números de teléfono
  • Visión general de la empresa/Acerca de nosotros
  • Horario de atención al público
  • Cuentas de redes sociales
  • Etc...

Es posible que no utilices todos los valores que identificaste inmediatamente, pero tener los valores en la Biblioteca de Contenido te dará flexibilidad en el futuro para actualizar el sitio de un usuario con más funcionalidad e información.

Después de llenar la Biblioteca de Contenidos con todas tus etiquetas, puedes añadir valores de marcador de posición para ayudarte mientras diseñas la plantilla.

Cuando crees un sitio real, sobrescribirás los valores del marcador de posición con datos reales. El último paso es conectar los elementos de la plantilla con las etiquetas de la biblioteca de contenidos una vez que te sientas satisfecho con el diseño y el layout.


SÍTIOS INSTANTÁNEOS

Una vez completadas las conexiones de las plantillas, es el momento de implementar las llamadas a la API para que tus usuarios puedan crear sus sitios web de forma instantánea.

Lo ideal es que un usuario pueda simplemente hacer clic en el botón "Crear sitio web" desde tu producto SaaS. Un sitio será creado basado en una de tus plantillas, y los datos almacenados en tu plataforma serán enviados a la Biblioteca de Contenido del sitio.

Las promesas que has hecho sobre la plantilla se cumplen ahora, ya que el nuevo contenido se deposita en un lugar apropiado dentro de la plantilla. En su forma más simple, este flujo en el sitio web instantáneo solo requiere de dos llamadas a la API de Duda.


LLAMADA A LA API "CREAR SITIO WEB" 

La llamada a la API de creación de sitios web solo requiere un valor de template_id para tener éxito. El ID de la plantilla identifica la plantilla que quieres que sea la base del sitio.

Todo lo que tienes que hacer es proporcionar el ID de una plantilla con un diseño completo y conexiones de datos configurados. Tienes la posibilidad de recuperar manualmente el ID de la plantilla a través de la API durante el desarrollo y almacenamiento del valor dentro de su código o base de datos.

 

curl --request POST \ 

--url https://api.duda.co/api/sites/multiscreen/create \ 

--header 'authorization: Basic123abc=' \ 

--header 'content-type: application/json' \ 

--data '{"template_id":"1111111"}'



Nota: Las llamadas a la API requieren un nombre de usuario y una contraseña para autenticarse.

Si tu llamada tiene éxito, recibirás un site_name en la respuesta. Debes guardar este valor y asociarlo a una cuenta o entidad dentro de tu plataforma, ya que lo necesitarás más adelante para otras llamadas a la API.

 

{ "site_name":"28e1182c" }


llamada a la api de "update content library"

La creación de un sitio web a partir de una plantilla, ya sea mediante la API o desde la interfaz de usuario de Duda, copia el diseño y las conexiones de datos de esa plantilla.

También copia los valores dentro de la biblioteca de contenidos, que si observaste desde el comienzo, son actualmente los valores del marcador de posición en este punto del proceso. Ahora es el momento de actualizar esos valores con datos reales de este cliente. 

La llamada a la API para actualizar la biblioteca de contenidos requiere un esquema de objetos de contenido específico. Sin embargo, sólo puede incluir las propiedades que estás actualizando.

Presta especial atención a la propiedad site_texts y a cómo formatear los valores pertenecientes a las etiquetas personalizadas.

 

curl --request POST \ 

    --url https://api.duda.co/api/accounts/create \ 

    --header 'authorization: Basic Basic123abc' \ 

    --header 'content-type: application/json' \ 

    --data 'VALID CONTENT OBJECT'

Tus nuevos valores llenarán la Biblioteca de Contenido, y las conexiones de datos que configuraste previamente se asegurarán que el nuevo contenido se clasifique en los lugares correctos del diseño. 

Si has seguido todos estos pasos, ¡felicitaciones! ¡Acabas de crear un sitio web instantáneo!


RESUMINDO

Espero que este post te sea útil a la hora de planificar tu propia integración de Duda con tu plataforma SaaS y que te sirva para iniciar una reflexión sobre los tipos de contenido que podrías sincronizar con un sitio web de Duda.

En el próximo post de esta serie, hablaremos de cómo dar permisos a tus usuarios para editar el nuevo sitio, a través de un flujo de trabajo que solo necesita de un inicio de sesión.

También hablaremos de la personalización de la experiencia de tus usuarios a través de los permisos de la cuenta. Terminaremos la serie hablando de la integración de estructuras de datos más complejas, y de la generación o eliminación automática de páginas enteras de contenido de un sitio cuando un usuario cambia los datos en tu plataforma.

Hasta entonces, trata de explorar nuestra documentación sobre la API y las guías para desarrolladores, para que amplíes tu comprensión de lo que es posible con Duda como tu editor de sitios web integrados.


Did you find this article interesting?


Thanks for the feedback!
By Shawn Davis April 16, 2026
Website builder analysed 69M AI crawler visits across over 850,000 websites in February 2026 to determine key trends and characteristics that increase local AEO
By Shawn Davis April 1, 2026
Core Web Vitals aren't new, Google introduced them in 2020 and made them a ranking factor in 2021. But the questions keep coming, because the metrics keep changing and the stakes keep rising. Reddit's SEO communities were still debating their impact as recently as January 2026, and for good reason: most agencies still don't have a clear, repeatable way to measure, diagnose, and fix them for clients. This guide cuts through the noise. Here's what Core Web Vitals actually measure, what good scores look like today, and how to improve them—without needing a dedicated performance engineer on every project. What Core Web Vitals measure Google evaluates three user experience signals to determine whether a page feels fast, stable, and responsive: Largest Contentful Paint (LCP) measures how long it takes for the biggest visible element on a page — usually a hero image or headline — to load. Google considers anything under 2.5 seconds good. Above 4 seconds is poor. Interaction to Next Paint (INP) replaced First Input Delay (FID) in March 2024. Where FID measures the delay before a user's first click is registered, INP tracks the full responsiveness of every interaction across the page session. A good INP score is under 200 milliseconds. Cumulative Layout Shift (CLS) measures visual stability — how much page elements unexpectedly move while content loads. A score below 0.1 is good. Higher scores signal that images, ads, or embeds are pushing content around after load, which frustrates users and tanks conversions. These three metrics are a subset of Google's broader Page Experience signals, which also include HTTPS, safe browsing, and mobile usability. Core Web Vitals are the ones you can most directly control and improve. Why your clients' scores may still be poor Core Web Vitals scores vary dramatically by platform, hosting, and how a site was built. Some of the most common culprits agencies encounter: Heavy above-the-fold content . A homepage with an autoplay video, a full-width image slider, and a chat widget loading simultaneously will fail LCP every time. The browser has to resolve all of those resources before it can paint the largest element. Unstable image dimensions . When an image loads without defined width and height attributes, the browser doesn't reserve space for it. It renders the surrounding text, then jumps it down when the image appears. That jump is CLS. Third-party scripts blocking the main thread . Analytics pixels, ad tags, and live chat tools run on the browser's main thread. When they stack up, every click and tap has to wait in line — driving INP scores up. A single slow third-party script can push an otherwise clean site into "needs improvement" territory. Too many web fonts . Each font family and weight is a separate network request. A page loading four font files before rendering any text will fail LCP, especially on mobile connections. Unoptimized images . JPEGs and PNGs served at full resolution, without compression or modern formats like WebP or AVIF, add unnecessary weight to every page load. How to measure them accurately There are two types of Core Web Vitals data you should be looking at for every client: Lab data comes from tools like Google PageSpeed Insights, Lighthouse, and WebPageTest. It simulates page loads in controlled conditions. Lab data is useful for diagnosing specific issues and testing fixes before you deploy them. Field data (also called Real User Monitoring, or RUM) comes from actual users visiting the site. Google collects this through the Chrome User Experience Report (CrUX) and surfaces it in Search Console and PageSpeed Insights. Field data is what Google actually uses as a ranking signal — and it often looks worse than lab data because it reflects real-world device and connection variability. If your client's site has enough traffic, you'll see field data in Search Console under Core Web Vitals. This is your baseline. Lab data helps you understand why the scores are what they are. For clients with low traffic who don't have enough field data to appear in CrUX, you'll be working primarily with lab scores. Set that expectation early so clients understand that improvements may not immediately show up in Search Console. Practical fixes that move the needle Fix LCP: get the hero image loading first The single most effective LCP improvement is adding fetchpriority="high" to the hero image tag. This tells the browser to prioritize that resource over everything else. If you're using a background CSS image for the hero, switch it to anelement — background images aren't discoverable by the browser's preload scanner. Also check whether your hosting serves images through a CDN with caching. Edge delivery dramatically reduces the time-to-first-byte, which feeds directly into LCP. Fix CLS: define dimensions for every media element Every image, video, and ad slot on the page needs explicit width and height attributes in the HTML. If you're using responsive CSS, you can still define the aspect ratio with aspect-ratio in CSS while leaving the actual size fluid. The key is giving the browser enough information to reserve space before the asset loads. Avoid inserting content above existing content after page load. This is common with cookie banners, sticky headers that change height, and dynamically loaded ad units. If you need to show these, anchor them to fixed positions so they don't push content around. Fix INP: reduce what's competing for the main thread Audit third-party scripts and defer or remove anything that isn't essential. Tools like WebPageTest's waterfall view or Chrome DevTools Performance panel show you exactly which scripts are blocking the main thread and for how long. Load chat widgets, analytics, and ad tags asynchronously and after the page's critical path has resolved. For most clients, moving non-essential scripts to load after the DOMContentLoaded event is a meaningful INP improvement with no visible impact on the user experience. For websites with heavy JavaScript — particularly those built on frameworks with large client-side bundles — consider breaking up long tasks into smaller chunks using the browser's Scheduler API or simply splitting components so the main thread isn't locked for more than 50 milliseconds at a stretch. What platforms handle automatically One of the practical advantages of building on a platform optimized for performance is that many of these fixes are applied by default. Duda, for example, automatically serves WebP images, lazy loads below-the-fold content, minifies CSS, and uses efficient cache policies for static assets. As of May 2025, 82% of sites built on Duda pass all three Core Web Vitals metrics — the highest recorded pass rate among major website platforms. That baseline matters when you're managing dozens or hundreds of client sites. It means you're starting each project close to or at a passing score, rather than diagnosing and patching a broken foundation. How much do Core Web Vitals actually affect rankings? Honestly, they're a tiebreaker — not a primary signal. Google has been clear that content quality and relevance still dominate ranking decisions. A well-optimized site with thin, irrelevant content won't outrank a content-rich competitor just because its CLS is 0.05. What Core Web Vitals do affect is the user experience that supports those rankings. Pages with poor LCP scores have measurably higher bounce rates. Sites with high CLS lose users mid-session. Those behavioral signals — time on page, return visits, conversions — are things search engines can observe and incorporate. The practical argument for fixing Core Web Vitals isn't just "because Google said so." It's that faster, more stable pages convert better. Every second of LCP improvement can reduce bounce rates by 15–20% depending on the industry and device mix. For client sites that monetize through leads or eCommerce, that's a revenue argument, not just an SEO argument. A repeatable process for agencies Audit every new site before launch. Run PageSpeed Insights and record LCP, INP, and CLS scores for both mobile and desktop. Flag anything in the "needs improvement" or "poor" range before the client sees the live site. Check Search Console monthly for existing clients. The Core Web Vitals report surfaces issues as they appear in field data. Catching a regression early — before it compounds — is significantly easier than explaining a traffic drop after the fact. Document what you've improved. Clients rarely see Core Web Vitals scores on their own. A monthly one-page performance summary showing before/after scores builds credibility and makes your technical work visible. Prioritize mobile. Google uses mobile-first indexing, and field data shows that mobile CWV scores are almost always worse than desktop. If you only have time to optimize one version, do mobile first. Core Web Vitals aren't a one-time fix. Platforms change, new scripts get added, campaigns bring in new widgets. Build the audit into your workflow and treat it like any other ongoing deliverable, and you'll stay ahead of the issues before they affect your clients' rankings. Duda's platform is built with Core Web Vitals performance in mind. Explore how it handles image optimization, script management, and site speed automatically — so your team spends less time debugging and more time building.
By Ilana Brudo March 31, 2026
Vertical SaaS must transition from tools to an AI-powered Vertical Operating System (vOS). Learn to leverage context, end tech sprawl, and maximize retention.
Show More

Latest posts