jueves, 28 de junio de 2012

El ojo sobre tu web. ¿Lo sabías?, pues así la ven


 
El ojo sobre tu web. ¿Lo sabías?, pues así la ven
Published on Blog de Infoautonomos.com | shared via feedly mobile

El ojo sobre tu web. ¿Lo sabías?, pues así la ven.

Tus visitas antes de leer escanean tu contenido

El_ojo_sobre_tu_web. Un_ojo_humano_observando_una_web. infoautonomosSeguro que navegando por Internet has visto páginas web de muchos tipos y formatos, algunas muy llamativas, pero pasado un tiempo ¿serías capaz de recordar qué contenían?

El problema es que hay millones de páginas web publicadas en Internet, por lo que la competencia es realmente dura si quieres distinguirte de tus competidores.

Múltiples estudios han demostrado que el ojo humano tiene una peculiar manera de realizar el escaneado de una página web. Además estos estudios han demostrado que el patrón es muy consistente, y se repite en la mayoría de los individuos.

El Patrón de Escaneado

El ojo humano escanea las páginas web en formando una "F" mayúscula, que se realiza en dos pasadas horizontales de izquierda a derecha, y posteriormente una en vertical de arriba abajo. No somos conscientes de ello, ya que lo realizamos a gran velocidad.

Si en este tiempo no has conseguido captar nuestra atención, es fácil que le demos al botón cerrar.

Por lo tanto, si tenemos una competencia dura, de miles de webs, y además solo contamos con unos segundos para captar la atención de los visitantes, ¿Qué debo hacer?, ¿Dónde y cómo debo colocar los contenidos? Antes de responder a estas preguntas analicemos cómo se traza esta "F":

  1. El usuario realiza una primera lectura en horizontal, a través de la parte superior del área de contenido. Este elemento inicial forma la barra superior de la F.
  2. A continuación, los usuarios se mueven por la página un poco y leen la parte frontal en un segundo movimiento horizontal que típicamente cubre un área más corta que el movimiento anterior. Este movimiento forma la barra inferior de la F.
  3. Por último, los usuarios escanean el lado izquierdo del contenido en un movimiento vertical. A veces este movimiento se realiza de forma algo más lenta y sistemática y en los mapas de calor se muestran zonas más sólidas, y a veces los usuarios se mueven más rápido, creando un mapa de calor más desigual. Este movimiento forma el tallo de la F.

Ejemplo_de_Mapa_de_calor._Resultados_del_escaneado_del_ojo_humano. infoautonomos

En las imágenes de arriba se pueden ver los mapas de calor resultantes de tres web diferentes. Las áreas visualizadas más veces son de color rojo, las zonas amarillas indican un menor número de visitas, seguido por las zonas azules con menos visitas aun. Las áreas grises no atrajeron ninguna fijación visual.

Las web visualizadas corresponden: la primera es un artículo "acerca de…" de una web corporativa, la segunda es una información de producto de una tienda online, y la tercera es el resultado que Google devuelve al hacer una consulta.

Analicemos los contenidos de cada web y donde se fija más el ojo humano.

  • En la primera web las personas empezaron a leer con interés los primeros párrafos y según fueron bajando aparentemente perdieron parte de este interés.
  • En la página de producto de la tienda online, los usuarios se interesaron por la fotografía, por las primeras líneas de la descripción de producto y curiosamente por la zona de "añadir a la cesta" que estaba situada al lado del precio.
  • En la imagen de la búsqueda de Google los usuarios se fijaron sobre todo en los primeros cinco resultados, así como en el resultado patrocinado de la derecha.

Implicaciones del Patrón F en el Diseño Web. Consejos.

Las implicaciones del modelo F para el diseño Web son claras y muestran la importancia de seguir estas directrices a la hora de mostrar tus contenidos en tu web.

  • La mayoría de tus visitantes no van a leer texto completo palabra a palabra. La lectura solo es más exhaustiva cuando un cliente potencial busca algo en concreto o está investigando para hacer una comparativa.
  • Los títulos son fundamentales. Deben llamar la atención del usuario e invitar a seguir leyendo.

    El triangulo_dorado_de_tu_web. infoautonomos

  • Los dos primeros párrafos deben contener la información más importante. Habrá usuarios que se detengan en los siguientes pero lo normal es que se lean más estos párrafos, y más el primero que el segundo.
  • Incluye solo una idea en cada párrafo.
  • Los Párrafos deben ser cortos, no deben cansar; la tercera palabra en una línea se va a leer mucho menos a menudo que las dos primeras
  • El contenido de los párrafos debe generar interés
  • Los usuarios cada vez más buscan de arriba abajo, y según bajan, el escaneado horizontal se estrecha, lo que indica que se tiende a leer entre-palabras
  • Si tienes información importante en la izquierda, resáltala.
  • Usa flechas o banners animados para invitar o guiar a los usuarios por el contenido que quieres que se vea
  • Las imágenes deben ser sugerentes y estrechamente ligadas con el contenido.
  • Pon tus contenidos más importantes en la zona llamada el triángulo dorado. (ver foto)

De todas las formas, es muy importante que distingamos que los visitantes escanean más lentamente, e incluso con modificaciones en el patrón, si la página tiene mucha carga de imágenes o si es un artículo de un blog.

Si has llegado a leer esta línea es muy posiblemente porque el contenido te ha interesado, por lo que esta es otra norma a seguir en tu web. Si el contenido es de interés para tu audiencia tendrás ganada una parte del reto que supone mantener el interés de los visitantes de tu web.

De momento lo dejamos aquí.

Deseo que el artículo haya sido de tu interés. Si ha sido así, por favor, compártelo con tus amigos.

Muchas gracias por tu atención.

Ángel González

SEO & Social Media

Más artículos en mi Blog @1AngelGonzalez Web-baratas en Facebook




Américo. Enviado desde mi iPad

No hay comentarios:

Publicar un comentario