usabilidad y accesibilidad

Si la accesibilidad permite que las personas mayores y las personas discapacitadas puedan accede a la web, la usabilidad permite que cualquier persona, discapacitada o no, pueda utilizarla de una manera sencilla, productiva y eficaz.
Hay empresas, preocupadas por la usabilidad de sus portales, que ni siquiera se plantean hacerlos accesibles. Puede que no estén interesadas en ofrecer sus productos y servicios a las personas discapacitadas, o quizá desconozcan que están renunciando a un nicho de mercado nada despreciable.

El 8,9% de la población de Cataluña padece algún tipo de discapacidad. En el Estado español, este colectivo integra alrededor de 4 millones de personas y la OMS declara que, en el mundo, se encuentran en estas circunstancias más de 500 millones de habitantes.
Además, el usuario discapacitado de Internet es un usuario convencido. Internet representa para él autonomía para realizar gestiones y le facilita el acceso a todo tipo de información y recursos.

¿como ven lo ciegos?

Normalmente, los usuarios que "ven" no leen una página web palabra por palabra, sino a saltos y fijándose en la más importante. Es lo que en inglés se suele decir "escanear una página", pero en español tenemos un verbo mejor: "ojear una página".El artículo How Users Read on the Web de Jakob Nielsen es un poco antiguo, del año 1997, pero explica muy bien este comportamiento y ofrece algunos datos concretos basados en experimentos realizados. Estos experimentos suelen emplear técnicas de eyetracking.¿Y cómo lee una página web un usuario ciego que utilice un lector de pantallas? He encontrado dos artículos muy interesantes que describen el comportamiento de estos usuarios:
Browsing habits of screen reader users
Observing Users Who Listen to Web Sites

Ventajas de la accesibilidad

El usuario permanece más tiempo en nuestra Web.
La navegación resulta una experiencia agradable.
La web se convierte en una herramienta realmente útil.

Por qué la Accesibilidad Web es importante?

La Web es un recurso muy importante para diferentes aspectos de la vida: educación, empleo, gobierno, comercio, sanidad, entretenimiento y muchos otros. Es muy importante que la Web sea accesible para así proporcionar un acceso equitativo e igualdad de oportunidades a las personas con discapacidad. Una página Web accesible puede ayudar a personas con discapacidad a que participen más activamente en la sociedad.
La Web ofrece a aquellas personas con discapacidad una oportunidad de acceder a la información y de interactuar.

Creación de la estructura

Se refiere al proceso de identificar la forma que tendrá el Sitio Web que se está desarrollando, cuando hablamos de la estructura nos estamos refiriendo básicamente a cuál será la experiencia que tendrá un usuario cuando acceda al sitio. Se crea un árbol de contenido en el que se muestra de manera práctica cuántas secciones tendrán el sitio en desarrollo y cuántos niveles habrá dentro de cada uno.

mapa hipermedia 2-6

Elementos del Sistemas de Navegación.

Entre los elementos más relevantes que conforman el sistema de navegación se cuentan los siguientes:
Menú General: Siempre presente en todo el sitio, permite el acceso a cada una de las áreas del sitio.

Pie de Página: Ubicado en la parte inferior de cada página, mostrando el menú de ayuda e información de los desarrolladores del proyecto.
Botón Home: Botón para regresar a la página de inicio, será el logotipo
Botón Ayuda: Para recibir ayuda sobre qué hacer en cada pantalla del sitio, ubicado dentro del pie de página.

mapa hipermedia 2-5

mapa 2-4

Analizando el audio de un hipermedia de niños:

Audio.

Con respecto al audio en el hipermedia se utilizaran voces llamativas, claras, entendibles, pausadas, frases cortas y motivantes para inducir al niño a interactuar con el hipermedia, siendo utilizadas para guiarlos en el hipermedia y así estos puedan revisar e interactuar con el sitio, y este no se les haga muy aburrido y monótono. Como referencia tenemos de nueva cuenta la página de “Pipo club online”

liga:http://www.pipoclub.com/webonline/flash/sistema/general/general.swf

Características encontradas: El audio es llamativo. El audio es entendible y claro. Es pausado para evitar confusiones. El audio contiene el énfasis apropiado.



Colores.

En la selección de los colores a utilizar en el hipermedia, ya habiendo identificado la audiencia con las debidas características se obtiene como resultado la utilización de ciertos colores que reflejen la personalidad de los niños de entre 8 y 10 años de edad, para poder captar su atención es necesario mostrarles colores interesantes para ellos y que les llame la atención pero sin crear un ambiente de distracción en el hipermedia. Los colores se fundamentan con base a las características mostradas en el sitio “Color in motion” con la liga:

http://www.mariaclaudiacortes.com/colores/Colors.html

Los colores fueron elegidos por:
Rojo: dinámico, alegre, visible, alerta y divertido.
Amarillo: Creativo, brillante, alegre y curioso.
Azul: Técnico, educativo y formal.

Definiendo el público objetivo del hipermedia

El objetivo del sitio será:

El niño aprenderá signos zodiacales desde el punto de vista de la astronomía y su relación con las constelaciones.

Nuestro Público objetivo será:

Niños de 8 a 10 años

Escolaridad: Primaria 3er grado, 4to grado y 5to grado.

Este público fue escogido, por que comparten varias características como reconocer los mismos colores, puede leer de manera independiente una diversidad de textos cortos con distintos propósitos, Identifica formas y figuras, etc.

Tendencias.

Les gusta leer por sí solos, sin embargo, aún les sigue gustando que le lean. No les gusta fracasar, o simplemente les da miedo, es por ello que no es importante colocar la puntuación en sus juegos.

Contenido.

Después de haber determinado el publico objetivo (audiencia) se llegó a la conclusión de que la manera de cubrir el objetivo del sitio el cual es que los niños aprendan acerca de los signos zodiacales sería por medio de un hipermedia realizado bajo la interfaz de adobe flash cs4, debido a que la audiencia elegida esta en un rango de edad de entre 8 y 10 años se necesita una interacción mayor debido a las capacidad de atención, de retención mental y motriz de los niños es muy breve, lo que hace necesaria la utilización de un lenguaje apropiado y poco extenso, pero lo suficiente para dar a conocer los aspectos más relevantes de los signos zodiacales y la astronomía.


Un ejemplo de una buena presentación de información de manera textual considerando los aspectos mencionados anteriormente se puede observar en el sitio de “Pipo club online” con la siguiente liga:

http://www.pipoclub.com/webonline/flash/sistema/general/general.swf.

carcterísticas de los esquemas de navegación

Al generar el sistema de navegación, se deben tener en cuenta las siguientes características:
Consistente:
el sistema debe ser similar en todo el sitio, en lo referido a su ubicación y disposición en las páginas. Esto se aplica también a aquellas instituciones que pueden tener más de un Sitio Web.
Uniforme:
el sistema debe utilizar similares términos con el fin de que el usuario que lo vea en las páginas, confíe en que sus opciones llevan siempre hacia los mismos lugares dentro del sitio.
Visible:
el sistema debe distinguirse claramente dentro del sitio, con el fin de que el usuario cuente con él, como si se tratara de una guía permanente en el área en que se encuentre del sitio.

estructura de un sitio

Estructura:
Se refiere a la forma que tendrá el Sitio Web en términos generales con sus secciones, funcionalidades y sistemas de navegación. No considera ni incluye elementos gráficos (logotipos, viñetas, etc.).
Diseño:
Se refiere a la solución gráfica que se creará para el sitio, en la cual aparecen colores, logotipos, viñetas, y otros elementos de diseño que permiten identificar visualmente al sitio.
Dado lo anterior, cuando hablamos de la estructura nos estamos refiriendo básicamente a cuál será la experiencia que tendrá un usuario cuando accede al sitio. De esta manera podremos determinar dónde estarán ubicados los servicios interactivos (buscador, sistemas de encuestas, áreas de contenidos).
Gracias a la realización de esta etapa es posible discutir en términos muy prácticos cuál será la oferta de elementos de información e interacción que tendrá el usuario. Al no incluir elementos de diseño, se permite que la discusión sobre la estructura se desarrolle en aspectos concretos, sin que intervengan aún consideraciones estéticas que habitualmente atrasan la aprobación de esta etapa del desarrollo.

estructura de contenido

Ya has preparado el contenido de tu web, o al menos. El contenido inicial. Ahora es el momento de comenzar a pensar en cómo vas a organizar tu sitio. Esta estructura puede venirte dada por el tema que trates en tu sitio, pero al definirla debes pensar en facilitar al máximo la navegación por tu web de los visitantes. Nunca olvides que tú puedes conocer muy bien tu web, pero quienes lleguen a él por primera vez no. Te mostramos las estructuras básicas de cualquier sitio web. Ojo esta página es un poquito larga, pero sumamente útil: Árbol

En esta estructura existe una página principal (la home page en terminología inglesa) desde la que se puede llegar a otras páginas de la web. Estas otras páginas a su vez son un nodo para llegar a otro grupo de páginas. De esta manera llegaremos a tener las páginas agrupadas en niveles, de manera que para llegar desde el primero al último se deben atravesar los intermedios. Es una estructura muy jerarquizada y algo compleja y difícil para navegar. Puede ser útil para estructurar nuestro sitio en canales o grupos de páginas independientes. En cualquier caso no conviene que el número de niveles sea excesivo, nunca más de 3. Piensa que si queremos ir de una página a otra en el mismo nivel en otra rama del árbol, debemos retroceder hasta la raíz para luego alcanzar la página de destino. Esta imagen te aclarará la estructura

Existen más estructuras como: la de mixtas, listas o de red

organizacion de los esquemas de navegacion

Organización

􀁺 Dividir el contenido en fragmentos o unidades lógicos

􀁺 Establecer una jerarquía de generalidad o importancia

􀁺 Estructurar las relaciones entre los fragmentos (requisitos de navegación)

􀁺 Crear un árbol jerárquico bien balanceado

– Dos niveles, no más de dos clics

sobre esquemas de navegacion

Problemas de navegación de sitios web

Aspectos técnicos

– “Viajar por carretera sin mapa”

– Navegación de la información y del browser

– Separación datos-controles

– Expansión y confusión

Problemas de uso

– Carga mental

– Desorientación espacial

Metas de la navegación

􀁺 ¿Dónde estoy?

􀁺 ¿De dónde vengo?

􀁺 ¿Adónde puedo ir?

􀁺 ¿Cómo llego allí rápidamente?

Elementos de navegación

Controles

– Menús multi-nivel: una acción simple para volver al nivel superior y al menú principal

– Múltiples caminos a través de la jerarquía de menús cuando sea posible

Ayudas

– Mapa de menú / resumen de la jerarquía del menú

– Mostrar nivel inferior de menú al seleccionar una opción

– Historial de navegación

Navegación de sitios web:

aportacion

Formato de menús

Consistencia en menús

– Formato

– Títulos, instrucciones, elecciones

– Métodos de selección de elección

– Esquemas de navegación

Visualización de menús

– Mostrar permanentemente donde no obstruya en caso de

– referencias frecuentes o continuas necesariamente

– Por demanda si las referencias son ocasionales

– Mostrar siempre opciones “críticas”

Presentación

– – Menús y elecciones obvias al usuario

– – Aspecto diferente de otros componentes del sistema

Organización

– – Mostrar las alternativas relevantes

– – Estructura de menú adecuado a estructura de tarea

– – Minimizar el número de niveles sin perjuicio de la claridad

– – Ser conservadores en la cantidad de opciones a mostrar

– – Nunca usar menús con scroll

– – Facilidad de reestructuración por el usuario

– – Menús decrecientes en opciones

importancia de navegar bien

Navegación por el sitio web

Unos de los apartados más importantes en el diseño de páginas Web son los elementos de navegación. Ya que son los que nos permiten movernos a través de las diferentes páginas que hemos construido. Debemos ofrecer un esquema de navegación del sitio web claro, simple y razonable que informe con exactitud de la línea de trabajo y los contenidos del sitio y que propicie el acceso a los mismos de forma rápida. Es importante que el diseño sea homogéneo con sistemas de navegación similares en todas las páginas con una temática común.

Ej: www.irabia.org

Análisis de hipermedia.

Análisis de hipermedia.

Durante la clase del lunes, junto con el maestro realizamos un análisis del hipermedia entregado, los puntos que tratamos, fueron el conocer muy bien al publico especifico, cosa que no hicimos correctamente, otro punto fue la guía visual interactiva, donde el hipermedia debió a ver contado con instrucciones de cómo manejar el programa.

Los otro puntos que tratamos fueron los de conocimiento especializado, problemas de audio, problemas en enlaces rotos, etc.

critica constructiva

Durante la clase del lunes 21. El maestro nos dijo toda la infinidad de errores que tuvimos al crear nuestro proyecto, empezando desde nuestro objetivo hasta pasar por cada uno de los procesos, como son marketing, diseño y producción.

Todos nos reunimos en el área de TI, donde pudimos observar todos nuestros errores, que nos permitirán a prender. Así mismo junto con los compañeros, empezamos a redactar en el pizarrón, todo lo que hay que mejorar del hipermedia, algunos compañeros se molestaron, pero la verdad, es que tenemos que aprender a vivir así, yaqué no todos somos perfectos.

primeros criticas

Durante la semana anterior se estuvo trabajando sobre el hipermedia que se pretendía crear, desafortunadamente, no salió como nosotros lo pretendíamos, para empezar, no falto, navegabilidad, los botones estaban en des ubicación, las imágenes se perdían no tenía sentido de un hipermedia, y no de un multimedia.

el maestro nos dijo todos los defectos que tenia nuestro proyecto. eso nos ayudara a tener más cuidado al momento de diseñar un hipermedia para niños

mapa 2-3

comentario

Ya con la información, se nos pidió resumirla por bloques, uno fue astrología, donde su servidor se dio la obligación de ordenar toda y resumirla, para luego pasársela a producción, asi mismo la otra parte de astronomía, le toco retocarlo a Nelly.

parcial # 2-2

ordenar informacion.

El martes 13 de octubre, nuestro capitán de equipo el señor Leobardo, me puso a clasificar todo referente a astrología, como su descripción, signo zodiacal y su constelación. Esto es para que se le pueda pasar toda la documentación ordenada a los de producción.

cometario

En la clase, junto con unos compañeros, después de haber buscado información de las fichas técnicas, astrología, astronomía y demás, nos decidimos a organizarla, resumiendo cada concepto, luego se le paso al compañero Leobardo, para que se lo muestre al maestro. Así poder corregir los errores del archivo

comentario

este lunes, se platico con el jefe del departamento de diseño, tratando los puntos importantes sobre el hipermedia a crear de los oroscopos.

Juntos tratamos varios puntos como. las posiciones de diseño del hipermedia, los colores, asi como la informacion de todo los oroscopos.

se mensiono como debe de ser el hipermedia.

comentario

Durante la clase se propuso buscar informacion sobre los oroscopos, la informacion sera al go como:
la ficha tecnica, su astrologia, su astronomia, que permitira tener una nocion de cada signo zodiacal que permita a diseño aterrisar el proyecto.

mapa unidad # 2

Expo

Durante esta clase unos compañeros, expusieron sobre cómo crear un hipermedia para niños, que tiene las características siguientes:
1. contenido flash, pero no abusando de el, para que el hipermedia funcione correctamente.
2. tener colores llamativos, que permitan a los niños distinguir el hipermedia.
3. tener contenidos de botones, imágenes y links llamativos.
4. tener muy poco texto, esto es para no aburrir al menor.

Definir

En esta clase se dividió en tres grupos, uno de marketing, otro de diseño y producción, que posteriormente se realizo una investigación sobre los temas ya mencionados.

segundo parcial- comentario

Durante la clase de hipermedia, el maestro nos dio indicaciones sobre un hipermedia que debemos crear, el hipermedia será sobre los signos zodiacales, que en la semana de ingeniería se presentara al público.

ingenieria de requisitos(Comentario)

durante la clase vista, queda claro una cosa que las diferentes tecnicas en la ingenieria de requisitos, tiene su gran importancia, desde la entrevista, el mapa conceptual, los brainstorming, los sketch, los casos de uso, y demas.

la ingenieria de requisitos, debe representar una necesidad para los usuarios finales y el cliente.

Exposicion.

Dinamismo. Es aquélla, cuyo contenido se genera a partir de lo que un usuario introduce en un web o formulario.

Entre alguna de sus funciones son:

1. Mostrar el contenido de una base de datos, con base en la información que solicita un usuario a través de un formulario de web.
2. Actualizar el contenido de una base de datos.
3. Mejorar la interacción entre el usuario y el sitio web.

Por ejemplo el buscador de google. Al hacer una búsqueda y se genera un documento nuevo que antes no existía, con los resultados de tal búsqueda. Por lo tanto, el dinamismo se puede entender también en este otro sentido, como resultado de un proceso que genera un documento antes no existente.

O al hacer clic en un botón, que permita realizar alguna acción en un formulario.

Para que exista en una página web dinamismo es necesario contar con aplicaciones de programación como, PHP, ASP, NET,Javas Script etc. Estas aplicaciones hacen posible la existencia de elementos y documentos dinámicos y aportan un verdadero dinamismo al hipertexto.

La palabra dinamismo, tiene que ver con la interactividad de un sitio web, y es una característica del hipertexto. Que para que exista dinamismo, tiene que existir una interactividad entre los sitios webs.

El dinamismo de una página, suele ser muy importante, como las demás características, que puede tener la página, ya que permite al usuario, tener un sitio dinámico, que permita, realizar consultas, acciones, entre otras.

Estructura en Red

Lineal
La estructura lineal es la más simple de todas, la manera de recorrerla es la misma como si estuviésemos leyendo un libro, de manera que estando en una página, podemos ir a la siguiente página o a la anterior.

Ejemplo: blogspot, o http://www.hipertexto.info/documentos/conectividad.htm

Red asociativa
La estructura de red es una organización en la que aparentemente no hay ningún orden establecido, las páginas pueden apuntarse unas a otras sin ningún orden aparente. Es la más libre, pero también es la más peligrosa ya que si no se informa al usuario de en dónde se encuentra, puede perderse o puede no encontrar lo que anda buscando.

Ejemplo: mercado libre,

http://www.ejemplos2001.com/

mapa conceptual #2

caracteristicas de hipertexto

Accesibilidad: es muy importante, para un sitio, yaque si no el usuario puede aburrirse.
conectividad: suele ser los enlaces de imagen o texto, y suelen ser enlaces internos y externos

mapa conceptual #1

saludo

este es el primer día de clases, un poco lluvioso, pero muy bueno para empezar de nuevos nuestras activiodades de estudio. saludos

bay