Curated by: Luigi Canali De Rossi
 


24 July 2010

Diseño De Navegación De Sitios Web: Cómo Proveer Instrucciones Y Direcciones Claras A Tus Lectores

¿Cómo puedes ayudar a que tus lectores encuentren lo que buscan en tu sitio web? ¿Cómo puedes facilitar su necesidad de saber en dónde hacer clic o dónde buscar cuando en quieren algo? Las instrucciones de navegación, o como alguien las llama, diseño de la interfaz y de la navegación para el usuario, se basan en el texto y elementos visuales que pueden ayudar a que tus visitantes entiendan más fácilmente dónde tienen que hacer clic o dónde mirar para encontrar lo que buscan. Como tales, estas señales de navegación y direcciones visuales pueden mucha diferencia en la conversión de visitantes temporales en clientes y aficionados a largo plazo. En este informe, aprenderás cuáles son los elementos clave básicos en que necesitas prestar atención, para diseñar un diseño de navegación eficaz con buenas instrucciones de navegación para tus usuarios.

diseno_navegacion.jpg
Crédito de la foto: António Nunes

La gente tiene cosas que quiere lograr, ya sea hacer una compra, encontrar una receta, o aprender a hacer algo nuevo.

Inherente en muchos diseños de páginas web, por lo tanto, es la información para ayudar a que el usuario realice una acción.

En suma ... este tipo de señales visuales suele proveer instrucciones para ayudar a que los usuarios sepan qué hacer a continuación.

Estas instrucciones guían a los ojos y las mentes de las personas a hacer su búsqueda en el lugar adecuado y adoptar las medidas adecuadas para lo que necesitan.

En este informe, Connie Malamed identifica y explica cuáles son los aspectos más críticos a prestar atención a cuando se trabaja para agregar o perfeccionar los mensajes de navegación del usuario y las instrucciones para ayudar a que los lectores online encuentren lo que buscan o toman una acción específica.

En concreto, algunos de los aspectos clave que se destacan en este informe, muestran la importancia de varios factores únicos en el diseño eficaz de las instrucciones de navegación del usuario:

  • Maximización de la segmentación de la audiencia
  • Control de información excesiva
  • Estilo de redacción
  • Mejora de la accesibilidad
  • Prueba de relevancia

No dejar nada al azar o a la suerte, pero hacer la planificación de cómo proporcionar una navegación eficaz a los lectores y clientes que buscan completar una tarea específica en tu sitio web, es una inversión valiosa a la cual cualquier editor web profesional con contenido, productos o servicios más allá del típico blog debe prestar mucha atención.

Aquí, el informe completo en detalle:

 

 

La Letra Menuda: Redacción De Instrucciones De Interfaz De Usuario

por Connie Malamed



Instrucciones Para La Interfaz Del Usuario: Qué Y Para Qué

user_interface_design_instructions_question-mark_id3358431_size1.jpg

El comportamiento de una persona en la web está muy orientado a sus objetivos.

La gente tiene cosas que quiere lograr, ya sea hacer una compra, encontrar una receta, o aprender a hacer algo nuevo.

Inherente al diseño de muchas páginas web, por lo tanto, es la información para ayudar a que el usuario realice una acción.

Por ejemplo, si quieres diseñar un botón para hacer clic para alcanzar a una meta deseada (por ejemplo, colocar un objeto en un carrito de compras), sombrear el botón para que parezca resaltado ayudará a que el público entienda esa forma es un objeto cliqueable.

Además este tipo de señales visuales suele proveer instrucciones para ayudar a que los usuarios sepan qué hacer a continuación.

Estas instrucciones guían a los ojos y las mentes de las personas a hacer su búsqueda en el lugar adecuado y adoptar las medidas adecuadas para lo que necesitan.

 





La Importancia De Los Modelos Mentales

user_interface_design_instructions_mental_models_id3403501.jpg

Diseñar y escribir las instrucciones que forman parte de la interfaz de usuario es a la vez un arte y una ciencia, lo que envuelve la redacción y habilidades de diseño, así como una comprensión de cómo la gente usa los modelos mentales.

Un modelo mental es una representación interna de cómo funcionan las cosas. Es una concepción amplia de las acciones causales y sus efectos.

La gente aplica sus modelos mentales a situaciones nuevas por lo que no es necesario volver a aprender todo desde cero. Esto ayuda a hacernos cognitivamente eficaces.

A través de la experiencia, los usuarios desarrollan modelos mentales de cómo los diferentes tipos de sitios funcionan.

Aprenden los tipos de acciones a tomar en un sitio de comercio electrónico en comparación con los tipos de acciones que funcionan en un sitio fotografía.

La gente aplica sus modelos mentales a las nuevas situaciones por lo que no es necesario volver a aprender todo desde cero. Esto significa que la gente aplicará su estereotipo o modelo mental de sitios web de forma similar en tu página web.

 




Por Qué Son Importantes Las Intrucciones Claras En La Interfaz Del Usuario

user_interface_design_instructions_attention_sign_by_bastique.jpg

Esta es una de las principales razones por las cuales las instrucciones en la interfaz de usuario son tan importantes.

Las personas tienen una experiencia desagradable cuando sus modelos mentales son inexactos o incorrectos. Causa:

  • frustración,
  • errores al usuario and
  • equívocos en la hora de alcanzar una meta.

Un usuario frustrado podría buscar otro sitio web que es más fácil de usar.

La escritura fácil de entender, las instrucciones y su presentación estética pueden evitar este tipo de problemas.

Buenas instrucciones guiarán a los visitantes de tu sitio web, incluso si sus modelos mentales son imprecisos o erróneos.

Así que aquí están algunas pautas para escribir las instrucciones de la interfaz de usuario que he recogido durante años aprendiendo acerca de diseño online, así como joyas de la investigación de usabilidad.

 





Conoce Tu Audiencia Primero

user_interface_design_instructions_measure-your-audience-by-siliconvalleywatcher.jpg

Cuando conoces las características de tu audiencia, puedes imaginar y dirigir tus palabras para ellos.

A menos que tus visitantes sean un grupo inteligente, homogéneo, es mejor suponer que van a necesitar algo de orientación para lograr sus objetivos.

Piensa más allá de las características obvias de una audiencia para considerar las sutilezas de cómo tus lectores pueden percibir y reaccionar a tus palabras.

  • ¿Comprenderán los modismos?
  • ¿Y el humor?

Observa el ejemplo anterior.

Las instrucciones cómicas sobre CAPTCHA sólo podían funcionar con un público sofisticado y con experiencia.

Usuarios inexpertos en el uso de la computadora y los que no dominan el inglés no tienen idea de que "Comprueba que eres un humano" significa escribir los caracteres alfanuméricos en la caja.

captcha-instructions.jpg

 





Combatir La Información Excesiva

user_interface_design_instructions_too_much_information_by_spaciousplanet_34112286541427770.jpeg

Encontrar el equilibrio es siempre un problema.

Al escribir las instrucciones de interfaz de usuario, trata de incluir suficiente detalle para que los usuarios sepan exactamente qué hacer, pero no con tanto detalle que sea difícil procesar la información.

La gente sólo consigue procesar pocas cantidades de información a la vez.

Puedes darle una mano a la situación escribiendo las instrucciones en lenguaje claro y sencillo, lo que ayudará a que los visitantes realicen sus tareas de manera eficiente y rápida.

Trata de usar oraciones cortas cuando sea posible.

Por ejemplo, esta frase podría ser fácilmente dividida en dos: "Haz clic en el botón Añadir al Carro y luego haz clic en Desproteger en la parte superior de la pantalla."

Esta guía va de la mano con consejos sobre cómo ser breve, como el de arriba, pero a menudo es mejor hacerlo al final del proceso de la escritura.

Al final, te ves en tu escritura desde una perspectiva diferente. Es más fácil ver qué información es irrelevante, porque añade al cociente confusión.

Eliminar detalles extraños y superfluos reforzará la copia final.

En el ejemplo siguiente, la comunicación podría ser más eficaz con menos palabras.

No hay necesidad de sacrificar la claridad de la personalidad. Con el equilibrio, puedes tener ambas cosas.

user-interface-instructions.jpg

 





Escribe Tus Instrucciones De Modo Efectivo

user_interface_design_instructions_directions_toilette_22852320.jpg

La tarea de escribir con precisión implica una discriminación sutil entre las palabras con significados similares.

La investigación acerca de la usabilidad demuestra que las personas escanean una página web en lugar de leerla. Por lo tanto, su redacción debe comunicarse de manera efectiva si alguien está en la página al azar y apenas prestaba atención.

  • Usa palabras que promueven claridad. "Selecciona una fecha" va bien, pero "Haz clic en la fecha" suena más preciso.
  • Evita la doble negativa, como "No quiero cancelar mi registro." Así como,
  • Aléjate de los modismos que no entenderán algunos, tales como acrónimos y términos técnicos.

Hablando de precisión en la selección de palabras, cuando usted mira en este menú de abajo, ¿entiendes la diferencia entre buscar y navegar?

[Nota: Hay un cierto desacuerdo sobre si "seleccionar" o "hacer clic en" es más apropiado para las personas que utilizan las tecnologías de asistencia.]

choosing-words.jpg

 





Voz Activa Vs. Voz Pasiva

user_interface_design_instructions_thinking_by_ronen.jpg

La voz activa es nítida y limpia y la gente se moverá a la acción.

La voz pasiva hace bostezar a los lectores.

Comparar esta sentencia en dos voces:

  • Activa - "Haz clic en el enlace del Diario para buscar un artículo."
  • Pasiva - "El enlace del Diaro debe ser cliqueado cuando quieras buscar un artículo."

 





Cómo Proveer Instrucciones Claras De Diseño De Navegación

user_interface_design_instructions_pencil_by_eyebiz.jpg

El diseño de las instrucciones de la interfaz de usuario puede ser un reto.

Debes determinar donde deben estar, en lo visual y en la jerarquía de la información. A pesar de que necesitan ser identificadas por los usuarios, no deben dominar a la página. Y como un elemento de diseño, tienen que encajar perfectamente con el ambiente circundante.

En pocas palabras: Planea el texto de instrucciones durante las fases iniciales del diseño.

 





1) El Espaciamiento Vertical

user_interface_design_instructions_vertical_spacing.jpg

Si las instrucciones toman más de una línea, es importante que los lectores sepan cuáles instrucciones deben estar juntas las unas de las otras.

El leading (o espaciado vertical) entre oraciones relacionadas debe ser lo suficientemente grande como para permitir la legibilidad pero lo suficientemente pequeño como para mostrar las frases asociadas.

Cuando hay varios pasos, debes mantener cada etapa distinta al aumentar el interlineado. Numera las instrucciones si son complejas o se perciben como tales.

 





2) Tipo De Letra

user_interface_design_instructions_legibility_typeface_by_psychology_wichita_edu.gif

Considera el tipo como un elemento de diseño.

Usa un tipo de letra y estilo coherentes con el resto del diseño del sitio.

Considera el tamaño de la fuente. Las instrucciones de uso deben ser legibles por personas de todas las edades.

Evita texto en bitmap siempre que sea posible para que los usuarios puedan ampliarlo si necesario.

 





3) Gráficos

user_interface_design_instructions_arrow_signs_26549014.jpg

Sí. A veces es casi imposible decir algo con palabras.

Un gráfico proporciona apoyo y hace comprensible el texto, como en esta explicación de dónde encontrar tu número de cuenta en una revista.

ui-with-graphic.jpg

 





4) Estilo De Texto

user_interface_design_instructions_love_letter_rose_text_style19098833.jpg

Está bien añadir un poco de personalidad a tus instrucciones de interfaz de usuario y mensajes del sistema. Puede ser que ayude a que tus visitantes tengan una experiencia agradable o humorística.

Sólo asegúrate de que tu mensaje entre líneas, nunca se pueda interpretar como una forma de desprecio.

Por ejemplo, las instrucciones de abajo ayudan a que los visitantes se sientan mejor. Después de leer el mensaje, no se sienten perdedores por no mantener las contraseñas en un lugar donde pueden ser encontradas.

humorous-ui.jpg

 





5) Accesibilidad

user_interface_design_instructions_mobile-messaging-with-nimbuzz_2.jpg

Es importante que las instrucciones de letra pequeña puedan ser leídas por personas que tienen dificultades con la impresión pequeña y / o dispositivos utilizados para leer la pantalla del ordenador.

Aquí están algunas directrices de accesibilidad básicas para escribir instrucciones para la interfaz del usuario:

  • Evita el uso de texto gráfico para que pueda ser ampliado (examinado en el punto 2 arriba);
  • Ofrece alternativas de texto para contenido gráfico para que pueda ser traducido a otras formas, como el Braille, y
  • Separa claramente las instrucciones del fondo para que puedan ser vistas fácilmente.

Además, usa hiperenlaces contextuales de forma que tengan sentido si la persona no puede ver la pantalla.

Por ejemplo, un enlace que dice "instrucciones para usar este formulario" es mejor que uno con "haz clic aquí".

 





6) Prueba

user_interface_design_instructions_scientist_19094169.jpg

Prueba las instrucciones con los miembros de la audiencia, con la gente fuera de tu oficina y sin conocimiento previo de qué es lo que están haciendo.

  1. Observa una o más personas realizando la tarea para la cual has escrito las instrucciones.
  2. Nota cualquier dificultad que tienen y revisa las instrucciones.
  3. Repite el proceso hasta que la gente cumpla con la tarea sin problemas.

 





Conclusión

Puede sorprenderte en el tiempo y esfuerzo que se necesita para escribir instrucciones eficaces para la interfaz de usuario. Sin embargo, puede ser una de las inversiones más valiosas que seguir en el diseño de una interfaz de usuario con éxito.

A través de la sencillez de instrucciones comprensibles, se puede lograr por sí sola - la asistencia a los usuarios, el tono adecuado y tu personalidad, lo que demuestra que te importan tus lectores.




Sobre Connie Malamed

connie_malamed_thumbnail.jpg

Connie Malamed es la autora de Visual Language For Designers: Creating Graphics That People Understand. Ella escribe regularmente en Understanding Graphics y es la directora de Connie Malamed Consulting. Connie da consultorías, presentaciones y escribe acerca de la intersección de la psicología cognitiva, comunicación visual y aprendizaje.




Créditos de las fotos:
La Importancia De Los Modelos Mentales - Ktsdesign
Instrucciones Para El Diseño De La Interfaz Del Usuario: Conoce Tu Audiencia Primero - SiliconValleyWatcher
Instrucciones Para El Diseño De La Interfaz Del Usuario: Voz Activa Vs. Voz Pasiva - Ronen
Instrucciones Para Diseñar La Interfaz Del Usuario - Jesper Noer
Tipo De Letra - Wichita State University
Ejemplos - Connie Malamed
Otras Imágenes - Clipart

Connie Malamed -
Referencia: Understanding Graphics [ Seguir leyendo ]
Si te gustó la nota puedes recibir actualizaciones suscribiéndote via RSS o via email.

O compartirla:
 
 
 
 
Comentar    
blog comments powered by Disqus
 


 

 

 

 

Creative Commons License
This work is licensed under a Creative Commons License.

 

16073


Curated by

Publisher MasterNewMedia.org - New media explorer - Communication designer
Web Analytics