3.3_3.4_Documento para distribuir_Plan de Clase 2

Taller central de ITOCA para formador de formadores (Nigeria, noviembre de 2010)
Día uno: ¿sesión 4?
Diseño de página web: el patrón en forma de F para leer las páginas web
Objetivos del aprendizaje.
•
Al final de esta sección:
–
Comprender que el diseño de páginas web se basa en hallazgos de investigación sobre "cómo las
personas tienden a escanear las páginas web"
–
Reconocer el patrón en forma de F en las páginas web, especialmente en los productos Research4Life
–
Utilizar el patrón en forma de F para identificar los elementos más importantes ("llamado a la acción") en
las páginas web
Propósito:
En esta sesión, se mostrará a los participantes la correlación entre la manera en la que las personas tienden a escanear las páginas
web y el diseño de las mismas. Jacob Neilson es ampliamente reconocido como experto en la capacidad de uso de web y posee
muchas patentes principalmente sobre las maneras de hacer que Internet sea más fácil de usar. Su investigación basada en la
evidencia ha influido en la manera en que los diseñadores web construyen páginas y distribuyen sus elementos clave (opciones del
menú, botones de inicio de sesión, etc.) y contenido (información importante). En 2006, Jacob Neilson y Karen Pernice realizaron
una investigación sobre la manera en que las personas escanean o leen las páginas web. Con el uso de un software de rastreo
ocular ellos registraron los movimientos oculares de más de 236 personas para establecer si había un patrón para leer las páginas
web o no. Confirmaron que hay un patrón de lectura dominante y que las personas tienden a escanear las páginas en un patrón con
forma de F. Estos hallazgos (ver a continuación) han influido significativamente en la manera en que el contenido se escribe o se
presenta en Internet. Por ejemplo, las personas tienden a escanear (en lugar de leer) el contenido, especialmente al hacer una
investigación inicial. Por lo tanto, los editores de contenido usan "encabezados secundarios" o "viñetas" (o encabezados llamativos)
para atraer la vista de los usuarios al contenido más importante (contenido que desean que lean).
La premisa de esta sesión es que los participantes al comprender por qué los diseñadores web y editores de contenido diseñan
páginas web usando el patrón en forma de F, entonces podrán: 1) comprender el "llamado a la acción" más importante (acciones
que el sitio requiere que el usuario realice) en la página; 2) reconocer similitudes en el diseño entre productos; y 3) usar este
conocimiento para mejorar la experiencia de sus usuarios (reconocer características comunes para aplicar este conocimiento en
otros sitios y navegar con velocidad). Por ejemplo, cuando un usuario visita un sitio por primera vez, podrá hacer suposiciones
acerca de dónde se colocará el cuadro de inicio de sesión, etc.
Recursos del instructor:
Lea acerca de la investigación de Jacob Neilson (disponible en inglés) en http://www.useit.com/alertbox/reading_pattern.html
1
Día uno: sesión 4 (?) – Introducción a la interfaz/diseño de páginas web
(tiempo estimado general: 30 minutos). Tenga en cuenta que esta sesión es la última de tres sesiones que cubren: conceptos
de Internet, bases de datos y diseño de páginas web. Solo se han asignado 30 minutos a esta sección de la capacitación pero
es posible que se necesite tiempo adicional para el ejercicio de "análisis de la sesión" al final.
CONTENIDO
¿Qué?
Frase como pregunta
Introducción: definición de objetivos (diapositiva 2)
PROCESO
¿Cómo?
Herramientas/procesos
Patrón de lectura: páginas web (diapositiva 3)
Discusión grupal (pida a
los participantes que
hagan sugerencias, dibuje
en un rotafolio?)
12:30 a 12:38
(5 minutos)
Diapositiva 4 (leer)
12:38 a 12:42
(5 minutos)
¿Qué atrae su atención en una página web?
TIEMPO
¿Cuánto
tiempo?
12:30 a 12:32
(3 minutos)
Vincular conocimientos inherentes de los elementos clave de la página
web a la investigación sobre la manera en que las personas
leen/escanean páginas web y cómo esto influye en su diseño (para
hacer que sean más fácil de navegar) y localizar información importante
(a través del uso de encabezados secundarios, etc.)
Glosario
"Llamado a la acción": un objetivo que desea que los usuarios completen
o sobre el que desea exhortarlos a actuar, con opciones enfocadas y
guiándolos a través del sitio (ya sea con el lenguaje, botones, etc.).
(http://boagworld.com/design/10-techniques-for-an-effective-call-toaction)
Patrón en forma de F, Jacob Neilson (investigación) – (diapositivas
4 a 6)
Presente los datos de Jacob Neilson sobre su investigación (la manera
en que las personas escanean las páginas web) y las implicaciones de
los hallazgos
2
Diapositiva 5 (mostrar la
imagen: trace la forma F
con el dedo)
Facilitador
principal
A anunciarse
próximamente
Puntos de interés:
1. Jacob descubrió un patrón de lectura dominante.
2. Las personas leen primero con un movimiento horizontal.
3. Luego, mueven la página un poco hacia abajo, leen a través de la
segunda línea horizontal.
4. Finalmente, las personas escanean el contenido que se
encuentra al lado izquierdo con un movimiento vertical (ya sea de
manera lenta y sistemática o rápida)
Diapositiva 6: esta
diapositiva se puede
comunicar verbalmente a
través del uso de la
imagen en la diapositiva 5
y luego se puede usar
para "reforzar" los
hallazgos clave.
Diapositiva 5: resalte la forma de F al trazar el patrón con los dedos (a
medida que describe los hallazgos destacados anteriormente).
Diapositiva 6: puede elegir no mostrar esta diapositiva, se puede
comunicar verbalmente y reforzar por medio de la imagen de la
diapositiva 5. O bien, puede elegir reforzar (por medio de la repetición)
los hallazgos. Enfatice el punto 4, las personas tienden a escanear la
información que se encuentra en el lado izquierdo de forma más
sistemática; por lo tanto, el posicionamiento de los elementos clave de la
página (opciones del menú) se encuentran en esta sección de la página.
La importancia (diapositiva 7)
12:42 a 12:44
(2 minutos)
¿Cuál es la importancia de esta investigación y cómo me ayuda a
aprender a usar los productos Research4Life?
Diapositiva 7: comunicar la
importancia al grupo
Resalte la importancia
1. Comprender que el diseño de las páginas web es intencional le
ayudará a navegar nuevos sitios fácilmente (al poder reconocer el
posicionamiento de los elementos comunes o clave de la página)
2. Localizar rápidamente el contenido clave (a través de
encabezados secundarios, etc.)
3. Reconocer que los productos Research4Life son similares en
diseño le ayudará a mejorar la confianza al aprender cómo
"dominar" estos productos de forma independiente
Actividad breve: "intentemos" (diapositivas 8 a 15)
Diapositiva 8: vista general
3
12:44 a 12:55
(13 minutos)
Introduzca una actividad breve en el grupo; muestre la diapositiva y pida
al grupo que trabajen en parejas. Esta es una actividad de orientación de
productos donde se pide a los participantes que identifiquen las
características comunes de cada producto R4L. Tiene el respaldo de una
hoja de trabajo, pero se puede discutir en parejas y luego comunicar al
grupo (dependiendo del tiempo disponible). Las respuestas se pueden
escribir en un rotafolio al final de la sesión.
y concisa de la actividad
Demostración: para ayudar a los participantes a comprender el propósito
de la actividad, ilustre el patrón en forma de F con las diapositivas 9 a 13
(las cuáles muestran el sitio web HINARI). Luego pida a los participantes
que apliquen este "aprendizaje" a Agora, OARE (diapositivas 14 a 15) y
si hay tiempo, al sitio web de Research4Life (diapositivas 16 a 19).
Diapositiva 14 y 15: en
parejas, destaquen las
similitudes en el diseño,
luego comuníquenlas al
grupo
Diapositiva 9 a 13:
demostrar el patrón de
forma en F y los
elementos clave de la
página web en HINARI
Puntos de interés:
1. Posicionamiento de los elementos clave (opciones del menú),
2. Posicionamiento de la llamada a la acción principal en la
navegación del lado izquierdo (vínculo a artículos de texto
completo)
3. Botón de inicio de sesión
Comentarios y conclusión de la actividad (diapositiva 20)
Una mirada a los "hallazgos del grupo": vincúlelos a la conclusión
12:53 a 12:57
(4 minutos)
Reflexión de la sesión global (diapositiva 21)
Preguntas de reflexión: plantee preguntas para descubrir los puntos de
aprendizaje más valiosos para las tres secciones de la clase (conceptos
de internet, bases de datos y diseño de páginas web).
4
Discusión en grupo/
¡Clickr?
Vista ampliada: diapositiva
21
12:57 a 1:00
(3 minutos)