PictoDroid es una aplicación para dispositivos Android que per mite a los usuarios comunicarse a través del uso de pictogramas o pictos (signos que representan esquemáticamente un símbolo, objeto real o figura). Esta versión permite expresar diferentes acciones y crear oraciones complejas. Las oraciones se crean seleccionado los pictos que pertenecen a diferentes categorías. Una ver realizada la oración, el sistema procederá a la lectura de a frase formada.

Os dejo este video que explica su funcionamiento

Más información

• Pictodroid
• Los héroes gallegos de una tecnología más accesible

Tambien te puede interesar

• No Related Post

El porcentaje de rebote indica la cantidad de usuarios que llegan a tu web y la abandonan sin visitar ninguna página más.

Cierto es que esté indicador hay que contrastarlo con el tiempo de permanencia en el sitio, ya que no es lo mismo si pasa 2 segundos en la web que si pasa 3 minutos leyendo un artículo.

Tambien que el tiempo de las visitas sea cero tenemos que relativizarlo sabiendo que (por ejemplo Google Analytics) lo calcula desde que llega un usuario hasta cuando visita otra página, por lo que si sólo visita una página  y abandona el site este tiempo será cero.

Los blogs y medios de comunicación tienen un porcentaje de rebote alto en general ya que el usuario suele ir a leer un contenido concreto y abandor la web al terminar la lectura.

Cómo reducir el porcentaje de rebote

1 Enlaces en el contenido

Ofrece enlaces a otros artículos de tu web en el contenido de cada artículo cuando puedan completar o aclarar algún aspecto que están nombrando.

2 Contenidos relacionados

Situar al final del artículo otros contenidos relacionados de tu blog o web pueden animar al vistante a seguir ampliando información sobre el contenido que acaba de leer.

3 Listados de destacados

Listado auxiliares como los más leído o lo más comentado ayudará al usuario a interesarse por los contenidos que otros usuarios consideraron de interés.

4 Titulares claros y descriptivos

La decisión de quedarse en la web o no de muchos usuarios se tomará simplemente leyendo el contenido del titular, uno inadecuado o confuso hará que el usuario abandone sin leer el artículo.

5 Utiliza los términos de interés por los que llegan a tu página web

Al llegar vistantes a tu web por buscadores, puedes utilizar el término de búsqueda que usaron para ofrecerle además otros contenidos que respondan a esa misma búsqueda.

6 Optimiza el tiempo de descarga

Hacer esperar demasiado a un usuario para ver un contenido puede hacer que abandone incluso antes de que termine la carga de la página

7 Menú de navegación claro

Ofrece un menú de navegación que permita al usuario seguir profundizando en las categorías y otros contenidos de tu web

8 Página 404 con navegación

Aunque es un error a evitar, a veces en sites grandes y con contenidos que caducan, como páginas de ofertas temporales, puede ser que queden en la  web referencias a ellas o indexadas en buscadores. Una página de error que ofrezca contenidos de interés o un mapa de la web puede  ayudar a que el usuario continúe con la navegación.

9 Ofrece incentivos

Si la web tiene contenidos gratuítos ofrecelos de manera clara para que interesar al usuarios.

10 Busca la interacción

Pequeñas llamadas a la acción del usuario, como una encuesta, puede ayudar a que el usuario siga en la web una vez finalizada la lectura del contenido que le llevó a entrar en tu web.

Más información

• Porcentaje de rebote (bounce rate): verdades y mitos
• 5 estrategias para reducir el porcentaje de rebote

Tambien te puede interesar

• Diseño de botones call-to-action, las claves del éxito
• Como utilizar los iconos para mejorar el diseño de su web
• Landing Page. La primera impresión es lo que cuenta. 30 Tips
• 10 malententidos sobre la usabilidad y sus matices
• 18 cosas que hacer y no hacer para mejorar la usabilidad de su web

Algunas claves para el éxito de un call to action

1 Textos descriptivos

Textos como “Comprar”, “Suscribirse” son claros, pero pueden reforzarse más detallando más la acción “Comprar Revista”, “Suscribirse al RSS”. Estos textos no solo ayudarán a definir la acción fuera de contexto, sino que además al ser más largos aumentará el peso visual de los mismos.

Intente explicar al máximo lo que se va encontrar el usuario despues de pulsar el bótón.

Debe empezar por un verbo, sino no es una llamada a la acción.

2 Diseño atractivo

Un diseño atractivo nos ayudará a atraer la atención del usuario y a transmitir mayor confianza. Dar un efecto 3D de relieve ayudará a que el usuario lo perciba como un botón clicable.

3 Alto contraste de colores

El color del botón tiene que destacar y contrastar con el fondo de la página.

Además el color es un elemento con el podemos jugar para destacar unos botones de otros. Por ejemplo color llamativo para continuar una acción y color neutro para cancelar o volver para atrás.

4 Tamaño

Para hacerlo más evidente al usuario, el botón debe destacar en tamaño con respecto al resto de los elementos de texto, maximizando además el área activa.

5 Libere espacio alrededor

Crear un adecuado espacio libre alededor del botón hará que aumente su importancia visual, ayudando a atraer la atención

6 Acompáñelo de un icono descriptivo

Un icono adecuado logrará no solo atraer la atención de los usuarios, sino que reforzará de manera importante el mensaje del texto del botón. Ayudará a que el usuario entienda la acción rápidamente.

7 Transmita urgencia

Frases como “descargar ahora”, intentan transmitir la sensación de inmediatez para evitar que el usuario pase de largo por el botón con la intención de volver más tarde, cosa que en pocas ocasiones ocurre.

En resumen: Affordance

Tal como Donald Norman apunta en The Design of Everyday Things, el affordance es aquella cualidad que un objeto tiene para autodescribir las posibilidades que ofrece y hacerlo de forma perceptible para el usuario.

Es decir, si es un elemento pulsable, tiene que verse claramente está propiedad, si lleva a una acción que quede clara cual es, si en el diseño de la página lo consideramos importante, que destaque visualmente sobre el resto de los elementos.

Más información

• 25 Examples of Convincing Call-to-Action Buttons
• Web Design Trends: Call To Action Buttons
• Good Call-to-Action Buttons
• 10 techniques for an effective ‘call to action’
• Call to Action Buttons: Examples and Best Practices

Tambien te puede interesar

• Reducir el porcentaje de rebote, 10 consejos
• Como utilizar los iconos para mejorar el diseño de su web
• Diseño de enlaces en nuestra página web
• 10 pasos para hacer más usable tu tienda online
• 18 cosas que hacer y no hacer para mejorar la usabilidad de su web

Podría estar vendiendo los mejores productos en el mundo a precios muy competitivos, pero si los compradores no los encuentran o se confunden en el camino, nunca conseguirá sacar todo el partido a su potencial de ventas.

Mejorar la usabilidad de su tienda online mejorará el proceso de compra haciéndolo más fácil y sencillo. Estos 10 pasos le ayudarán a mejorar las ventas y la satistacción del cliente.

1 Permita la compra sin registro

Cuando el usuario tiene la percepción de que va a hacer una compra única en su site se muestra reticente, y muchas veces con razón, a dejarle sus datos. Se le puede  ofrecer la posibilidad del registro ouna vez finalizado el proceso de cmpra, como una forma de evitarle la molestia de volver a cubrir los datos en otra ocasión.

2 Haga el proceso de alta lo más simple posible

¿Cuanta información necesita de su cliente realmente?. Normalmente lo único que se necesita es una dirección de correo y una contraseña. Utilizar el correo en vez de un nombre de usuario distinto suele evitar errores. Si más adelante para realizar un envío necesita más datos solicíteselos.

3 Uso de la miga de pan como orientación

La miga de pan es una necesidad en las tiendas online que se estructuran en categorías, subcategorías etc, y serviran al usuario para tener claro en donde está en todo momento, además, en el proceso de compra, ir indicando el paso en el que se encuentra el usuario y los que le quedan ayudará a que el visitante termine con éxito este proceso.

4 Hacer que los compradores se sientan seguros

Con razón la gente se preocupa al dar su número de tarjeta de crédito y datos personales en línea. Si desea vender debe intentar transmitir a sus clientes la máxima seguridad. Uilizar un certificado de seguridad le ayudará a que el cliente sepa que es un comerciante serio.

5 Confirmación

La confirmación en los procesos transmitirá seguridad a los compradores y le evitará gestiones con clientes que se confundan.

6 Búsqueda

Toda tienda de comercio electrónico debe tener un buscador situado en una zona altamente visible. Si su tienda online ofrece un número elevado de productos deberá además ofrecer una búsqueda avanzada que permita afinar más.

7 Especifique los artículos relacionados

Tantos los productos relacionados como las ventas cruzadas son altamente rentables en las tiendas de comercio electrónico si lo hace sin que el usuario se sienta presionado. Si va a comprar una aparato electrónico ofrecerle productos como baterías, cemables morias etc, puede ser muy rentable.

8 Botones de acción “call-to-action”

Estos botones son altamente efectivos y debe ser un elemento clave a la hora de diseñar su tienda online: letras grandes, claras y en un color que destaque sobre el fondo. Utilizar mejor “Añadir al carrito” que “Comprar ahora” que puede asustar a algunos usuarios.

9 Evite cargos ocultos

Si algo que enfade al cliente son los costes ocultos. Muestre siempre de manera clara los impuestos y los gastos de envío.

10 Mantenga la compra visible

El carro de la compra debe mostrarse en todo momento para que los usuarios puedan ver los pruductos y el coste de la operación.

Otros Artículos en este blog

• La usabilidad del proceso final de compra

Fuente: 10 Steps To A More Usable Ecommerce Website

Tambien te puede interesar

• CERMI denuncia que Facebook no respeta las pautas de accesibilidad
• Diseño de botones call-to-action, las claves del éxito
• 18 cosas que hacer y no hacer para mejorar la usabilidad de su web
• Usabilidad: No por ser más intuitivo y simple es mejor. ¿Y el aprendizaje?
• ¿Cómo adapto un interfaz web para móvil?

Este artículo nos da 18 consejos de cosas que debemos hacer y de otras que debemos intentar evitar para diseñar una página web usable.

1. No utilice una rejilla para su diseño web: Las estructuras demasiado rígidas pueden condicionar el diseño y la distribución de los contenidos
2. No olvides el formulario de búsqueda: Sobre todo si tu web tiene muchas páginas. Si son pocas páginas no pasa nada si la arquitectura de la información y la navegación es correcta
3. Haz la navegación sencilla para encontrar y leer
4. No untilices el enlace mailto:  para el contacto: Mejor siempre un formulario.
5. Utiliza las aplicaciones web que sea posible para testear la experiencia de usuario: Un par de pruebas de la web, puede ayudarte a corrgir una gran cantidad de errores.
6. No inundes las barras laterales con widgets: que no aporten valor al contenido de la página
7. Comprueba que tu web se bien en diversos navegadores
8. No hagas al usuario saltar al vacío al rellenar un formulario: Simplifica los formularios al máximo para que el usuario los puedas rellenar fácilmente.
9. Dales a tus páginas una estructura consistente
10. No olvides una hoja de estilos para los usuarios que quieran imprimir una página
11. Asegurate que tu página es fácil de hojear: A los usuarios les gusta “echar un ojo” rápido a la página web al llegar. Usar encabezados (h1,h2,), y cuadros destacados y de resumen facilitarán al usuario encontrar los contenidos que busca.
12. No introduzcas mas contenido en un espacio que el quepa comodamente.
13. Introduce la miga de pan en tus diseños: La miga de pan ayudará al usuario a saber entodo momento donde está y como volver al nivel anterior
    
14. Utiliza colores y contrastes adecuados para centrar la atención
15. No te olvides de revisar los enlaces rotos
16. No desprecies el pie de página y el poder que tiene: Aprovecha el pie de página para ofrecer enlacse a los artículos destacados, formularios de subscrición etc.
17. Utiliza wireframes en el proceso de diseño
18. No escribas para los buscadores, escribe para los lectores

Tambien te puede interesar

• La importancia de un diseño centrado en el usuario
• Usabilidad: No por ser más intuitivo y simple es mejor. ¿Y el aprendizaje?
• Redactar web para una lectura rápida
• Fases del diseño de una web
• No existe usuario malo. Existen diseñadores inconscientes.

Iconos para mejorar el contenido

Los iconos pueden ser elementos decisivos en el diseño de su web, ya que pueden funcionar como un respiro para el contenido y pueden servir como guía visual para el lector. Los usuarios primero ojean el contenido y después deciden que leer. En la mayoría de los casos el visitante simplemente pulsan en un enlace y se va. El contenido solo no es suficiente, tiene que estar estructurado para sea más cómodo para el lector.

Los iconos hacen el contenido menos intimidante y divide el contenido en bloques que el usuario es mejor de asimilar y entender.

Los iconos deben acompañar al contenido y aportarle valor, no pueden servir para distraer la atención del lector.

Iconos para embellecer las listas

Una lista mal diseñada, puede arruinar la estructura general de la página. Con la ayuda de los iconos se puede lograr presentaciones atractivas y coherentes.

Iconos para señalar las nuevas características de sus aplicaciones

Utilizando iconos para  ayudar a entender de manera simple las características nuevas. Un icono puede ser un buen cebo para que sus visitantes se interesen en algo que de otro modo podría pasar desapecibido.

Icono para apoyar los principales enlaces

Las cabeceras grandes son visualmente muy atractivas, una gran línea con iconos adecuados ayudará a los visitantes en su primera visita.

Iconos para visualizar la lista de productos

Iconos para la lista de servicios

Iconos para redes sociales

Iconos como ilustraciones de cabecera

Iconos para identificar secciones

Iconos en los menús

Una pequeña imagen puede ayudar en gran medida a reconocer las distintas opciones que se le ofrecen

Artículo original : How tu use icons to enhace your desings

Tambien te puede interesar

• Reducir el porcentaje de rebote, 10 consejos
• Diseño de botones call-to-action, las claves del éxito
• 10 malententidos sobre la usabilidad y sus matices
• Diseño de enlaces en nuestra página web
• 18 cosas que hacer y no hacer para mejorar la usabilidad de su web

¿Cómo afecta?. La mejor forma de pensar sobre ello es poniéndose en el asiento del usuario

Al llegar a una web desde cualquier fuente, buscadores, redes sociales, enlaces, recomendaciones personales, lo que un usuario busca es información sobre la empresa propietaria del sitio para despues, si le interesan, contratar los servicios.

A la hora de comparar entre distintos servicios que parecen ofrecer lo mismo lo que se necesita es más información. Las entradas en los blogs corporativos en los que se demuestra su saber sobre el tema, la descripción de los artículos que ofrece será junto con el precio los elementos más importantes para tomar una decisión.

Una web bien estructurada y que haga sencillo el acceso a los contenidos de valor de su web hará que el usuario se sienta especialmente cómodo al encontrar la información que desea.

El contenido de la web aumenta la usabilidad de su página web dando a los visitantes exactamente lo que quieren.

1. Información sobre el tema que domina
2. La fé en tí como proveedor de servicios mediante la demostración de tu conocimiento y compromiso con el servicio
3. Preselección para ver si eres el proveedor de servicios para ellos.

Lo que parece que puede ser contraproducente, que es enseñarle a un potencial  cliente lo que sabes, se convierte en el factor decisivo para demostrar el conocimiento sobre la materia y probablemente se convierta en la principal razón para que contrate tus servicios.

Tambien te puede interesar

• Redactar web para una lectura rápida
• 10 malententidos sobre la usabilidad y sus matices
• No existe usuario malo. Existen diseñadores inconscientes.
• Reducir el porcentaje de rebote, 10 consejos
• Diseño de botones call-to-action, las claves del éxito

• MouseFLow permite grabar los movimientos del ratón de los usuarios que utilizan tu web, y donde hacen click.
• Gratuíto: Cien muestras por mes

Lo primero que me llamó la atención del servicio es lo usable que es. Tardé 3 minutos, por reloj, en ponerlo a funcionar en una página web y entender como funcionaba.

Limitaciones

Las limitaciones más importantes nacen de la propia tecnología que utiliza. Graba por un lado los movimientos del ratón y por otro la url en la que está navegando el usuario superponiendolas para su visualización.

Esto funciona perfectamente en un gran porcentaje de páginas web pero hay algunos casos en los que he encontrado ciertos aspectos a mejorar.

• Javascript: Como los sistemas de pestañas, slides, cargas ajax de datos, etc. Son comportamientos de cliente web y no tienen reflejo en la url por lo que Mouseflow no se entera de los cambios realizados en la web y ves el movimiento del ratón imaginándote el escenario donde está el usuario
• Variables de sesión, variables ‘POST’ de formulario: Al igual que en el caso anterior al realizar las transiciones de páginas por variables no reflejadas en la url, Mousflow no es capaz de reproducir con certeza la página que está viendo el usuario.
• Zonas Privadas: El sistema no es capaz de autentificarse, por lo que las zonas de la web que necesitan esta autentificación no podrán ser analizadas.

Tambien te puede interesar

• Usabilidad: No por ser más intuitivo y simple es mejor. ¿Y el aprendizaje?
• Reducir el porcentaje de rebote, 10 consejos
• CERMI denuncia que Facebook no respeta las pautas de accesibilidad
• Diseño de botones call-to-action, las claves del éxito
• 18 cosas que hacer y no hacer para mejorar la usabilidad de su web

Si a la hora de maquetar una web tenemos problemas con la visualización en los distintos navegadores, al crear un correo electrónico la casuística de clientes aumenta en gran medida, y su capacidad para interpretar el HTML y las CSS se reduce en muchos casos, por lo que hay que ser especialmente cuidadoso con los recursos que utilizamos.

Consejos para la creación de un boletín de correo electrónico

Contenidos

• No incluyas demasiados gráficos o imágenes de mucho peso, porque dismunuye su entregabilidad
• Evita todo el diseño con imágenes o podrá ser etiquetado como SPAM
• Contenido claro y sencillo, la mayoría de la gente dedicará 1,4 segundos a leer tu correo
• Si es un boletín de subscripción, facilita siempre el enlace para poder darse de baja.

Maquetación

• Utilice tablas para crear la estructura: El tratamiento de float, margin, padding en Gmail o en Outlook 2007 no nos permitirá usar estos estos recursos para la maquetación
  • Fije el ancho en las celdas, no en las tablas
  • Para dar espacio utilice cellpadding
• Anide tablas siempre que pueda en vez  de jugar con márgenes o espaciados interiores
• Utilice <td bgcolor=”#ff6600″> mejor que por CSS. Para las imágenes actúe igual, tenga en cuenta que algunos clientes de correo no soportatrán esta propiedad por lo que debe  proporcionar un color de fondo coherente.
• Evite los espacios en blanco en sus celdas
• Algunas CSS son soportadas correctamente por la mayoría de los lectores de correo como  font.
• No utilice métodos abreviados para declarar sus CSS
  • NO: p {font:bold 1em/1.2em georgia,times,serif;}
  • SI: p {font-weight: bold;font-size: 1em;line-height: 1.2em;font-family: georgia,times,serif;}
• Enlaces:
  • Proporcione definiciones de colores inline y una etiqueta <span> redudante para garantizar la visualización del color deseado
  • <a href="http://somesite.com/" style="color:#ff00ff"><span style="color:#ff00ff">this is a link</span></a>
• Imágenes:
  • No utilice formato PNG
  • No se olvide del atributo ALT
  • Incluya siempre la dimensión de la imagen
  • No use float, utlice align

Más información

• The Email Marketing Experience
• Rock Solid HTML Emails
• Lista de  CSS soportadas por los clientes de correo
  

Tambien te puede interesar

• No Related Post

Además el aumento de conexiones desde dispositivos móviles cuya velocidad de transferencia de datos a es baja vuelve a crear las necesidad de optimizar las web para este tipo de conexiones.

10 Consejos

1. Páginas más pequeñas de 25Kb: Páginas que carguen en menos de 10s para conxiones de 20Kbps.
2. Reduce el número de imágenes: Es posible diseñar bien sin muchas imágenes, usando CSS para el layout y rollover.
3. Estructura bien la web: Proporciona navegación simple, no hagas a los usuarios cargar páginas innecesarias.
4. Usa Estilos en Cascada: No uses tablas para el Layout.
5. Minimiza las llamadas http: Cada imagen, cada archivo CSS o Jav script es una llamada http distinta. Muchas pueden provocar lentitud en la carga de la página.
6. Permite la compresión: Comprimiendo las página en el servidor puedes reducir a la mitad las páginas.
7. Páginas Cacheable: Permite a los navegadores mantener en cache los contenidos.
8. No uses PDFs: Si los usas optimizalos tambien. Pueden optimizarse usando graficos vectoriales y minimizando el número de fuentes.
9. Pon primero los items más útiles: Pon el menú de navegación en la cabecera de cada página y así será lo primero en cargarse. Haz tus páginas útiles antes de que termine la carga.
10. Muestra el tamaño de los enlaces: No obligues a a descargar archivos grandes, enlazalos siempre, y si son mayores de 75kb muestra  el tamaño.

Mas información: Web Design Guidelines for Low BandWidth

Tambien te puede interesar

• No Related Post