Mostrando las entradas con la etiqueta Diseño Web. Mostrar todas las entradas
Mostrando las entradas con la etiqueta Diseño Web. Mostrar todas las entradas

sábado, 3 de noviembre de 2018

Usabilidad Web


El diseño no es sólo cómo se ve y cómo se siente; el diseño es cómo funciona, y para conocer como funciona debemos conocer su usabilidad de la web.

¿Qué es usabilidad web?
Viene del ingles que es Usability, muchos comenzaron a usar este termino en la tecnología pero recordemos que el término Usability en inglés significa facilidad de uso que tiene una interfaz, es decir un objeto.

Es decir es el grado de uso que tiene un objeto cuando el usuario interactúa. Entonces es como la cualidad que tiene una interfaz o un objeto. Considerando que el diseño no es usado por sí mismo, sino que son sus características en conjunto con el contexto del usuario las que van a determinar el grado de usabilidad.

¿Qué es un error en la usabilidad Web?
Cuando el usuario no puede cumplir con su objetivo, no importa el motivo del error si fue hecho al propósito o de manera casual, lo que importa es que hay un erro en ese momento y que el usuario tuvo una mala experiencia, es decir hay una mala facilidad de uso, y es evidentemente que hay un error de usabilidad por la mala experiencia  del usuario.

5 Componentes de Usabilidad:
  1. Facilidad de Uso: Que tan fácil es para el usuario poder realizar las primeras interacciones en el primer momento que se enfrenta con la interfaz, con el diseño qué tan fácil es entenderlo. Es decir es el primer contacto del usuario con el diseño.
  2. La eficiencia: Una vez que el usuario aya conocido el diseño, qué tan eficiente es el diseño para que el usuario pueda realizar las otras tareas o actividades en la web.
  3. Memorabilidad: Que tan intuitivo es el diseño, porque si el usuario pasa un tiempo sin interactuar con este diseño y luego vuelve a experimentarlo de manera rápida quiere decir que el aprendizaje fue rápido y que el diseño fue intuitivo.
  4. Los errores: Evaluar la cantidad de errores, la gravedad de los errores y si se puede recuperar. Recuperar en base a la necesidad del usuario y que pueda cumplir con sus objetivos ya sea por otro lado.
  5. La satisfacción: Es un componente muy importante cuando evaluamos usabilidad porque es lo que realmente nos va indicar si el usuario va a volver, es decir hay una satisfacción general con el usuario cuando interactúa con el diseño. Así mismo, esta la utilidad, es decir que la web sea útil ante la necesidad del usuario, e ahí la importancia de la necesidad de conocer las necesidades de nuestro usuarios.
¿Por qué es importante?
La importancia esta en que las personas interactúan, y regresan por mayor información y puedan hablar de nuestra web.

Si algo no es fácil de usar, la gente se va ir, no lo va a recordar, no hablará de ello, por lo tanto ese diseño no va tener éxito.

¿Cómo mejoramos la usabilidad?
Realizando test de usabilidad, para detectar los errores, la gravedad del error, lo mas importantes es que nos acercamos más a nuestro usuarios, conocerlos y saber más de sus objetivos y saber que la interacción que tiene con el diseño nos traerá satisfacción que podemos aprender muchísimo de todo esto.

¿Cuándo aplicar usabilidad?
La respuesta es siempre, desde el inicio hacia el final y nunca olvidarnos de que hay que iterar con nuestro diseño y probar todo el tiempo si lo que estamos agregando, lo que estamos haciendo satisface al usuario y si es de fácil uso o no.

No olvidarnos que es un proceso iterativo y que tenemos que ir siempre testeando nuestro diseño.

sábado, 1 de febrero de 2014

Qué es Twitter Bootstrap

Bootstrap, es uno de los frameworks más famosos en la actualidad y uno de los más utilizados, aunque no lo sepas, muchas páginas o sitios web de las que visitamos en nuestro día a día están creados bajo este framework. Originalmente fue creado por dos desarrolladores/diseñadores de twitter para acelerar el diseño de sus aplicaciones web.

La mayor ventaja de este framework es que podemos crear interfaces que se adapten a los distintos navegadores (responsive design - diseño responsivo) apoyándonos con todo el potencial del framework ya que cuenta con distintos componentes que nos ahorrarán mucho esfuerzo y tiempo. Sus principales tecnologías son HTML, CSS y Javascript, es decir todos ellos hacen que sea simple y flexible para cualquier componente alternativo e interacciones de interfaz de usuarios finales bastante amigables y flexibles.

Principales características:
  • Ofrece una serie de plantillas CSS y ficheros JavaScript que nos permiten integrar el framework de forma sencilla y potente en cualquier tipo de proyectos webs.
  • Bueno, de lo mencionado al principio que permite crear interfaces que se adapten a los diferentes navegadores, tanto de escritorio como tablets y móviles a distintas escalas y resoluciones de pantalla.
  • Se integra perfectamente con las principales librerías JavaScript, por ejemplo JQuery.
  • Ni que decir, ofrece un diseño sólido usando estándares como CSS3/HTML5.
  • Y lo más importante de este framework, es ligero y se integra de forma limpia en cualquier tipo de proyecto web.
  • Así mismo, funciona con todos los navegadores, incluido Internet Explorer usando HTML Shim para que reconozca los tags HTML5.
  • Dispone de distintos layout predefinidos con estructuras fijas a 940 píxeles de distintas columnas o diseños.
Para concluir con este pequeño articulo:

Bootstrap es un proyecto de código abierto con licencia Apache que podemos descargar desde su pagina oficial o github. Así ver los distintos ejemplos con los que podemos trabajar en cualquier implementación web. Para mayor información puede revisar los siguientes sitios.

Sitio web | Bootstrap
Descargar | Bootstrap en GitHub
Más información | Ejemplos de Bootstrap