Tu página de contacto no es un buzón: es una puerta con timbre, cartel y una nota que dice cuándo vuelves. De nada sirve un formulario precioso si nadie sabe qué escribir, si el captcha espanta o si el mensaje de “gracias” no dice cuándo vas a contestar. Hoy montamos una página de contacto que contesta: copia humano, formulario mínimo, antispam sin odio, autorespuesta que aclara expectativas, accesibilidad básica y una página de “gracias” que no deja colgado a nadie. Plantillas incluidas.
Qué debe prometer (en 2–3 líneas) antes del formulario
Di para qué sirve escribirte, qué tipo de mensajes respondes y en cuánto sueles responder. Con eso basta. Nada de muros de texto.
¿En qué te ayudo? Respondo dudas sobre escritura sencilla, blog y ritmo de publicación.
Si es una propuesta de colaboración, cuéntame en 3 líneas. Suelo responder en 24–48 h (lu–vi).
El formulario mínimo (campos que no cansan y ayudan)
No necesitas dieciséis campos. Con 4–5 bien pensados la gente escribe mejor y tú filtras sin enfadar. Aquí va una estructura que cabe en móvil.
• Nombre (obligatorio)
• Correo (obligatorio, validado)
• Tema (desplegable corto)
• Mensaje (hasta 800–1200 caracteres; guía de qué contar)
• Consentimiento (casilla + enlace a privacidad)
• Opcional: Adjuntar archivo (máx. 5 MB; formatos claros)
Plantilla de copia (texto visible en la página)
Hablemos. Dime en 3 líneas qué necesitas y para cuándo. Si me das contexto,
te respondo mejor. Suelo contestar en 24–48 h (lu–vi). Gracias por la paciencia.
Accesibilidad básica (sin pelearte)
- Etiquetas visibles (no solo placeholders). El lector debe saber qué pide cada campo al leer, no adivinar.
- Errores en texto y cerca del campo. Nada de solo “rojo”: añade “El correo parece incompleto”.
- Botón grande (44×44 px), texto verbo + objeto: “Enviar mensaje”.
- Foco de teclado visible, orden natural, y
aria-live="polite"
para el mensaje de éxito.
Antispam que no molesta (y funciona)
- Honeypot (campo oculto que los bots rellenan y tú ignoras).
- Tiempo mínimo (si se envía en < 3 s, sospecha).
- Límite razonable de envíos por IP/hora.
- CAPTCHA silencioso si hace falta; evita pruebas agresivas que rompen la experiencia.
Si un día sube el spam, endureces una semana y vuelves a lo suave. Mejor eso que vivir en “marca todas las farolas”.
Autorespuesta humana (el correo que llega al minuto)
La gente no necesita un tratado: necesita saber que llegó, cuándo contestas y qué hacer si es urgente. Copia-pega esto y ajusta.
Plantilla — Autorespuesta
Asunto: Gracias por escribir — te respondo en 24–48 h
Hola, [Nombre]:
He recibido tu mensaje. Suelo contestar en 24–48 horas (lunes a viernes).
Si es una consulta breve, te contesto por correo. Si requiere revisar material,
te propondré una llamada corta con día y hora.
Si es urgente por [motivo realista], puedes responder a este correo con “URGENTE” en el asunto
y haré lo posible por priorizarlo.
Mientras tanto, quizá te sirva esto:
• Publicar sin sustos (página guía)
• Checklist de publicación (10’)
• Títulos honestos (plantillas)
Gracias por la paciencia,
[Tu nombre]
Entregabilidad (para que el correo llegue y no acabe en spam)
- Usa un remitente de tu dominio (no @gmail si tu web es midominio.com).
- Configura SPF/DKIM/DMARC con tu proveedor de correo. Es rutina de 15–20 min y lo agradecerás.
- No envíes adjuntos pesados en la autorespuesta. Enlaza a páginas.
Mensajes de error y éxito (que ayudan de verdad)
Errores — coloca el texto debajo del campo
• “El correo parece incompleto. Revísalo, por favor.”
• “Este campo es breve: cuéntame en 3 líneas qué necesitas.”
• “Adjunto demasiado grande (máx. 5 MB).”
Éxito — en la propia página + redirección amable
“¡Gracias! He recibido tu mensaje. Te respondo en 24–48 h (lu–vi).
Si quieres aprovechar la espera, aquí tienes tres lecturas cortas:”
Puedes redirigir a una página de “gracias” con 3 enlaces útiles y un recordatorio de tiempos. No vendas nada más ahí; da calma.
Ejemplos de “Tema” (desplegable que ordena sin encorsetar)
Opción | Cuándo usarla | Respuesta esperada |
---|---|---|
Consulta breve | Duda concreta de 1–2 párrafos | Correo con 2–3 opciones claras |
Colaboración | Propuestas, patrocinios | Respuesta con disponibilidad y condiciones |
Soporte/Acceso | Problemas técnicos de acceso | Checklist rápida + captura si aplica |
Copiable: micro–guía debajo del textarea (mejora el 80% de mensajes)
Para ayudarme a ayudarte, cuéntame:
• Qué necesitas (1 frase)
• Para cuándo (fecha aproximada)
• Cómo te respondo (correo / llamada corta)
Antes / Después (página muda vs. página que respira)
Antes (mudo)
Título: “Contacto”
Formulario: Nombre, Email, Mensaje
Mensaje de éxito: “Enviado”
Después (humano)
Título: “Hablemos”
Texto: “Respondo en 24–48 h (lu–vi). Si colaboras, cuéntame en 3 líneas.”
Formulario: Nombre, Correo, Tema, Mensaje (con guía), Consentimiento
Éxito: “Gracias. Te respondo en 24–48 h. Mientras, ‘Checklist de publicación’.”
Plantillas listas para pegar
1) Copia de cabecera (arriba del formulario)
Hablemos. Si me das contexto, te respondo mejor.
Sueldo contestar en 24–48 h (lu–vi). Gracias por la paciencia.
2) Texto de consentimiento (GDPR amable)
“Usaré tus datos solo para responder a este mensaje.
Más info en la política de privacidad.”
3) Página de “gracias”
¡Gracias por escribir! Tu mensaje ha llegado. Te respondo en 24–48 h (lu–vi).
Mientras tanto:
• Publicar sin sustos (página guía)
• Checklist de publicación (10’)
• Títulos honestos (plantillas)
4) Mensaje de pie (si recibes demasiadas propuestas genéricas)
“Si es una colaboración, cuéntame en 3 líneas: quién eres, qué propones y para cuándo.”
Accesibilidad técnica (mínimos que marcan la diferencia)
- Campos con
<label for=>
yid
únicos. Nada de “placeholder como etiqueta”. - Usa
required
,aria-required="true"
yaria-invalid
al validar. - Resumen de errores arriba con anclas: “Revisa Correo y Mensaje”.
Fragmento de HTML (ilustrativo; adáptalo a tu plugin de formularios)
<form aria-describedby="contacto-ayuda" method="post" action="/contacto-enviar">
<p id="contacto-ayuda">Respondo en 24–48 h (lu–vi). Si colaboras, 3 líneas bastan.</p>
<label for="c-nombre">Nombre</label>
<input id="c-nombre" name="nombre" type="text" required aria-required="true" autocomplete="name">
<label for="c-email">Correo</label>
<input id="c-email" name="email" type="email" required aria-required="true" autocomplete="email">
<label for="c-tema">Tema</label>
<select id="c-tema" name="tema">
<option>Consulta breve</option>
<option>Colaboración</option>
<option>Soporte/Acceso</option>
</select>
<label for="c-mensaje">Mensaje</label>
<textarea id="c-mensaje" name="mensaje" rows="6" maxlength="1200"
placeholder="Qué necesitas · Para cuándo · Cómo te respondo"></textarea>
<!-- Honeypot -->
<div style="position:absolute;left:-5000px;" aria-hidden="true">
<label for="c-web">Tu web</label>
<input id="c-web" name="web" type="text" tabindex="-1" autocomplete="off">
</div>
<label><input type="checkbox" name="ok" required>
Usaré tus datos solo para responder a este mensaje.
Más info en la <a href="/privacidad">política de privacidad</a>.
</label>
<button type="submit">Enviar mensaje</button>
<div aria-live="polite" id="c-estado"></div>
</form>
Si usas un plugin (Contact Form 7, Gravity Forms…), traslada los textos tal cual: lo importante es el copy y la accesibilidad, no el código puro.
Errores comunes (y el apaño amable)
- Formulario infinito (teléfono, empresa, presupuesto… cuando no toca). Apaño: pide lo mínimo y pregunta después.
- Captcha hostil (puzzles imposibles). Apaño: honeypot + tiempo mínimo + límite IP; solo si falla, captcha.
- Mensaje de éxito vacío. Apaño: tiempos, qué pasará, 2–3 enlaces útiles.
- Sin autorespuesta. Apaño: la plantilla de arriba en 3 minutos.
- Desde @gmail cuando tu dominio existe. Apaño: configura remitente de dominio + SPF/DKIM.
Checklist pegada al editor
[ ] Encabezado humano (para qué sirve, cuándo respondes)
[ ] Campos mínimos (Nombre, Correo, Tema, Mensaje, Consentimiento)
[ ] Guía bajo el textarea (3 puntos)
[ ] Antispam suave (honeypot, tiempo, límite IP)
[ ] Mensajes de error claros y accesibles
[ ] Autorespuesta con tiempos y enlaces útiles
[ ] Página de “gracias” con 3 lecturas
[ ] Remitente del dominio (SPF/DKIM/DMARC)
[ ] Vista previa móvil (botón grande, foco visible)
[ ] Test de envío (¿llega? ¿a spam?)
Hoja de una cara (para imprimir y no olvidar)
PÁGINA DE CONTACTO QUE CONTESTA
Promesa (2–3 líneas) · 24–48 h · para qué sirve escribirte
Formulario mínimo: Nombre · Correo · Tema · Mensaje · Consentimiento
Antispam suave: honeypot · tiempo · límite IP · captcha solo si toca
Autorespuesta: recibido · cuándo respondes · qué pasará · 3 enlaces útiles
Gracias: calma + 3 lecturas · sin venta
Accesibilidad: labels visibles · errores en texto · aria-live
Entregabilidad: remitente de dominio · SPF/DKIM/DMARC
Regla: menos fricción, más claridad, respuesta humana
Cierre
Una buena página de contacto no “convierte”: conversa. Quita miedo, baja la fricción y deja claro qué pasará después. Si hoy solo puedes con una cosa, escribe la autorespuesta y el mensaje de éxito. Mañana ajustas el formulario. Con eso, tu timbre sonará y no asustará a nadie.