Contratar un desarrollador Webflow para CMS y código a medida

Si quieres contratar un desarrollador Webflow capaz de construir un CMS estructurado y código a medida, busca a un especialista en Webflow con habilidades de ingeniería front-end. Esa persona planifica tu modelo de contenido antes de cualquier maquetación, guarda el código en un lugar que tu equipo pueda versionar y entrega documentación. Un diseñador que trabaja solo en el Designer rara vez cubre las tres cosas.

La prueba que los distingue dura una hora. Entrega al candidato tus tipos de contenido y pídele que dibuje en papel las colecciones, las referencias y los límites que tendrá en cuenta, antes de cualquier diseño. Un especialista responde con pros y contras. Los demás responden con maquetas de páginas.

Esta guía es para responsables de marketing y equipos que eligen entre un freelance, un desarrollador y una agencia. Encontrarás ejemplos de CMS resueltos con los que comparar, un mapa de dónde va el código, una tabla comparativa, señales de alerta, preguntas y pruebas de portafolio que pedir. Para entender el funcionamiento de las colecciones, lee cómo funciona el CMS de Webflow. Aquí nos centramos en la decisión de contratación.

Quién cumple al contratar un desarrollador Webflow#

Necesitas una persona, o un equipo, que cubra las dos mitades del trabajo: estructurar tu contenido y escribir el código que lo rodea. Este es el perfil y después la prueba que lo comprueba.

El perfil para un proyecto de CMS y código#

Un diseñador Webflow construye maquetas, estilos e interacciones en el Designer, y muchos lo hacen de maravilla. Un desarrollador Webflow hace eso y añade la ingeniería alrededor. La diferencia se nota en cuatro habilidades:

• Modelado de contenido: convierte tu forma de publicar en colecciones, campos y referencias que siguen ordenados cuando el sitio crece.
• Ingeniería front-end: escribe JavaScript y CSS legibles, limitados a las páginas correctas y cargados sin ralentizarlas.
• Integraciones: conecta formularios, un CRM y analítica mediante webhooks y la API de Webflow para desarrolladores.
• Operación: trabaja sobre una copia de staging, guarda un registro de cambios y documenta la construcción para tu equipo.

¿Por qué debería importarle a un equipo de marketing? Porque el modelo decide con qué rapidez podrás publicar dentro de un año. Un sitio que parece perfecto al lanzarse con 20 elementos puede frustrar a todos los editores con 400. Un desarrollador planifica para los 400 desde el primer día.

La prueba de una hora: modela tu CMS en papel#

Envía al candidato, un día antes de la llamada, una lista de una página con tus tipos de contenido: recursos, autores, servicios, sedes, casos de éxito. En la llamada, pídele que dibuje las colecciones, los campos, las relaciones y los límites que tendrá en cuenta. Sin herramienta de diseño ni maquetas.

Fíjate en cuatro cosas. Las colecciones se nombran por su propósito, como Recursos y Autores. Lo que se repite (personas, lugares, categorías) tiene su propia colección. El candidato pregunta quién edita, con qué frecuencia y cuántos elementos tendrás dentro de dos años. Y menciona los límites del CMS y dice que consultaría los valores actuales en el Webflow Help Center en lugar de citar cifras de memoria.

Cómo es una arquitectura de CMS Webflow bien hecha#

Un modelo bien construido se ve sencillo desde fuera. Los editores saben dónde escribir, nada se teclea dos veces y una página nueva no requiere a un desarrollador. Aquí tienes dos ejemplos ilustrativos con los que contrastar cualquier propuesta.

Colecciones que reflejan cómo publicas#

Parte de lo que tu equipo lista, repite o enlaza. Cada cosa se convierte en una colección. Cada atributo que cambia de un elemento a otro se convierte en un campo.

Ejemplo uno, ilustrativo: una biblioteca de recursos B2B para una empresa que publica guías, webinars e informes.

• Recursos: título, slug, resumen, cuerpo, tipo, fecha de publicación, imagen de portada, archivo descargable, un Autor, varios Temas, varios Sectores.
• Autores: nombre, cargo, foto, biografía breve.
• Temas: nombre, slug, descripción corta.
• Sectores: nombre, slug, texto de introducción.

Ejemplo dos, ilustrativo: una empresa de servicios con 10 servicios y 8 sedes. Escribir a mano 80 páginas combinadas invita a textos copiados y enlaces rotos. Tres colecciones lo evitan: Servicios, Sedes y una colección de Áreas de servicio cuyos elementos referencian cada uno un servicio y una sede. Solo existen páginas donde tienes algo real que decir, y los datos compartidos, como la dirección y el horario, viven una sola vez, en Sedes.

Campos de referencia y multirreferencia en la práctica#

Un campo de referencia apunta un elemento a otro elemento de otra colección, como un Autor por recurso. Un campo de multirreferencia apunta un elemento a varios, como un recurso etiquetado con tres Temas. La ventaja es editar una sola vez: cambias la foto de un autor y todas las páginas de recursos la muestran.

Modelo de biblioteca

• AutoresUn autor por recurso
• TemasVarios temas por recurso

RecursosGuías, webinars e informes

• SectoresVarios sectores por recurso

Modelo de contenido con una colección Recursos enlazada a Autores, Temas y Sectores, de modo que una edición actualiza cada página enlazada

Las referencias también impulsan la navegación. Una lista de colección puede filtrar por una referencia, de modo que "todos los recursos de Salud" pasa a ser un filtro vivo sobre el campo Sectores, en lugar de una página copiada que alguien debe actualizar. Pide al candidato que te muestre de dónde sale cada filtro de tu plan.

Cómo sortear los límites del CMS en el modelo#

Todo CMS tiene techos: elementos por colección, elementos mostrados en una lista de colección, referencias por campo y campos por colección. Cambian con los planes y las versiones, así que consulta las cifras actuales en el Webflow Help Center y en Webflow University en lugar de fiarte de un número en un artículo. Lo que compras es el plan del desarrollador para esos límites:

• Divide por propósito: colecciones separadas para contenido que los visitantes exploran de forma distinta, como eventos en curso y un archivo de los pasados.
• Pagina y filtra: muestra una página manejable de elementos y deja que los visitantes acoten por referencia en lugar de cargarlo todo.
• Sustituye campos repetidos por referencias: un campo de referencia cuesta menos que cinco campos de texto copiados.
• Guarda los datos pesados fuera: para catálogos o tablas de precios con muchísimas filas, conserva los datos en una fuente pensada para ello y trae lo que necesite cada página.
• Sincroniza por API: la documentación para desarrolladores de Webflow describe cómo el código crea y actualiza elementos del CMS, de modo que una tarea programada puede alimentar el CMS desde tu ERP o tu base de datos.

A veces la respuesta franca es "esta parte va fuera de Webflow". Esa honestidad es buena señal. Nuestra guía de Webflow para empresas SaaS muestra cómo se combinan estructura y límites en un sitio con documentación, changelog e integraciones.

Dónde va el código a medida en un sitio Webflow#

El código a medida en Webflow tiene tres lugares. El que elija el desarrollador decide si tu equipo puede actualizar, probar y revertir un cambio sin abrir el Designer. Pide a cada candidato su plan para cada uno.

Embeds de todo el sitio para seguimiento y comportamiento global#

Los ajustes del sitio permiten al desarrollador añadir código en el head y el footer de cada página. Es el lugar para las etiquetas de analítica, un banner de consentimiento, un widget de chat y pequeños comportamientos globales. El código de una sola página tiene su propio campo en los ajustes de página. Pide una lista de cada script, lo que hace y quién es el titular de la cuenta que hay detrás.

Embeds ligados al CMS para contenido por elemento#

Un elemento Embed dentro de una plantilla de colección puede incluir campos del elemento actual, con la opción Add field del editor de embeds. Usos típicos: datos estructurados (JSON-LD) con el título y la fecha de cada artículo, un reproductor de vídeo que lee el enlace de cada elemento o una calculadora configurada por servicio. Para comprobar el trabajo, mira el código fuente de dos elementos distintos y confirma que los valores difieren. Los embeds también tienen límites de tamaño, así que los scripts más largos pasan al siguiente lugar.

JavaScript externo servido desde una CDN#

La lógica de más de unas pocas líneas pertenece a un archivo en un repositorio de código, versionado y servido desde una CDN (una red de servidores que entrega archivos desde un punto cercano a cada visitante). Una sola etiqueta en los ajustes del sitio lo carga. Obtienes revisión antes de que los cambios salgan en vivo, un número de versión al que volver y un repositorio en la cuenta de tu organización, de modo que el código es tuyo. Un patrón mínimo se ve así:

<!-- Site settings > Custom code > Footer code -->
<script src="https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.js" defer></script>
<script>
  // Los scripts con defer se ejecutan antes de DOMContentLoaded, así que gsap ya está listo aquí
  window.addEventListener("DOMContentLoaded", function () {
    gsap.from(".resource-card", { opacity: 0, y: 16, duration: 0.5, stagger: 0.08 });
  });
</script>

La versión en la URL está fijada, así que una actualización de la librería nunca cambia tu sitio por sorpresa. El atributo defer deja que la página se renderice primero y ejecuta el script después. El archivo propio de tu equipo sigue las mismas reglas, cargado desde una versión etiquetada. Pruébalo en el dominio de staging antes de que llegue a producción.

Diseñador, desarrollador o agencia: a quién contratar#

Un diseñador encaja con un sitio de marca mayormente estático. Un desarrollador encaja con un sitio con CMS, código e integraciones. Una agencia encaja con un lanzamiento que necesita varias disciplinas a la vez. La tabla añade rangos ilustrativos.

Comparación por alcance, coste y plazo#

Trata los rangos como ilustrativos. Las tarifas varían entre Estados Unidos, España y Latinoamérica, y el alcance mueve el precio más que la geografía. Pide a cada candidato que presupueste el mismo alcance por escrito para que las propuestas sean comparables.

Señales de que un solo freelance ya no basta#

Un buen freelance puede entregar un sitio excelente. El punto de presión suele ser la continuidad y la amplitud. Estas señales apuntan a un equipo:

• Varios editores publican cada semana y cada uno necesita un lugar claro donde trabajar.
• El sitio se conecta a un CRM, un ERP o una herramienta de facturación que debe seguir funcionando.
• Un mismo lanzamiento necesita diseño, textos, SEO y desarrollo a la vez.
• Nadie puede cubrir cuando tu desarrollador se ausenta una semana.

Si se cumplen dos o más, compara un equipo liderado por un desarrollador o una agencia. La página de modalidades de trabajo muestra cómo encajan los proyectos puntuales, un Retainer y un plan Care.

Señales de alerta antes de firmar#

La mayoría de los problemas se ven en la propuesta, la demo o el enlace de staging. Estos son los que conviene detectar a tiempo.

Colecciones duplicadas y contenido fijo en las páginas#

Las colecciones duplicadas se ven así: "Blog ES", "Blog Salud" y "Blog Retail", todas con los mismos campos. También aparecen como una colección por cada página de servicio. Entonces cada cambio hay que repetirlo, los filtros no pueden cruzarlas y los editores cometen errores silenciosos. Las colecciones separadas pueden ser correctas cuando los campos de verdad difieren, así que pide al desarrollador que explique cada una.

El contenido fijo es texto escrito directamente en páginas que debería venir del CMS: un teléfono pegado en treinta sitios, una biografía de equipo copiada entre páginas, un footer rehecho en cada plantilla. Haz una pregunta sencilla: ¿en cuántos sitios edito para cambiar nuestro teléfono? La respuesta correcta es uno.

Sin staging ni documentación de entrega#

Una construcción profesional se prueba antes de publicarse. Eso implica una copia de staging o el dominio de staging de Webflow, una revisión de formularios, redirecciones y seguimiento, y un camino claro para que un cambio llegue a producción. Si la propuesta no lo menciona, pregunta.

La documentación de entrega es la segunda mitad. Debe mapear tus colecciones y campos, indicar dónde vive cada pieza de código, listar quién es titular del workspace de Webflow, el plan de hosting, el repositorio y la cuenta de CDN, y explicar cómo publicar y revertir. Si la documentación es opcional o no tiene precio, prepárate para el día en que tu desarrollador no esté disponible.

Preguntas antes de contratar un desarrollador Webflow#

Las buenas preguntas convierten una llamada comercial en evidencia. Usa la lista de abajo para lo específico de Webflow y nuestras preguntas para una agencia de desarrollo web para una evaluación general.

Diez preguntas para la primera llamada#

Imprime esta lista y marca cada punto durante la llamada.

• Pídele que esboce en papel tus colecciones, referencias y campos antes de cualquier diseño
• Pregunta qué límites del CMS tiene en cuenta y dónde consulta los valores actuales
• Pregunta en cuántos sitios cambia un editor un teléfono o la biografía de un miembro del equipo
• Pregunta dónde vivirá el código a medida: ajustes del sitio, embeds del CMS o un repositorio externo
• Pregunta quién es titular del repositorio de código y de la cuenta de CDN tras el lanzamiento
• Pregunta cómo trabaja en staging y cómo llega un cambio a producción
• Pregunta cómo prueba formularios, redirecciones y seguimiento antes del lanzamiento
• Pregunta qué contiene el documento de entrega y si está incluido en el precio
• Pregunta cómo migra el contenido y las URL existentes, incluidas las redirecciones
• Pregunta qué pasa después del lanzamiento: quién corrige incidencias, con qué rapidez y a qué coste mensual

Pruebas de portafolio que muestran profundidad real#

Las capturas muestran diseño. La profundidad se ve en un sitio en vivo por el que puedas navegar y en la estructura que hay detrás. Revisa un portafolio en cuatro movimientos.

1. Abre un sitio con CMS en vivo

   Elige un proyecto con blog, recursos o un directorio. Prueba los filtros, las páginas de listado y dos páginas de elemento para comprobar su coherencia.

2. Revisa la estructura, con permiso

   Pide al candidato que comparta pantalla con las colecciones. Busca nombres claros, referencias en lugar de copias y pocos campos sin usar.

3. Inspecciona el origen del código

   Mira el código fuente de la página y los scripts cargados. Busca URL de CDN versionadas y carga diferida en lugar de grandes bloques pegados.

4. Pide el documento de entrega

   Solicita un ejemplo sin datos del cliente. Debe mapear colecciones, explicar campos y listar quién es titular de qué.

Pide también un proyecto con un volumen de contenido cercano al tuyo y un cliente anterior con quien puedas hablar. Después pregunta qué cambiaría hoy el desarrollador en ese proyecto. Una respuesta concreta y honesta te dice más que un caso de éxito pulido.

Cómo werun.dev construye y luego mantiene sitios Webflow#

El resultado que obtienes con werun.dev es un sitio Webflow que tu equipo edita sin nosotros y un equipo que sigue a tu lado tras el lanzamiento. Hemos cuidado más de 200 sitios durante más de 12 años, y el método de abajo es como empiezan los de Webflow.

Construcción: primero el modelo, luego el diseño, al final el código#

Empezamos con la sesión en papel de este artículo: tus tipos de contenido, tus editores y tu volumen a dos años se convierten en colecciones, referencias y filtros. El diseño viene después, con contenido real del modelo, para que las maquetas encajen con lo que publicas. El código va al final, en un repositorio que es tuyo, servido desde un archivo versionado en una CDN y revisado en staging antes de salir en vivo.

Durante la construcción usas Client Feedback para hacer clic en cualquier parte del sitio de staging y pedir un cambio, de modo que los comentarios llegan donde se hace el trabajo. Recibes un documento de entrega con el mapa de colecciones, la ubicación del código y la lista de titularidades. La página del servicio Webflow muestra la construcción con más detalle. El mismo proceso funciona en español para empresas de España, Argentina, México, Colombia y Uruguay, incluido el desarrollo web en Webflow que nos piden los equipos hispanohablantes.

Mantenimiento: plan Care y Retainer tras el lanzamiento#

Después del lanzamiento eliges cuánto apoyo quieres. El plan Care es un plan mensual que mantiene el sitio sano: monitorización, correcciones y actualizaciones de tu código y tus integraciones. El Retainer es un bloque mensual de horas para mejoras, como nuevas colecciones, nuevas plantillas o tests A/B con werun.Experiments.

En ambos casos recibes un informe mensual por escrito, un panel de cliente con tus proyectos, solicitudes y facturas, y una respuesta en menos de 2 horas en días laborables. Los dos conviven con los proyectos puntuales en la visión general de modalidades. Como el modelo y el código están documentados desde el primer día, el soporte es más barato de dar y más fácil de auditar para ti.

Por dónde empezar esta semana#

Dedica una hora a escribir una lista de una página con tus tipos de contenido. Para cada uno, anota quién lo edita, con qué frecuencia y cuántos elementos esperas dentro de dos años. Esa página es tu brief y también el material para la prueba en papel.

Después agenda llamadas con dos o tres candidatos y haz la prueba. Si quieres ver cómo modelaría werun.dev tu sitio, cuéntanos tu objetivo en la página de contacto. Puede ser más consultas, publicar más rápido o dedicar menos horas a las actualizaciones. Respondemos en menos de 2 horas en días laborables, y mientras esperas puedes leer sobre nuestro trabajo en Webflow.

Preguntas frecuentes#