· Equipo de The AI Web Factory
Lo que decide tu web en los primeros tres segundos
La confianza se juega antes de que nadie lea nada. Qué mira el ojo primero, qué lo espanta y por qué el diseño de una web es sobre todo una cuestión de orden.
Hay un experimento viejo y bastante conocido en el oficio: se enseña una web medio segundo y se pregunta si inspira confianza. Las respuestas dadas en medio segundo coinciden casi siempre con las que da la misma gente después de navegar un rato.
Dicho de otra manera: la decisión se toma antes de leer. Y luego se justifica con razones.
Eso no significa que haya que hacer webs bonitas y ya está. Significa que hay que entender qué está mirando el ojo en ese medio segundo, porque no es lo que la mayoría cree.
Lo primero que se ve no es el logotipo
Es la mancha. El ojo recibe una distribución de claros y oscuros antes de reconocer ninguna forma. Si esa mancha está ordenada, el cerebro relaja la guardia. Si está revuelta, se pone en alerta.
Por eso una web con mucho espacio en blanco y tres elementos transmite más seriedad que una con quince cosas pidiendo atención. No es minimalismo por moda: es que el desorden visual cuesta esfuerzo y el esfuerzo no gusta.
La prueba casera es entornar los ojos hasta que la pantalla se vuelva borrosa. Si lo que queda es un bloque grande arriba, un título legible y un botón que destaca, vas bien. Si queda una sopa gris, hay trabajo.
El tamaño del texto, que casi siempre se queda corto
Un cuerpo de 14 píxeles era normal hace diez años. Hoy se lee mal, sobre todo a partir de los cuarenta y cinco años, que es la edad de buena parte de quien contrata servicios.
Nosotros no bajamos de 16 píxeles en el cuerpo y subimos a 18 en las páginas con mucho texto. Y el ancho de la columna no pasa de unos 70 caracteres: cuando una línea es más larga, el ojo se pierde al volver al principio de la siguiente y hay que releer.
Esto no es opinión, se mide en pruebas de lectura desde los años setenta, cuando se hacían con papel.
El contraste no es un detalle de accesibilidad
Suele presentarse como algo que se hace por las personas con problemas de visión. Lo es y ya sería razón suficiente. Pero también es lo que decide si tu web se lee en un móvil al sol.
La norma pide una relación de contraste de 4,5 a 1 entre el texto y su fondo. El gris claro sobre blanco que tanto se ve, ese que queda tan elegante en la pantalla del diseñador, suele quedarse en 2,8 a 1. En la calle, a mediodía, es invisible.
Hay herramientas gratuitas para comprobarlo en treinta segundos. Lo raro es que casi nadie lo haga.
El botón tiene que parecer un botón
Durante unos años se puso de moda quitarles el relieve, el color y hasta el borde. Quedaba moderno. Y la gente dejó de pulsarlos.
Un botón necesita tres cosas: un color que no aparezca en ninguna otra parte de la página, suficiente tamaño para el pulgar (unos 44 píxeles de alto como mínimo) y un texto que diga lo que pasa al pulsar. «Pedir presupuesto» funciona. «Enviar» es tibio. «Más información» no dice nada.
Y uno por pantalla. Si hay tres botones igual de llamativos, no hay ninguno.
La tipografía dice más de lo que parece
No por la forma de las letras, que casi nadie distingue, sino por la coherencia. Dos familias como mucho. Tres pesos como mucho. Si en una misma página hay cinco tamaños de título distintos, el lector deja de saber qué es importante.
Nosotros usamos una sola familia en casi todos los proyectos y no pasamos de peso 600 para los títulos. El 700 y el 800 se ven toscos en pantalla y cargan más.
Dónde falla el diseño caro
Hemos auditado webs que costaron bastante dinero y fallaban en cosas baratas. Un menú que en el móvil tapaba el contenido. Un formulario de contacto con nueve campos obligatorios. Una portada preciosa que tardaba seis segundos en aparecer porque llevaba un vídeo de 40 MB sin comprimir.
El patrón se repite: se cuidó lo que se ve en la presentación al cliente y no lo que pasa cuando entra una persona con un móvil de hace cuatro años y cobertura regular. Que es la situación normal.
El orden que seguimos nosotros
Primero que se lea: tamaño, contraste, ancho de columna. Después que se entienda: qué ofreces, a quién, cómo te contactan. Después que cargue rápido. Y al final, lo bonito.
Parece al revés de como se hace habitualmente y lo es a propósito. Una web fea que funciona se puede embellecer. Una web preciosa que no se lee hay que rehacerla.
Si tienes dudas sobre la tuya, haz la prueba de entornar los ojos. Y si quieres una segunda opinión, escríbenos.
Comentarios
Para comentar necesitas entrar con una cuenta. No publicamos tu correo.
Al entrar se guardan tu nombre y tu imagen de perfil junto al comentario. Puedes borrarlo cuando quieras. Lo explicamos en lapolítica de privacidad.