Guía de usabilidad en email: cómo diseñar para que te lean (y te cliquen) desde el móvil

Publicado el 15/05/2026

 · 

10 min de lectura

Últimos post

Guía de usabilidad en email: cómo diseñar para que te lean (y te cliquen) desde el móvil

El email marketing sigue siendo uno de los canales con mayor retorno de inversión del marketing digital: por cada euro invertido, el ROI medio supera los 36€ (InboxAlly, 2025). Pero hay una condición para que ese retorno se materialice: que el email llegue, se abra y se lea. Y hoy, eso ocurre casi siempre en una pantalla pequeña.

Más del 55% de las aperturas de email ocurren en dispositivos móviles (InboxAlly, 2025), y en algunas audiencias esa cifra supera el 80%. En Benchmark Email llevan años ayudando a los marketers a enviar sus campañas de email marketing, y una de las cosas que más ven  es que hay campañas bien planteadas que de repente fallan porque el diseño del email no está optimizado para móvil. 

Por ello, Windup y Benchmark Email hemos unido fuerzas, combinando la experiencia en estrategia digital de Windup con la tecnología de Benchmark para ofrecerte una guía que garantice que tus campañas no solo se vean bien, sino que conviertan.

No se trata solo de que «se vea bien». Se trata de que el usuario pueda leerlo sin pellizcar la pantalla, de que pueda clicar el botón, y de que la experiencia sea tan fluida que llegue hasta el final y haga lo que queremos que haga: comprar, reservar, registrarse, responder. Lo que sea.

Eso es la usabilidad en email marketing. Y en esta guía te vamos a contar exactamente cómo diseñar bien un email para poder conseguirla.

Puntos clave 

Antes de profundizar, esto es lo que no puede faltar en tu estrategia móvil:

  • Prioridad táctica: diseño de una sola columna: Desde  Benchmark recomiendan  siempre el diseño de columna única como punto de partida para cualquier campaña. Es la estructura que mejor funciona en móvil porque respeta el scroll vertical natural del usuario y elimina el riesgo de que los bloques se vean mal. 
  • La regla de los 44px: Cualquier elemento clicable debe tener un tamaño mínimo de 44×44 píxeles. Este estándar lo establece Apple en sus Human Interface Guidelines y nosotros lo aplicamos por defecto en las CTA de nuestras plantillas. Un botón pequeño es conversión perdida.
  • Contraste y tamaño de fuente: mínimo 16px: Si el usuario tiene que hacer zoom para leer tu email, ya has perdido su atención. Las fuentes por debajo de 16px en el cuerpo del texto son un error habitual que penaliza la legibilidad en pantallas pequeñas. 
  • Previsualización activa antes de enviar: Antes de lanzar cualquier campaña, valida siempre el diseño en la vista móvil. Lo que se ve perfecto en escritorio puede romperse en Gmail para Android o quedar ilegible en un iPhone con modo oscuro activado.

 

La anatomía de un email usable: ¿Cómo diseñar emails para móviles?

  • Optimización de asunto y preencabezado: La primera impresión 

La primera decisión del usuario la toma antes de abrir el email: “¿Me interesa o no me interesa?” Esta decisión la toma en menos de dos segundos mirando tres cosas: quién lo envía, el asunto y el preencabezado.

En móvil, esta decisión es incluso más rápida porque la pantalla es pequeña y la bandeja de entrada está saturada. Y los datos lo confirman: el 35% de los destinatarios abre un email basándose únicamente en la línea de asunto. Si ese asunto no engancha, el resto del trabajo no importa.

La regla de los 40 caracteres

Los asuntos largos se cortan. En iPhone tienes entre 30 y 50 caracteres visibles dependiendo del tamaño de pantalla y la app de correo. En Android varía, pero la media ronda los 40. Si el mensaje importante está al final, nadie lo va a leer…

La solución es simple: pon lo más importante al principio. Las buenas prácticas de diseño de email recomiendan mantener las líneas de asunto por debajo de los 50 caracteres y usar el texto de previsualización para complementarlas.

❌ Descubre todas las novedades que hemos preparado para ti este mes de julio


✅ Julio llega con novedades: lo que no te puedes perder

El preencabezado o preview text

El texto de previsualización (el que aparece en gris justo después del asunto) es uno de los elementos más infrautilizados del email marketing. La mayoría de marketers lo dejan en blanco o lo llenan con el clásico «Si no puedes ver este email, haz clic aquí». Error.

Úsalo para complementar el asunto y juntos deben formar una frase que dé ganas de abrir.

Asunto: Tu campaña de verano empieza hoy
Preencabezado: Plantillas listas, sin código, en menos de 10 minutos

 

  • Estructura de Columna Única: El estándar para el diseño vertical

En escritorio, los diseños de dos o tres columnas pueden quedar estupendos. En móvil, pueden ser un desastre. Las columnas se apilan de formas inesperadas, el texto se corta y las imágenes se deforman.

La solución es diseñar en una sola columna. Es la forma natural de consumo en smartphone: se adapta al scroll vertical, crea una jerarquía visual clara y funciona en todos los clientes de correo sin sorpresas. 

¿Cómo de anchas deben ser mis imágenes y elementos? 

600px es el límite técnico por defecto en email marketing. Manteniendo tu diseño dentro de este tamaño te aseguras de que no haya desbordamientos horizontales en ningún dispositivo. Es un estándar que lleva años funcionando.

Diseño responsive vs. fluido

Un diseño responsive se adapta según el tamaño de pantalla usando media queries (CSS). Un diseño fluido usa porcentajes para ajustar su anchura. Para email marketing, el diseño responsive es la mejor opción porque te permite controlar exactamente cómo se apilan los bloques en móvil, tal y como los expertos de Benchmark Email explican en esta guía de diseño de emails

 

  • Legibilidad y Tipografía: Cómo facilitar la lectura en pantallas pequeñas

La legibilidad en móvil tiene unas reglas muy concretas:

Tamaños mínimos:

  • Cuerpo de texto: 16px (algunos clientes de correo reducen automáticamente fuentes más pequeñas)
  • Títulos: 22px o más
  • Texto secundario o pie de página: 14px como mínimo

Jerarquía visual

En móvil, nadie lee de arriba a abajo palabra por palabra. Escanean. Buscan el titular, el subtítulo, la frase en negrita que les cuente de qué va el email. Utiliza:

  • Títulos claros y cortos
  • Negritas para los datos o frases clave
  • Mucho espacio en blanco (el aire no es desperdicio, es diseño)
  • Párrafos cortos, de dos o tres líneas máximo

El espacio en blanco es más importante en móvil que en ningún otro contexto: con pantallas pequeñas, mantener aire alrededor del contenido mejora directamente la experiencia de lectura y reduce la tasa de abandono.

Asegúrate de usa buenos contrastes

Un texto gris claro sobre fondo blanco puede quedar bonito en Figma. En la pantalla del móvil de alguien con el brillo al 40% en un autobús, es ilegible. Usa colores con contraste suficiente. La referencia técnica es una ratio mínima de 4.5:1 para texto normal según las pautas WCAG de accesibilidad web.

💡 Truco en Benchmark: Cambia la vista del editor a modo móvil para ajustar márgenes, alineaciones de texto o tamaños de fuente que solo se apliquen cuando el email se abra en un teléfono, sin afectar al diseño de escritorio.

 

 

  • El Factor «Fat Finger»: Diseño táctil para maximizar los clics

Este es uno de los errores más comunes dentro de cualquier diseño de email marketing.

En escritorio, el cursor del ratón tiene precisión milimétrica. En móvil, el usuario usa el pulgar. Y el pulgar es grande, impreciso y muchas veces opera con una sola mano mientras la otra sostiene el café.

¿Cuánto deben medir las CTA? 

El tamaño mínimo recomendado para cualquier elemento clicable es 44×44 píxeles, tal y como establece Apple en sus Human Interface Guidelines. En Benchmark aplican  este estándar en los CTAs de nuestras plantillas, y lo destacan  también en su análisis de los errores más comunes en campañas de email para móviles: usar botones pequeños o enlaces demasiado juntos es uno de los fallos que más impacta negativamente en la conversión.

Un botón pequeño genera frustración. Y la frustración es el enemigo de la conversión. Los emails con CTAs móviles bien optimizados muestran tasas de clic hasta un 30% más altas. As que ten cuidado con esto. 

Igualmente, si tienes varios enlaces de texto seguidos (típico en footers o menús de navegación dentro del email), añade espacio entre ellos. Si están demasiado juntos, el usuario clicará el equivocado y eso genera confusión y desconfianza.

¿Dónde debes poner la CTA principal?

Tu llamada a la acción principal debería aparecer above the fold, es decir, visible arriba sin necesidad de hacer scroll. En móvil esto es más crítico que en escritorio porque el índice de abandono antes de hacer scroll es mucho mayor. Si tu propuesta de valor requiere algo de contexto antes de pedir el clic, dalo. Pero pon el CTA en cuanto tengas suficiente argumento para justificarlo.

💡 Truco en Benchmark: Si le das a la vista móvil dentro del editor puedes comprobar si los enlaces tienen espacio suficiente entre ellos y ajustar tamaños o márgenes específicamente para móvil sin tocar el diseño de escritorio.

 

 

  • Rendimiento y Carga: Optimización de imágenes para usuarios móviles

Las imágenes también son algo muy importante para el email marketing en móvil. Bien usadas, comunican y refuerzan el mensaje. Mal usadas, ralentizan la carga y bloquean la entregabilidad.

Los filtros de spam penalizan los emails que son básicamente una imagen grande con poco texto. Desde Benchmark recomiendan mantener un equilibrio aproximado de 60% texto y 40% imágenes, una proporción que también recogemos en nuestra guía sobre cómo combinar Canva y email marketing como regla de oro para evitar problemas de entregabilidad.

Además, algunos clientes de correo bloquean las imágenes por defecto. Si no tienes alt text, el usuario ve un espacio vacío y no sabe qué había ahí. Asegúrate de poner textos alternativos en tus imágenes para que el mensaje siga siendo comprensible aunque la imagen no cargue.

No escribas «imagen1.jpg». Escribe algo útil: «Oferta especial: 30% de descuento en todos los productos hasta el domingo».

💡 Truco en Benchmark: Puedes generar el alt text de tus imágenes con un clic dentro del editor gracias a la herramienta de IA integrada.

 

¿Cuánto deben pesar mis imágenes? 

Gmail corta automáticamente los emails que superan los 102 KB. Sí, kilobytes. Eso incluye el código HTML, el texto y las imágenes. Si tu email es demasiado pesado, el usuario ve un mensaje truncado con un enlace para «Ver el email completo» en el navegador. 

Comprime tus imágenes antes de subirlas. Herramientas como TinyPNG  hacen esto en segundos.

💡 Truco en Benchmark:  En el editor de Benchmark también puedes marcar elementos individuales (imágenes decorativas grandes, banners secundarios) para que se oculten en la versión móvil. Selecciona el bloque que quieres ocultar en móvil, ve a «Ajustes de Bloque» y activa la opción correspondiente. El elemento seguirá visible en la versión de escritorio.

 

Checklist de usabilidad en móvil para tu email marketing

El email marketing móvil no es más que sentido común aplicado al diseño: pensar en quién va a abrir tu email, en qué contexto y con qué intención.

Un email bien diseñado para móvil no solo se ve mejor. Convierte más, genera menos bajas y construye la percepción de que eres una marca que cuida los detalles. 

Antes de pulsar «Enviar», y usa esta checklist como última revisión:

  • [ ] Asunto: ~40 caracteres, con lo importante al principio
  • [ ] Preencabezado: Complementa el asunto, no lo repite
  • [ ] Columna única: Sin diseños multicolumna que se puedan romper
  • [ ] Fuente del cuerpo: 16px o más
  • [ ] CTA principal: Mínimo 44x44px y visible sin hacer scroll
  • [ ] Espaciado entre enlaces: Suficiente para no clicar el equivocado
  • [ ] Alt text: En todas las imágenes
  • [ ] Peso del email: Por debajo de 102 KB
  • [ ] Previsualización móvil: Revisado en el editor antes de enviar
  • [ ] Modo oscuro: Logo en PNG transparente

Si quieres empezar a aplicar todo esto (sin complicarte la vida) puedes hacerlo en Benchmark: editor responsive, previsualización móvil, función de ocultar elementos y plantillas ya optimizadas para cualquier dispositivo. Prueba Benchmark Email gratis.

Preguntas Frecuentes (FAQs)

¿Debo diseñar pensando primero en móvil o en escritorio?

Depende de tu audiencia, pero como punto de partida: móvil primero. Si más del 55% de tus aperturas son en móvil, tiene sentido que sea tu referencia principal. Dicho esto, hay sectores (B2B, software, industria…) donde la apertura en escritorio sigue siendo mayoritaria: el 68% de los empleados aún prefiere revisar el email desde un ordenador. En Benchmark puedes ver desde qué dispositivos abren tus emails directamente en los reportes de cada campaña, lo que te permite tomar esta decisión con datos propios.

¿Por qué mi email se ve perfecto en el editor pero se «rompe» en el Gmail de mi móvil?

No es culpa del editor. Cada cliente de correo (Gmail, Outlook, Apple Mail, Samsung Mail) interpreta el HTML y CSS a su manera. Herramientas como Litmus o Email on Acid te permiten previsualizar el email en decenas de clientes distintos antes de enviar. Consejo real: mantén el diseño simple, evita el código innecesario y usa haz pruebas siempre. 

¿Realmente importa si el botón está a la izquierda, al centro o a la derecha?

Sí, y mucho. La mayoría de la gente usa el móvil con una sola mano (la derecha) y el pulgar tiene un radio de alcance limitado. Los botones centrados o alineados a la izquierda suelen ser más cómodos de clicar. Centra tus CTAs y hazlos generosos en tamaño.

¿Es verdad que los emojis en el asunto ayudan a que me lean más en el móvil?

Ayudan a destacar visualmente en una bandeja de entrada saturada. Según datos recientes, los asuntos con emojis tienen una tasa de apertura un 4,7% mayor que los que no los incluyen. Pero no abuses: un par de emojis aportan frescura, pero cinco seguidos pueden activar filtros de spam. Menos es más.

¿Qué pasa con el Modo Oscuro? Mi email se ve fatal cuando el usuario tiene el móvil en negro.

Apple Mail supera el 55% de cuota de mercado entre los clientes de email (Increv, 2024) y el uso del modo oscuro en este cliente supera el 40%. Claramente no lo puedes ignorar. El truco más sencillo: guarda tu logo y tus imágenes de marca como PNG con fondo transparente. Independientemente de si el fondo es blanco o negro, tu imagen se integra de forma natural sin ese antiestético recuadro blanco alrededor.

 

Biografía del autor

Isabel Delgado

International Marketing Manager @Benchmark Email 

Isabel Delgado lleva más de 10 años en marketing digital y actualmente es International Marketing Manager en Benchmark Email, donde desarrolla las estrategias de growth para EMEA, Europa y Latinoamérica. Le apasiona la intersección entre creatividad y datos, y tiene especial debilidad por el email marketing bien hecho: ese que parece fácil pero tiene mucho detrás.

Comparte si te gustó

Últimos post

Guía de usabilidad en email: cómo diseñar para que te lean (y te cliquen) desde el móvil

google ads en la era de la ia rendimento sem

Google Ads en 2026: Guía definitiva para no tirar tu presupuesto en la era de la IA

formacion seo salidas marketing digital

SEO vs. Otras Salidas en Marketing Digital: ¿Cuál es la mejor especialización para tu carrera?