Una web médica a medida para el Dr. Fran Rivas: diseño, tecnología y confianza

Crear una web médica especializada requiere mucho más que una buena primera impresión. El diseño tiene que transmitir confianza, ayudar a comprender la información y facilitar el contacto sin convertir una decisión sanitaria en una promesa comercial. Ése fue el punto de partida de nuestro trabajo con el Dr. Fran Rivas: desarrollar una nueva presencia digital para su proyecto Engrosamiento de Pene Barcelona.

Abordamos el proyecto desde cero, con una identidad propia y un objetivo claro: una experiencia informativa, discreta y fácil de utilizar, preparada para incorporar tratamientos y contenidos médicos de forma ordenada. Esto es lo que decidimos, por qué, y lo que todavía no se puede afirmar.

El reto: construir una web especializada, no copiar una referencia

El encargo comenzó con una web de referencia del sector y una propuesta visual en HTML. La referencia nos ayudó a estudiar el recorrido del visitante —presentación del tratamiento, información, profesional, preguntas frecuentes y contacto—, pero no queríamos reproducir sus textos, su marca ni su diseño.

La propuesta debía responder a las necesidades reales del doctor: una web centrada en recibir solicitudes de valoración, con información clara, presencia del profesional y capacidad para crecer con nuevos contenidos. También debía ser sencilla de mantener y permitir que el doctor y el estudio compartiéramos la gestión editorial.

Antes de elegir la tecnología preparamos un cuestionario de definición del proyecto. Sus respuestas fueron decisivas: el doctor quería poder editar determinados contenidos, publicar ocasionalmente en el blog, mostrar varios tratamientos y conectar la web con sus canales de atención y reserva.

Una identidad propia y discreta

Trabajamos una dirección visual sobria y contemporánea, alejada tanto de las plantillas clínicas genéricas como de la estética comercial excesiva. Buscamos un equilibrio entre profesionalidad, elegancia, claridad y discreción.

La estructura se pensó para guiar al visitante por la información, no para obligarlo a navegar sin rumbo. La portada combina la presentación del servicio, la explicación del proceso, el perfil profesional, el acceso a las consultas, las preguntas frecuentes y las llamadas a la acción. Las páginas interiores amplían los temas que merecen una explicación independiente.

El proyecto se apoya en una composición limpia, tipografía legible, fotografías profesionales e imágenes pertinentes. Las imágenes clínicas y los testimonios no se trataron como elementos decorativos: su posible uso exige criterios específicos de autorización y de adecuación sanitaria.

La decisión tecnológica: primero las necesidades

En una primera fase valoramos Astro para desarrollar una web estática, muy ligera y alojada en una infraestructura orientada a servir archivos. Es la tecnología con la que construimos nuestro propio sitio, y también revisamos nuestra experiencia previa desplegando Astro en alojamiento compartido.

Sin embargo, las respuestas del cliente cambiaron el criterio decisivo. La web debía ofrecer cierta autonomía editorial, con un blog y la posibilidad de incorporar tratamientos sin depender siempre de cambios en código.

01 · Lo que pidió el cuestionario

• Editar contenidos sin tocar código
• Publicar en el blog de vez en cuando
• Añadir tratamientos nuevos
• Gestión editorial compartida con el estudio

02 · Opciones valoradas

Astro

Web estática, muy ligera.

Tal como se planteó, cada cambio de contenido pasaba por el código.

WordPress + Gutenberg

Edición conocida, desde el panel.

Tema de bloques propio y plugin del proyecto. Sin Elementor.

03 · Decisión

WordPress con Gutenberg y un tema de bloques propio.

No por ser mejor en general: porque la edición autónoma pesaba más que cualquier otra cosa en este proyecto.

Por eso elegimos WordPress con Gutenberg y un tema de bloques propio, en lugar de Elementor u otro constructor visual de pago. No porque WordPress sea mejor en general, ni Astro peor: en otro proyecto, con otras necesidades, la respuesta sería distinta. Aquí, la edición autónoma pesaba más que cualquier otra cosa.

Un tema para la presentación, un plugin para la lógica

Desarrollamos además las funcionalidades específicas mediante un plugin del proyecto, separando la presentación de la lógica que debe mantenerse aunque el diseño evolucione. Un rediseño futuro puede cambiar el tema por completo sin tocar cómo se revisan los contenidos o cómo se mide la web.

Esta arquitectura combina un frontal cuidado con una administración de contenidos conocida, patrones reutilizables y menos dependencias de terceros.

1. Contenidos

   • Tratamiento principal
   • Profesional
   • Consultas
   • Contacto
   • Preguntas frecuentes
   • Artículos

2. Edición

   WordPress + Gutenberg

   Donde el doctor y el estudio editan.

3. Presentación

   Tema de bloques propio

   Diseño, plantillas y patrones reutilizables.

   Lógica

   Plugin del proyecto

   Lo que debe sobrevivir a un rediseño: revisión por versión y analítica con consentimiento.

4. Web pública

Alrededor

SEO técnico

URLs, metadatos, sitemap y enlazado

Contacto

WhatsApp, teléfono y Doctoralia, ya existentes

Cambios

Git, despliegues orquestados y QA

Alojamiento

SiteGround, con Cloudflare delante

Contenido estructurado y revisión profesional

Organizamos el proyecto alrededor del tratamiento principal, el perfil profesional, las consultas, la información de contacto, las preguntas frecuentes y un conjunto inicial de artículos médicos.

Un aspecto importante fue separar la redacción, la revisión profesional y la publicación. Los contenidos clínicos cuentan con un mecanismo que vincula la revisión a una versión concreta del texto. Así se pueden detectar cambios posteriores sin confundir una aprobación anterior con una nueva redacción.

Primera redacción

1. Borrador v1
2. Revisión profesional asociada a v1
3. Aprobada v1
4. Publicable v1

Después de editar

1. Edición cambia el texto
2. Borrador v2
3. La aprobación de v1 no cubre v2
4. Nueva revisión asociada a v2

La revisión clínica es responsabilidad del doctor. Lo que aporta el sistema es que esa responsabilidad se pueda ejercer sobre el texto exacto que se va a publicar.

También diseñamos el mantenimiento para respetar las modificaciones hechas desde WordPress: la automatización no debe sobrescribir sin más una edición humana.

Un recorrido de contacto sencillo

La web incorpora accesos a WhatsApp, teléfono y Doctoralia, para que cada visitante encuentre el canal de contacto que le resulte más adecuado. No necesitábamos crear desde cero una plataforma de reservas si ya existía una solución que el profesional utilizaba.

En una materia especialmente sensible, evitamos convertir la web en un formulario de recogida de información clínica innecesaria. La prioridad fue ofrecer información y vías de contacto claras, cuidando la privacidad desde el diseño.

Analítica responsable y SEO desde la base

Preparamos la web para trabajar el posicionamiento orgánico: estructura de contenidos, URLs claras, metadatos, sitemap, navegación interna y revisión de las páginas prioritarias.

También incorporamos Google Analytics 4 con consentimiento previo, sin añadir Google Site Kit ni duplicar etiquetas. La implementación distingue la aceptación, el rechazo y la retirada del consentimiento. Para reducir el envío de información sensible, se limitaron los datos transmitidos y se evitaron las URL completas de destino de WhatsApp y de otros enlaces externos en los eventos medidos.

La optimización SEO no se planteó como un resultado garantizado, sino como una base técnica sobre la que trabajar después con contenidos útiles, Search Console y seguimiento real de las consultas y las visitas.

Desarrollo controlado: automatización y pruebas

Para el trabajo técnico utilizamos asistentes de desarrollo (Codex y Claude Code), Git y un proceso de despliegue orquestado por un script propio. Eso nos permitió dividir la construcción en tareas verificables, mantener registros del estado, ejecutar simulaciones y comprobar el destino antes de aplicar cambios.

La web se aloja en SiteGround, con el dominio gestionado a través de Cloudflare. La puesta en marcha incluyó el paso de una dirección temporal al dominio definitivo, la comprobación de enlaces y la corrección de una incidencia de reescritura en la página principal del tratamiento.

La revisión visual se hizo en móvil, tableta y escritorio, trabajando específicamente con anchos de 390, 768 y 1440 píxeles. También comprobamos enlaces, imágenes, navegación, consentimiento y el comportamiento de la web real, no sólo el código del tema.

Dónde está hoy el proyecto

El trabajo ha dado lugar a una web propia, especializada y ampliable, con una identidad diferenciada, contenidos organizados, un sistema editorial controlado y una analítica diseñada con atención a la privacidad.

El valor no está sólo en su aspecto: también en cómo se mantiene, cómo se verifica cada cambio y cómo puede crecer sin depender de un constructor pesado.

En la última fase documentada, la web estaba accesible en su dominio definitivo y técnicamente desarrollada, todavía con la indexación desactivada mientras se cerraba el flujo formal de aprobación y publicación. La evolución del posicionamiento y de las solicitudes deberá medirse con datos reales, sin anticipar resultados.

Lo que nos llevamos a otros proyectos

Dos ideas que sirven más allá de este caso. La primera: la tecnología se elige después de entender cómo va a trabajar el cliente, no antes; la misma pregunta puede llevar a Astro en un proyecto y a WordPress en el siguiente. La segunda: en un sector sensible, cómo se revisa y se publica un texto forma parte del producto tanto como su diseño.

Lo que se construyó y cómo está organizado lo resumimos en el caso Dr. Fran Rivas. Si tu consulta necesita una web que combine diseño, facilidad de mantenimiento y una estrategia digital clara, empecemos por una conversación.