Skip to content
FuncionalidadesPreciosAfiliadosBlogAyudaNosotrosContacto
ComenzarIniciar sesión
Volver al Blog
guides2027-01-205 min de lectura

Jerarquía Visual Z-Pattern: Cómo Guiar la Mirada del Cliente en el Menú

Alinea héroe, descripción y CTA con el Z-pattern de Nielsen Norman. Caso Konya: +18% conversión en el funnel pedir.

th

thMenu Team

thmenu.com

Un restaurante regional de 30 mesas cerca del santuario Mevlana en Konya aumentó su funnel "ver menú → pedir" en un 18% alineando su carta digital al Z-pattern. No fue tecnología — fue poner el movimiento ocular antes que la decoración.

Z-Pattern vs F-Pattern

Los estudios eye-tracking de Nielsen Norman identifican dos patrones. F-pattern en páginas con mucho texto. Z-pattern en landings visuales y menús digitales.

Ruta del Z: arriba-izquierda (héroe) → arriba-derecha (tagline) → diagonal a abajo-izquierda (descripción) → abajo-derecha (CTA "Pedir"). El disparador al final del Z capta un ojo listo para actuar.

Implementación en Konya

Cuatro anclajes Z en la página de categoría:

1) Arriba-izquierda: foto etli ekmek + "Cocina de Konya". 2) Arriba-derecha: chips de categoría. 3) Centro-izquierda: texto patrimonial 2 frases. 4) Abajo-derecha: CTA sticky. Tiempo hasta pedido cayó 22 segundos; conversión +18%.

Tres Pruebas Gratis

Prueba entrecerrar ojos (cuatro bloques visibles?), prueba 5 segundos (qué recuerdas?), heatmap Microsoft Clarity (sigue realmente el Z?). Si falta la diagonal, contraste o tamaño débiles en el centro.

FAQ

¿Z-pattern funciona en móvil? Menos — el scroll vertical domina, F-pattern encaja mejor. Z es óptimo en tablet/desktop con todo el Z en un viewport.

¿Y en RTL como árabe? El Z se refleja: empieza arriba-derecha, termina abajo-izquierda. thMenu aplica dir="rtl" automáticamente.

¿CTA abajo-izquierda en vez de derecha? No — es el punto ciego. Click cae 30–40% porque el ojo ya "cerró" el Z a la derecha.

¿Te resultó útil? Compártelo.