Un diseño web profesional es el que parte de un objetivo de negocio medible y construye la página alrededor de él: arquitectura de información, jerarquía visual, velocidad de carga, accesibilidad y textos orientados a que quien entra haga algo concreto. No se valida con «me gusta cómo queda», se valida con formularios enviados, llamadas recibidas y pedidos cerrados. Se presupuesta por alcance —número de plantillas, contenidos, integraciones y nivel de personalización—, y las horquillas que circulan por el mercado español van desde unos cientos de euros por una landing sencilla hasta cifras de cinco dígitos en un ecommerce con catálogo grande e integración con la gestión.
Qué separa un diseño web profesional de una web que solo es bonita
La diferencia no está en la estética. Hay webs feas que facturan y webs premiadas que no generan una sola petición de presupuesto. Lo que distingue a un proyecto profesional es que cada decisión visual responde a una pregunta anterior: quién entra, desde dónde, con qué intención y qué queremos que haga antes de irse. Cuando esa pregunta no se contesta al principio, el resultado es una maqueta que gusta en la reunión de presentación y que después nadie sabe interpretar.
El encargo empieza por el objetivo, no por la plantilla
Una web de captación de leads para un despacho profesional, una tienda de 40 referencias y un catálogo B2B con tarifas por cliente son tres problemas distintos que comparten tecnología pero no diseño. La primera necesita que el formulario esté siempre a un clic y que la prueba de solvencia sea verificable. La segunda necesita fichas rápidas, fotos de producto honestas y un proceso de compra corto. La tercera necesita buscador, filtros y un área privada.
Por eso un diseño web serio empieza con trabajo aburrido: revisar qué tráfico tienes ya, qué páginas reciben visitas, qué consultas te llegan por teléfono o por correo, qué objeciones repite tu equipo comercial y qué hace la competencia que a ti te falta. Ese material es el que después decide el orden de los bloques de la portada.
Las tres capas que el visitante no ve y que deciden el resultado
- Capa técnica. Tiempo de carga real en móvil con conexión mediocre, tamaño de las imágenes, número de peticiones, estabilidad visual mientras se pinta la página. Una portada preciosa que tarda cinco segundos en mostrar el titular pierde visitas antes de comunicar nada.
- Capa semántica. Encabezados jerarquizados, texto en HTML y no dentro de imágenes, enlaces con texto descriptivo, datos estructurados coherentes con lo que se ve. Es lo que permite que un buscador entienda de qué va cada página y que un lector de pantalla pueda recorrerla.
- Capa de conversión. Dónde está la llamada a la acción, cuántos campos pide el formulario, qué información necesita alguien para atreverse a dejar su teléfono, qué pasa después de enviar. Casi todas las webs que «no funcionan» fallan aquí y se intenta arreglar cambiando colores.
Señales de que una web no es profesional aunque lo parezca
Hay indicios que se detectan en cinco minutos sin herramientas: el titular de la portada no dice a qué se dedica la empresa; el menú tiene doce entradas y ninguna clara; el teléfono no es un enlace pulsable en móvil; las imágenes son de banco y se repiten entre secciones; el formulario pide diez datos para «más información»; no hay aviso legal ni política de privacidad accesibles desde el pie; el texto está justificado y con tipografía de 13 píxeles; y el blog tiene tres entradas de hace cuatro años. Ninguno de esos puntos es de diseño gráfico, y todos hunden el rendimiento comercial de la página.
Una web no es un folleto con enlaces. Es el único vendedor de tu empresa que trabaja las 24 horas, no se cansa y atiende a todo el que llame a la puerta. Si no le has dicho qué tiene que preguntar y qué tiene que responder, hará lo que hace cualquier vendedor sin formación: sonreír y dejar marchar al cliente.
Qué incluye un proyecto de diseño web profesional, fase por fase
El desglose cambia de un proveedor a otro, pero las fases son reconocibles. Sirve como lista de comprobación cuando compares propuestas: si una oferta no menciona una de estas etapas, o está incluida sin decirlo o no se va a hacer.
1. Descubrimiento y definición de objetivos
Entrevistas con quien conoce el negocio, revisión de la analítica existente, inventario de contenidos que ya tienes y acuerdo sobre qué se va a medir. Sale de aquí el documento más útil del proyecto: una lista corta de acciones que la web debe provocar, ordenadas por valor. Sin ese acuerdo, cada revisión posterior se convierte en una discusión de gustos.
2. Arquitectura de información y mapa de la web
Qué páginas existen, cómo se agrupan, qué URL tendrá cada una y cómo se enlazan entre sí. Es la fase que más impacto tiene en SEO y la que más se salta. Aquí se decide si los servicios van en una sola página larga o en una página por servicio, si el blog cuelga de una carpeta, si hay páginas por ciudad y cómo se evita que dos páginas compitan por la misma búsqueda.
3. Wireframes y prototipo
Bocetos sin color ni tipografía definitiva para discutir el orden de los bloques y la cantidad de texto de cada uno. Cambiar un wireframe cuesta minutos; cambiar una plantilla ya maquetada cuesta días. Las propuestas que se saltan esta fase suelen acabar con rondas de revisión interminables sobre el diseño acabado.
4. Diseño de interfaz y sistema de diseño
Paleta, tipografías, escalas de tamaño, espaciados, estados de los botones, estilo de los formularios, tratamiento de imágenes y componentes reutilizables. Un sistema de diseño no es un lujo de proyecto grande: es lo que evita que la página nueva que añadas en seis meses parezca de otra web.
5. Maquetación y desarrollo
HTML semántico, CSS sin dependencias innecesarias, JavaScript solo donde aporta, imágenes en formatos modernos con dimensiones declaradas, tipografías precargadas y con font-display para que el texto sea legible mientras cargan. Aquí también se decide la gestión de contenidos: quién va a editar la web y con qué facilidad.
6. Contenidos, SEO on-page y datos estructurados
Títulos y descripciones por página, encabezados, enlazado interno, texto alternativo de imágenes, mapa del sitio, robots, canónicas y marcado de datos estructurados que describa lo que la página realmente contiene. Redactar los textos casi siempre es el cuello de botella del calendario, y conviene aclarar por escrito quién los escribe.
7. Analítica, consentimiento y medición
Instalación de la analítica, definición de eventos de conversión (envío de formulario, clic en teléfono, clic en WhatsApp, compra), integración con el gestor de consentimiento y verificación de que los datos llegan. Una web sin eventos configurados no permite saber si el rediseño mejoró algo, y esa es la única forma de justificar la inversión.
8. Pruebas, publicación y traspaso
Revisión en navegadores y dispositivos reales, comprobación de formularios y correos de aviso, redirecciones desde las URL antiguas, certificado activo, copias de seguridad, alta en Search Console y envío del mapa del sitio. El traspaso incluye credenciales, documentación mínima y una sesión de manejo del gestor. Si no te entregan los accesos, no es tu web.
| Fase | Entregable comprobable | Quién decide | Riesgo si se salta |
|---|---|---|---|
| Descubrimiento | Lista de objetivos medibles y públicos objetivo | Cliente, con guion del proveedor | Revisiones infinitas por criterios estéticos |
| Arquitectura | Mapa de páginas con URL definitivas | Proveedor, valida el cliente | Canibalización entre páginas y menús ilegibles |
| Wireframes | Prototipo navegable sin estilo final | Conjunta | Cambios estructurales sobre diseño ya cerrado |
| Interfaz | Plantillas y biblioteca de componentes | Proveedor | Incoherencia visual al crecer la web |
| Desarrollo | Entorno de pruebas accesible | Proveedor | Sorpresas en producción |
| Contenidos | Textos definitivos por página | Casi siempre el cliente | La causa número uno de retrasos |
| Medición | Eventos de conversión verificados | Proveedor | Imposible saber si el rediseño funcionó |
| Traspaso | Credenciales, copias y documentación | Proveedor | Dependencia total del proveedor |
Tipos de proyecto: web corporativa, a medida, tienda online o landing
Contratar más de lo necesario es tan caro como contratar menos. Estos son los cuatro formatos que cubren la mayoría de encargos y los criterios para elegir entre ellos.
Landing page
Una sola página con un objetivo único, pensada normalmente para recibir tráfico de pago o de una campaña concreta. No tiene menú de navegación o lo tiene reducido a propósito, porque cada enlace de salida es una fuga. Compensa cuando ya sabes qué oferta vas a promocionar y quieres medir su rendimiento aislado. Si tienes dudas sobre la estructura, en el blog hay una guía de landing pages y una recopilación de ejemplos comentados.
Diseño web corporativo
El formato más común: portada, una página por servicio, sobre la empresa, contacto y blog. Su valor está en la arquitectura, porque cada página de servicio es una puerta de entrada distinta desde buscadores. La versión pobre de este proyecto es una portada larga con todo dentro: se ve bien y no posiciona por nada.
Diseño de tienda online
Añade catálogo, carrito, pasarela de pago, gestión de pedidos, envíos, impuestos y toda la capa legal de venta a distancia. El diseño pasa a segundo plano frente a la ficha de producto, el buscador interno, los filtros y el proceso de pago. Es el tipo de proyecto donde más se subestima el trabajo de contenidos: cien fichas de producto son cien textos, cien conjuntos de fotos y cien decisiones de categorización.
En el diseño de una tienda online cuidamos sobre todo cuatro piezas: la plantilla de ficha (información propia, fotos reales, variantes bien resueltas y datos estructurados de producto coherentes con lo visible), las categorías como páginas que responden a búsquedas, un proceso de pago corto con los costes de envío visibles antes de pagar, y la información legal de venta a distancia. Para la parte de posicionamiento, consulta la página de SEO para ecommerce.
Diseño web a medida: portal, catálogo B2B o producto propio
Área privada, tarifas por cliente, presupuestos, integración con el ERP, buscadores con muchos filtros o funcionalidad propia. Aquí el diseño web es una parte pequeña de un proyecto de desarrollo, y tratarlo como si fuera una web corporativa grande es el error que hace descarrilar el presupuesto.
| Formato | Objetivo dominante | Nº de plantillas | Lo que más encarece | Cuándo NO elegirlo |
|---|---|---|---|---|
| Landing page | Una conversión concreta | 1 | Redacción persuasiva y variantes para test | Si esperas tráfico orgánico variado |
| Web corporativa | Captación de contactos cualificados | 4 a 8 | Número de páginas de servicio y de contenidos | Si tu venta es 100 % por catálogo |
| Tienda online | Venta directa | 6 a 12 | Catálogo, fotografía, envíos e impuestos | Si no tienes logística resuelta |
| Plataforma a medida | Operación interna o servicio digital | Variable | Integraciones y reglas de negocio | Si un SaaS existente ya lo cubre |
Cómo se presupuesta un diseño web y por qué las cifras se disparan
La pregunta «cuánto cuesta una web» no tiene respuesta por la misma razón que no la tiene «cuánto cuesta una casa». Lo que sí se puede explicar es qué variables mueven la cifra, para que al recibir dos presupuestos con diferencia de un orden de magnitud sepas qué estás comparando.
Las siete variables que explican casi toda la diferencia
- Número de plantillas distintas. No importa tanto cuántas páginas tenga la web como cuántos diseños diferentes hay que crear. Treinta páginas de servicio con la misma plantilla cuestan mucho menos que seis plantillas únicas.
- Grado de personalización. Adaptar una plantilla comprada, partir de un sistema de diseño propio o diseñar desde cero son tres esfuerzos con órdenes de magnitud distintos.
- Quién redacta los textos. Redacción profesional orientada a búsquedas es una partida en sí misma. Si la asumes tú, el presupuesto baja y el calendario depende de ti.
- Fotografía y recursos gráficos. Sesión propia, ilustración a medida o banco de imágenes. Las fotos genuinas son la mejora de conversión más barata que existe y la que más se evita.
- Integraciones. CRM, facturación, ERP, reservas, pasarelas, herramientas de email, área privada. Cada conexión es análisis, desarrollo y pruebas.
- Idiomas. Multiidioma no es traducir: es duplicar arquitectura, etiquetas hreflang, contenidos, mantenimiento y pruebas.
- Migración. Si ya tienes una web con tráfico, hay que inventariar URL, mapear redirecciones y vigilar la indexación después del cambio. Saltarse esto es la forma más rápida de perder posiciones ganadas durante años.
Cómo presupuestamos en Milbrotes
No publicamos una tarifa fija de diseño web, y desconfiamos de las tablas de «precios de mercado» que circulan sin fuente: dos webs corporativas de diez páginas pueden diferir en un orden de magnitud por las siete variables anteriores. Lo que hacemos es esto:
- Primera conversación (en Madrid con cita previa o por videollamada) para entender el objetivo, el punto de partida y los contenidos disponibles.
- Presupuesto cerrado por escrito con el número de plantillas, quién aporta textos y fotos, integraciones, idiomas, rondas de revisión y la lista de lo que queda fuera.
- Pago por hitos ligados a entregables comprobables (prototipo, entorno de pruebas, publicación).
Si antes de pedir presupuesto quieres saber si tu web actual se puede mejorar sin rehacerla, el informe de auditoría SEO cuesta 99 € y una hora de consultoría, 90 €. Para el posicionamiento continuado después del lanzamiento, los planes SEO van de 490 a 1.490 €/mes sin permanencia.
Diseño web en Madrid
Si tu negocio está en Madrid y prefieres reunirte en persona, trabajamos desde nuestra oficina de la calle Belalcázar 14, en Chamartín. Lo que cambia en una web para clientes locales (mapa, ficha de Google, zonas de servicio, WordPress) lo explicamos en diseño web en Madrid.
Costes recurrentes que hay que presupuestar aparte
El proyecto se paga una vez; la web cuesta dinero todos los años. Estas partidas aparecen siempre y conviene verlas escritas antes de firmar:
- Dominio. Es un coste anual pequeño, pero imprescindible: que esté registrado a nombre de tu empresa, no del proveedor.
- Alojamiento. Desde un alojamiento compartido hasta un servidor gestionado. El salto se justifica por tráfico, por requisitos de la tienda o por tiempo de respuesta.
- Certificado TLS. La mayoría de alojamientos incluyen certificados gratuitos renovados automáticamente. Pagar por uno solo tiene sentido en casos concretos.
- Licencias. Temas y extensiones de pago se renuevan cada año; si caducan, dejas de recibir actualizaciones de seguridad.
- Mantenimiento. Actualizaciones, copias, monitorización y pequeños cambios. Se contrata por cuota mensual o por bolsa de horas.
- Comisiones. En tienda online, la pasarela de pago se lleva un porcentaje de cada venta más una parte fija por transacción, y las plataformas de tipo SaaS suman su cuota.
Modelos de contratación
Precio cerrado: funciona cuando el alcance está definido con detalle y hay un anexo que dice qué queda fuera. Es el modelo que prefiere casi todo cliente y el que más conflictos genera si la definición era vaga. Bolsa de horas: adecuada para evolución continua o para proyectos donde el alcance se descubre por el camino; exige confianza y partes de trabajo transparentes. Por iteraciones: se acuerda un presupuesto por bloques entregables y se decide al final de cada bloque si se continúa; es el modelo más honesto en proyectos grandes y el que menos se ofrece.
Un presupuesto de diseño web que no especifica número de plantillas, quién redacta los textos y qué pasa con las URL antiguas no es un presupuesto: es una cifra. Pide siempre el alcance por escrito, incluida la lista de lo que queda fuera.
Rendimiento: lo que Google mide y lo que se puede prometer
La velocidad dejó de ser una cuestión de sensaciones cuando Google publicó umbrales concretos. Las llamadas métricas web principales se miden sobre visitas reales, en el percentil 75, y con datos separados de móvil y escritorio. Los umbrales para considerar la experiencia «buena» son estos:
| Métrica | Qué mide | Bueno | Mejorable | Deficiente |
|---|---|---|---|---|
| LCP (Largest Contentful Paint) | Cuándo se pinta el elemento principal | ≤ 2,5 s | 2,5 – 4 s | > 4 s |
| INP (Interaction to Next Paint) | Respuesta a la interacción del usuario | ≤ 200 ms | 200 – 500 ms | > 500 ms |
| CLS (Cumulative Layout Shift) | Estabilidad visual mientras carga | ≤ 0,1 | 0,1 – 0,25 | > 0,25 |
De dónde sale casi siempre un LCP malo
El culpable suele ser el mismo: la imagen grande de la portada, subida a resolución completa, sin formato moderno y cargada después de tres hojas de estilo y dos librerías de JavaScript. A eso se suman los carruseles automáticos, los vídeos de fondo, las tipografías que bloquean el pintado y las etiquetas de terceros (chats, mapas, píxeles publicitarios) cargadas en la cabecera. El arreglo no es misterioso: dimensionar las imágenes al tamaño en que se muestran, servirlas en formatos modernos, precargar solo el recurso que compone el elemento principal, aplazar todo lo que no se necesita para el primer pintado y cargar los mapas y chats cuando el usuario los pide. Si quieres el detalle técnico, hay una explicación más larga en la guía de Core Web Vitals.
Decisiones de diseño que encarecen el rendimiento
Conviene saberlo antes de aprobar una maqueta. Los fondos con vídeo, las animaciones al desplazar, los carruseles de logotipos, las fuentes variables con muchos pesos, los efectos de paralaje y los mapas incrustados en la portada tienen un coste medible. Ninguno está prohibido, pero cada uno debería ganarse el sitio. La pregunta útil en la reunión de diseño no es «¿queda bien?», es «¿qué me aporta esto frente a lo que cuesta en carga y en estabilidad visual?».
Un aviso sobre las puntuaciones
La nota de cien puntos de las herramientas de auditoría es un dato de laboratorio con una configuración concreta, no lo que experimentan tus visitantes. Un proveedor que garantice «100 en PageSpeed» está prometiendo algo que depende de plugins, etiquetas de marketing y contenidos que cambiarán la semana siguiente al lanzamiento. Lo razonable es comprometerse con los umbrales de campo en las plantillas entregadas y dejar por escrito qué ocurre si después se añaden herramientas de terceros.
Accesibilidad: en España ya es obligación legal, no un extra
Este es el cambio más relevante de los últimos años para quien encarga una web en España y sigue sin aparecer en la mayoría de presupuestos. La Directiva (UE) 2019/882, conocida como Acta Europea de Accesibilidad, se traspuso con la Ley 11/2023, de 8 de mayo, desarrollada por el Real Decreto 193/2023. Sus requisitos de accesibilidad son aplicables desde el 28 de junio de 2025 a una lista de productos y servicios que incluye el comercio electrónico, los servicios bancarios para consumidores, el transporte de pasajeros, los libros electrónicos y los servicios de comunicación audiovisual.
A quién obliga y quién queda fuera
No afecta a todas las webs por igual. Si vendes a consumidores por internet, entras. Si eres una microempresa que presta servicios —menos de diez trabajadores y volumen de negocio anual o balance general que no supere los dos millones de euros—, la ley te exime de las obligaciones relativas a servicios, aunque la exención no alcanza a los fabricantes de productos. Y si el sitio pertenece al sector público o a una entidad que presta servicios públicos, el régimen aplicable es otro, el del Real Decreto 1112/2018, que exige el nivel AA de las WCAG desde antes.
La norma técnica de referencia es la EN 301 549, que a su vez remite a las Pautas de Accesibilidad para el Contenido Web (WCAG) del W3C. La versión actual de las pautas es la 2.2, y el nivel que se usa como referencia legal en la práctica es el AA. Conviene decirlo sin adornos: cumplir no es poner un botón que agranda la letra ni instalar un accesorio de accesibilidad. Los overlays automáticos son precisamente el enfoque que más críticas recibe del colectivo de usuarios de tecnología asistiva, porque tapan los problemas sin resolverlos.
WCAG 2.2 nivel AA traducido a decisiones de diseño
- Contraste. Al menos 4,5:1 entre texto y fondo en tamaño normal, y 3:1 en texto grande y en los componentes de interfaz. Adiós al gris claro sobre blanco y al texto sobre fotografía sin capa de oscurecimiento.
- Teclado. Todo lo que se puede hacer con ratón se tiene que poder hacer con teclado, con un indicador de foco visible y no tapado por cabeceras fijas o barras de cookies.
- Formularios. Etiquetas asociadas a cada campo, no solo texto de ejemplo dentro del recuadro; errores descritos en texto y no solo en rojo; instrucciones que no dependan del color ni de la forma.
- Imágenes. Texto alternativo que describa la función de la imagen, y alternativo vacío en las decorativas para que los lectores de pantalla no las anuncien.
- Ampliación y adaptación. La página debe seguir siendo usable al ampliar al 200 % y al reducir el ancho equivalente a 320 píxeles, sin desplazamiento horizontal ni contenido cortado.
- Tamaño de los objetivos. Las WCAG 2.2 añaden un mínimo de 24 por 24 píxeles CSS para los elementos pulsables, con excepciones. Afecta directamente a los iconos de redes sociales y a los menús compactos de móvil.
- Ayuda consistente y menos carga cognitiva. Si hay contacto o ayuda, que aparezca en el mismo sitio en todas las páginas, y que la autenticación no exija recordar o transcribir datos sin alternativa.
- Movimiento. Todo carrusel o animación que se mueva más de cinco segundos necesita un control para pararla, y conviene respetar la preferencia del sistema de reducir movimiento.
Qué pedir en el presupuesto
Una línea que diga «accesibilidad WCAG 2.2 nivel AA en las plantillas entregadas, con informe de comprobación» y, si tu actividad está en el ámbito de la Ley 11/2023, una mención expresa a esa norma. Sin ese punto por escrito, la accesibilidad se convierte en una reforma posterior que cuesta más que haberla hecho bien. Este es además un terreno donde conviene contar con asesoramiento jurídico propio: la aplicación de las excepciones y la valoración de la carga desproporcionada son decisiones legales, no técnicas.
El posicionamiento se decide en el diseño, no después
Contratar la web a un proveedor y el SEO a otro seis meses después es la secuencia más cara posible, porque las decisiones que más pesan en buscadores se toman en la fase de arquitectura, cuando el SEO todavía no está en la sala.
Arquitectura, URL y enlazado interno
Una página por intención de búsqueda, URL cortas y estables en minúsculas y sin parámetros innecesarios, un solo idioma por URL, jerarquía de carpetas que refleje la del menú y enlaces internos con texto descriptivo. Dos páginas que atacan la misma búsqueda se hacen la competencia entre ellas y ninguna sube: se resuelve fusionando o diferenciando, y es mucho más fácil evitarlo en el mapa del sitio que arreglarlo con el sitio publicado.
Contenido indexable y encabezados
Un H1 por página que diga de qué va, H2 y H3 que organicen el texto de forma que se pueda leer el índice y entender la página, texto en HTML y no dentro de imágenes o vídeos, y contenido visible sin necesidad de pulsar en pestañas o acordeones que lo oculten al rastreador. El contenido que solo se pinta con JavaScript después de una interacción es contenido que puede no contar.
Datos estructurados y respuestas para buscadores generativos
El marcado de datos estructurados sirve para que un buscador identifique qué tipo de entidad describe la página: organización, servicio, producto, artículo, preguntas frecuentes. Tiene una regla que se incumple mucho: el marcado debe corresponderse con lo que se ve. Declarar valoraciones que no existen o preguntas que no están en la página es motivo de penalización, además de una mentira. Con la irrupción de las respuestas generadas, el criterio se ha endurecido: la coherencia entre texto visible, encabezados y marcado es lo que permite que un sistema cite tu página como fuente. Hemos desarrollado este aspecto en la página de posicionamiento para buscadores con IA.
Migraciones: donde se pierde el tráfico ganado
Si tu web actual recibe visitas orgánicas, el rediseño es una operación de riesgo. Lo que hay que exigir: inventario completo de URL indexadas antes de tocar nada, mapa de redirecciones 301 una a una hacia la página equivalente (no todas a la portada), conservación de títulos y contenido que ya rankeaba, revisión de canónicas, mapa del sitio nuevo enviado a Search Console y seguimiento de cobertura y posiciones durante las semanas siguientes. Perder una parte importante del tráfico tras un rediseño es frecuente y casi siempre evitable. Si dudas del estado de partida, una auditoría previa evita sorpresas.
Conversión: el diseño que vende se puede medir
Jerarquía de la propuesta
La parte alta de la página tiene que responder tres preguntas en cinco segundos: qué haces, para quién y qué quieres que haga el visitante. Un titular que dice «Soluciones integrales a medida» no responde ninguna. El titular útil nombra el problema del cliente o el resultado que consigue, y va acompañado de una frase que aclare el alcance y de una llamada a la acción visible sin desplazar la página.
Formularios
Cada campo que añades reduce el número de envíos. Pide lo mínimo para dar el siguiente paso y deja el resto para la conversación. Etiquetas encima del campo, tipos de teclado adecuados en móvil, validación clara, un solo botón con texto que diga qué va a pasar («Pedir presupuesto», no «Enviar») y una página o mensaje de confirmación que explique cuándo y cómo te van a contestar. Y una obligación legal además de una buena práctica: la casilla de consentimiento nunca marcada por defecto y con enlace a la política de privacidad.
Prueba social honesta
Los logotipos de clientes, los casos documentados y las reseñas de plataformas verificables funcionan. Las cifras inventadas, los testimonios sin persona detrás y los sellos de calidad que nadie ha concedido no solo no convierten: destruyen la confianza en cuanto alguien tira del hilo, y pueden ser publicidad engañosa. Si no tienes todavía material de este tipo, es mejor no tener nada y compensar con claridad en el alcance y en las condiciones.
Qué medir desde el primer día
- Envíos de formulario, por formulario y por página de origen.
- Clics en teléfono y en WhatsApp, que en móvil suelen superar a los formularios.
- Porcentaje de visitantes que llega al bloque de contacto.
- Páginas de entrada orgánica y consultas que las traen.
- En tienda: añadidos al carrito, inicios de pago y abandonos por paso.
Sin estos eventos configurados, cualquier afirmación sobre si el rediseño funcionó es una opinión. Con ellos, la discusión del año siguiente deja de ser sobre colores.
Requisitos legales que condicionan el diseño
Esta parte no es decorativa: determina qué páginas existen, qué enlaces lleva el pie y cómo se comporta la web en la primera visita. Lo que sigue es una orientación general; para tu caso concreto, contrasta con un profesional del derecho.
Información obligatoria y textos legales
La Ley 34/2002 de servicios de la sociedad de la información obliga a identificar al prestador de forma permanente, fácil, directa y gratuita: denominación, NIF, domicilio, correo electrónico y datos registrales cuando procedan, además del colegio profesional y el título académico en las profesiones reguladas. En la práctica, eso significa un aviso legal accesible desde todas las páginas. A eso se suman la política de privacidad exigida por el Reglamento (UE) 2016/679 y la Ley Orgánica 3/2018, y las condiciones de contratación cuando se vende.
Cookies y consentimiento
El artículo 22.2 de la misma ley exige consentimiento informado para cualquier cookie que no sea estrictamente necesaria. El criterio de la Agencia Española de Protección de Datos, recogido en su guía sobre el uso de cookies, se traduce en requisitos concretos de diseño: rechazar tiene que ser tan sencillo como aceptar, el consentimiento no se obtiene por seguir navegando ni por desplazar la página, los muros de cookies solo se admiten si existe alternativa real, y las etiquetas de analítica y publicidad no pueden dispararse antes de la aceptación. Si además haces publicidad con Google en el Espacio Económico Europeo, necesitas un gestor de consentimiento que transmita las señales que exige su modo de consentimiento.
Si vendes: derechos del consumidor que hay que reflejar en la web
- Desistimiento. Catorce días naturales para desistir sin justificación en venta a distancia, con derecho a comprobar el producto (artículos 102 a 108 del Real Decreto Legislativo 1/2007). Las excepciones son tasadas; entre ellas, los bienes confeccionados conforme a especificaciones del consumidor. Las cláusulas del tipo «solo se aceptan devoluciones sin abrir y en su embalaje original» son contrarias a la norma.
- Garantía. Tres años de garantía legal de conformidad en bienes, desde la reforma del Real Decreto-ley 7/2021, para compras posteriores al 1 de enero de 2022. Muchísimas fichas de producto siguen diciendo dos años.
- Precio anterior. Cuando se anuncia una rebaja, el precio de referencia debe ser el más bajo aplicado en los treinta días previos, según el artículo 20 de la Ley 7/1996 de Ordenación del Comercio Minorista en la redacción dada por el Real Decreto-ley 24/2021, que transpuso la Directiva (UE) 2019/2161. Un descuento permanente en toda la tienda no cumple esa regla.
- Resolución de conflictos e impuestos. Información sobre reclamaciones, gastos de envío antes del pago y el tipo impositivo correcto: en Canarias se aplica el IGIC, no el IVA peninsular.
Tecnología: WordPress, plataforma en la nube, headless o estático
No hay una respuesta buena para todos. Hay una respuesta buena para tu equipo, tu presupuesto y quien va a mantener la web dentro de dos años.
| Enfoque | Puntos fuertes | Puntos débiles | Encaja cuando… |
|---|---|---|---|
| Gestor de contenidos clásico (tipo WordPress) | Edición autónoma, ecosistema enorme, perfiles fáciles de contratar | Mantenimiento y seguridad continuos; rendimiento degradado por acumulación de extensiones | Necesitas publicar contenido a menudo sin depender de nadie |
| Plataforma de comercio en la nube | Pagos, impuestos y seguridad resueltos; puesta en marcha rápida | Cuota fija más comisión por venta; personalización limitada; dependencia del proveedor | Vender es la prioridad y no quieres administrar infraestructura |
| Arquitectura desacoplada (gestor por API y capa de presentación propia) | Rendimiento alto, reutilización del contenido en varios canales | Coste de desarrollo mayor; dependencia de perfiles técnicos | Hay varios canales, mucho tráfico o requisitos de interfaz propios |
| Sitio estático generado | Velocidad y seguridad máximas, alojamiento barato | Edición menos cómoda sin panel; funciones dinámicas requieren servicios aparte | Contenido que cambia poco y prioridad absoluta en velocidad |
Alojamiento y dominio
El alojamiento gratuito o excesivamente barato acaba costando en tiempo de respuesta, en caídas y en soporte inexistente. Para una web corporativa española, un alojamiento con servidores en Europa, copias de seguridad diarias con restauración comprobada, certificado incluido, protocolo HTTP moderno y soporte en castellano cubre el caso sin excesos. Del dominio, tres reglas: registrado a nombre de tu empresa, con los datos de contacto actualizados y con renovación automática activada. Perder un dominio por un correo de aviso en un buzón que ya nadie lee es más común de lo que parece.
Propiedad del código y dependencias
Pregunta incómoda y necesaria: si mañana cambias de proveedor, ¿qué te llevas? Deberías poder llevarte el dominio, el contenido, las imágenes originales, el acceso al alojamiento y al gestor con permisos de administrador, y el código de las plantillas hechas a medida. Si el diseño depende de un maquetador visual con licencia del proveedor, de una plantilla que no es tuya o de un panel propietario, tu web no es portable y eso tiene un precio que se paga más tarde.
Cómo elegir proveedor y qué debe decir la propuesta
Preguntas que separan a los proveedores en diez minutos
- ¿Cuántas plantillas distintas contempla el presupuesto y qué pasa si pido una más?
- ¿Quién redacta los textos y quién aporta las fotos?
- ¿Qué hacéis con las URL de mi web actual y quién controla la indexación después del cambio?
- ¿Qué eventos de conversión vais a configurar y cómo compruebo que funcionan?
- ¿Se entrega con accesibilidad AA y con informe de comprobación?
- ¿Podré editar los textos y publicar entradas sin llamaros?
- ¿Qué licencias de pago necesita la web y quién las renueva?
- ¿Qué incluye exactamente el mantenimiento y qué se factura aparte?
- ¿A nombre de quién quedan el dominio, el alojamiento y el código?
- ¿Cuántas rondas de revisión hay y cómo se tramita un cambio fuera de alcance?
Lo que debe figurar por escrito
Alcance con número de plantillas y páginas, lista explícita de exclusiones, reparto de responsabilidades de contenidos, número de rondas de revisión, condiciones de pago por hitos, plazo de garantía de corrección de errores tras la entrega, titularidad de dominio y código, entregables del traspaso y condiciones del mantenimiento posterior. Un contrato de dos folios con estos puntos evita la mayoría de los conflictos que acaban en un proyecto abandonado a medias.
Banderas rojas
- Garantías de posición: nadie puede prometer el primer puesto en Google, y quien lo hace está vendiendo humo o comprando riesgo con técnicas que te pueden costar la visibilidad.
- Presupuesto de una línea con un precio y sin desglose de alcance.
- Negativa a entregar credenciales de administrador o a registrar el dominio a tu nombre.
- Cifras de resultados sin poder decir de qué proyecto son ni cómo se midieron.
- Plazos cerrados antes de saber quién escribe los textos.
- Mantenimiento obligatorio y perpetuo como condición para entregar la web.
Si un proveedor no te puede explicar en lenguaje corriente por qué su propuesta cuesta lo que cuesta, el problema no es que sea muy técnico. El problema es que no ha definido el alcance, y ese coste lo vas a pagar tú en forma de revisiones, retrasos y partidas que aparecen a mitad del proyecto.
Después del lanzamiento: mantenimiento y evolución
Publicar no es terminar. Una web sin mantenimiento acumula versiones desactualizadas del gestor y de sus extensiones, enlaces internos rotos, formularios que dejaron de enviar correos sin que nadie se diera cuenta y contenidos que envejecen mal. El mantenimiento mínimo razonable incluye actualizaciones con copia previa y comprobación posterior, copias de seguridad verificadas restaurándolas de vez en cuando, monitorización de disponibilidad, revisión periódica de que los formularios llegan, vigilancia de errores en Search Console y revisión del rendimiento después de cada cambio importante.
La evolución es otra cosa y merece su propio presupuesto: nuevas páginas de servicio, contenidos que atacan búsquedas que antes no cubrías, mejoras de conversión a partir de lo que dicen los datos, y adaptación a cambios normativos o de plataforma. La forma más rentable de trabajar una web no es rediseñarla cada tres años, sino tocarla todos los meses con criterio. Ahí es donde el trabajo continuado de SEO, la automatización del seguimiento de leads y la inversión en publicidad se apoyan en el diseño en lugar de pelearse con él.
Un calendario realista de revisión
- Mensual: actualizaciones, copias, prueba de formularios, revisión de errores de rastreo.
- Trimestral: métricas de conversión por página, contenidos que han perdido posiciones, enlaces internos y velocidad.
- Anual: revisión de textos legales, renovaciones de dominio y licencias, repaso de accesibilidad y decisión sobre qué secciones merecen ampliarse.
Si estás valorando un proyecto y quieres saber qué necesita exactamente tu caso, lo sensato es empezar por el diagnóstico y no por la maqueta: cuéntanos el punto de partida y lo revisamos antes de hablar de números.