Cómo construimos webs que convierten
Proceso en 4 fases. 14-21 días típicos. Stack moderno con WordPress, Next.js y Supabase. KPIs medibles desde el primer día de entrega. Sin sorpresas y sin letra pequeña.
4 fases. Sin atajos, sin sorpresas
Cada proyecto pasa por las mismas cuatro fases. El orden importa: no escribimos código antes de tener el diseño aprobado, y no aprobamos el diseño sin un briefing sólido.
Lo que hacemos antes de diseñar nada
Antes de abrir Figma, necesitamos entender tu negocio. No el tuyo genérico de "empresa de servicios en Barcelona", sino el tuyo específico: quién compra, qué los frena, qué hace diferente tu oferta. Con eso claro, cada decisión de diseño tiene sentido.
Esta fase incluye una reunión de 60 minutos (presencial si estás en Barcelona, videoconferencia si no), un cuestionario estructurado que mandamos antes para que no perdamos tiempo en lo básico, análisis SEO de tus 3 competidores directos y wireframes provisionales de la estructura. Al final: un brief escrito firmado por los dos lados.
- Reunión 60 min (presencial o vídeo)
- Cuestionario previo estructurado
- Análisis SEO competidores top 3
- Definición de KPIs y objetivos
- Wireframes provisionales estructura
- Brief escrito firmado ambas partes
Diseño visual antes del código. Siempre.
Empezamos con un moodboard de 3 direcciones visuales: paleta, tipografía, estilo fotográfico y tono general. Eliges la que encaja. Después diseñamos la home completa más 2 páginas internas en Figma con todo el detalle: versión escritorio y móvil.
Dos rondas de revisión incluidas. Cuando das el OK, firmamos la aprobación visual. Ese punto es el único prerequisito para arrancar el desarrollo. Lo hacemos así para no rehacer código por cambios de diseño: perdemos tiempo y tú dinero.
- Moodboard con 3 direcciones visuales
- Diseño home + 2 páginas en Figma
- Versión escritorio y móvil
- Dos rondas de revisión incluidas
- Aprobación escrita antes de código
- Tipografías y paleta definitivas
El stack correcto para cada proyecto, no el más cómodo para nosotros
WordPress con Elementor para webs donde el cliente va a editar contenido con frecuencia. WooCommerce para tiendas online con catálogo estándar. Next.js con Vercel para webs que necesitan velocidad extrema, internacionalización o funcionalidades custom. Supabase para SaaS B2B o aplicaciones con base de datos propia.
En todos los casos: schema markup desde el primer día (no como parche al final), Lighthouse score objetivo ≥85, SEO técnico básico incluido, diseño mobile-first y QA manual en Chrome, Safari y Firefox, más iOS y Android.
- WordPress + Elementor (edición fácil)
- WooCommerce (e-commerce estándar)
- Next.js + Vercel (custom / rendimiento)
- Supabase (SaaS / apps B2B)
- Schema markup desde día 1
- Lighthouse ≥85 · mobile-first
- QA Chrome / Safari / Firefox
- QA iOS y Android
Entregamos web, accesos y conocimiento
Publicamos en tu dominio. Después hacemos una sesión de 60 minutos donde te enseñamos a editar tu web: cambiar textos, subir imágenes, añadir una página nueva. Todo grabado si quieres volver a verlo. Te damos también un manual PDF personalizado con los pasos concretos de tu web, no un tutorial genérico de WordPress.
30 días de soporte post-entrega incluidos: si algo falla, si te confundes en algo, si notas un error en móvil que no vimos. Search Console y GA4 instalados y verificados para que desde el primer día sepas cuánta gente visita tu web y desde dónde llega.
- Publicación en tu dominio
- Sesión formación 60 min
- Manual PDF personalizado
- GA4 + Search Console verificados
- Backup automático configurado
- 30 días soporte incluido
- Acceso completo: dominio, hosting, código
- Sin permanencia ni dependencia
Herramientas que usamos y por qué
Sin dogmas de "solo usamos X". Cada herramienta tiene un caso de uso concreto y lo explicamos.
Frontend
WordPress + Elementor cuando el cliente edita contenido. Next.js + React cuando necesitamos SSR, i18n o rendimiento máximo. HTML/CSS/JS puro para webs de catálogo sin gestor.
Backend
PHP/WordPress para webs estándar. Node.js/Next.js API routes para funcionalidades custom. Flask/Python para apps de gestión interna. Supabase como base de datos para SaaS B2B.
Pagos
Stripe para suscripciones y pagos únicos internacionales. Redsys para tiendas con banco español. GoCardless para domiciliaciones. PayPal cuando el cliente ya lo tiene integrado.
Email y comunicación
Resend para transaccional (confirmaciones, facturas). Brevo para campañas y automatizaciones simples. Mailchimp si el cliente ya tiene listas allí y no vale la pena migrar.
Hosting
BanaHosting para webs de clientes estándar (hosting compartido, buen rendimiento en España, precio razonable). DigitalOcean o Hetzner para apps custom que necesitan VPS. Vercel para Next.js.
Analytics y métricas
Google Analytics 4 + Search Console en todos los proyectos sin excepción. Hotjar para mapas de calor cuando el cliente quiere ver comportamiento de usuario. PostHog para productos SaaS con eventos custom.
Con qué trabajamos internamente
Transparencia total sobre cómo se organiza un proyecto de principio a fin.
Diseño
- Figma (UI/UX, prototipos)
- Adobe Illustrator (SVG, logos)
- Adobe Photoshop (retoque foto)
- Unsplash / Freepik (imágenes)
Gestión
- Notion (documentación)
- Linear (seguimiento tareas)
- Slack (comunicación interna)
- Google Meet (reuniones)
Código
- VS Code + Cursor
- GitHub (control versiones)
- Local by Flywheel (WP dev)
- Vercel (preview / deploy)
SEO
- Ahrefs (keywords, backlinks)
- Search Console (indexación)
- RankMath / Yoast (WP SEO)
- PageSpeed Insights (Core Web Vitals)
Lo que no es negociable
Estos 10 puntos van en todos los proyectos sin excepción, sin importar el precio ni el plazo. No son extras.
Qué no incluye el precio base
Honestidad antes de que firmes. Estas cosas tienen sentido como servicios separados porque no todos los proyectos las necesitan.
Copywriting profesional
Textos de venta redactados por especialista: home, about, servicios. No incluye textos de blog ni contenido recurrente.
Fotografía profesional
Sesión fotográfica de producto, espacio o equipo. Incluye edición y entrega en alta resolución. Trabajamos con fotógrafos de Barcelona de confianza.
Traducción multidioma
Traducción de todos los textos de la web + configuración técnica WPML o i18n en Next.js. El proceso de integración técnica está incluido; el coste de traducción, no.
Hosting año 2 en adelante
El primer año de dominio va incluido. El hosting y la renovación del dominio a partir del segundo año van por tu cuenta: entre 60€ y 200€/año según las necesidades del proyecto.
SEO mensual
El SEO técnico básico va incluido. Si quieres posicionamiento activo (contenido, linkbuilding, auditorías recurrentes), es un servicio aparte completamente opcional.
Mantenimiento mensual
Actualizaciones de WordPress, plugins y copias de seguridad gestionadas. No es obligatorio: la web funciona sola, pero si prefieres no ocuparte, tenemos plan opcional.
Dudas sobre el proceso
Las preguntas reales que nos hacen antes de arrancar un proyecto.
¿Más preguntas? WhatsApp directo · info@websbarcelona.com
¿Listo para empezar?
Briefing gratuito en 24h. Cuéntanos tu proyecto y en menos de un día tienes propuesta y fecha de entrega. Sin compromiso.
También puedes ver portfolio de proyectos · tabla de precios · blog