UNIVERSIDAD CAPITÁN GENERAL “GERARDO BARRIOS”

CENTRO REGIONAL DE USULUTÁN

FACULTAD DE CIENCIA Y TECNOLOGÍA

CATEDRÁTICO:

Carla Milagro López

CARRERA:

Técnico en ingeniería en sistemas y redes informáticas

Alumno:

Daniel Antonio Ortez Osorio

CODIGO:

USTS028314

Principios generales de usabilidad en sitios web.

Aunque estos principios pueden parecer muy generales son la base de la

disciplina y de su extrapolación y perfecta comprensión permite resolver

cualquier casuística concreta.

1. Anticipación, el sitio web debe anticiparse a las necesidades del usuario.

2. Autonomía, los usuarios deben tener el control sobre el sitio web. Los

usuarios sienten que controlan un sitio web si conocen su situación en un

entorno abarcable y no infinito.

3. Los colores han de utilizarse con precaución para no dificultar el acceso a

los usuarios con problemas de distinción de colores (aprox. un 15% del

total).

4. Consistencia, las aplicaciones deben ser consistentes con las expectativas

de los usuarios, es decir, con su aprendizaje previo.

5. Eficiencia del usuario, los sitios web se deben centrar en la productividad

del usuario, no en la del propio sitio web. Por ejemplo, en ocasiones tareas

con mayor número de pasos son más rápidas de realizar para una persona

que otras tareas con menos pasos, pero más complejas.

6. Reversibilidad, un sitio web ha de permitir deshacer las acciones

realizadas

7. Ley de Fitts indica que el tiempo para alcanzar un objetivo con el ratón

está en función de la distancia y el tamaño del objetivo. A menor distancia y

mayor tamaño más fácilidad para usar un mecanismo de interacción.

8. Reducción del tiempo de latencia. Hace posible optimizar el tiempo de

espera del usuario, permitiendo la realización de otras tareas mientras se

completa la previa e informando al usuario del tiempo pendiente para la

finalización de la tarea.

9. Aprendizaje, los sitios web deben requerir un mínimo proceso de

aprendizaje y deben poder ser utilizados desde el primer momento.

10. El uso adecuado de metáforas facilita el aprendizaje de un sitio web, pero

un uso inadecuado de estas puede dificultar enormemente el aprendizaje.

11. La protección del trabajo de los usuarios es prioritario, se debe asegurar

que los usuarios nunca pierden su trabajo como consecuencia de un error.

12. Legibilidad, el color de los textos debe contrastar con el del fondo, y el

tamaño de fuente debe ser suficientemente grande.

13. Seguimiento de las acciones del usuario. Conociendo y almacenando

información sobre su comportamiento previo se ha de permitir al usuario

realizar operaciones frecuentes de manera más rápida.

14. Interfaz visible. Se deben evitar elementos invisibles de navegación que

han de ser inferidos por los usuarios, menús desplegables, indicaciones

ocultas, etc.

Otros principios para el diseño de sitios web son:

a) Los usuarios deben ser capaces de alcanzar sus objetivos con un mínimo

esfuerzo y unos resultados máximos.

b) Un sitio web no ha de tratar al usuario de manera hostil. Cuando el usuario

comete un error el sistema ha de solucionar el problema, o en su defecto

sugerir varias soluciones posibles, pero no emitir respuestas que meramente

informen del error culpando al usuario.

c) En ningún caso un sitio web puede venirse abajo o producir un resultado

inesperado. Por ejemplo no deben existir enlaces rotos.

d) Un sitio web debe ajustarse a los usuarios. La libertad en el uso de un sitio

web es un término peligroso, cuanto mayor sea el número de acciones que

un usuario pueda realizar, mayor es la probabilidad que cometa un error.

Limitando el número de acciones al público objetivo se facilita el uso de un

sitio web.

e) Los usuarios no deben sufrir sobrecarga de información. Cuando un

usuario visita un sitio web y no sabe dónde comenzar a leer, existe

sobrecarga de información.

f) Un sitio web debe ser consistente en todos los pasos del proceso. Aunque

pueda parecer apropiado que diferentes áreas tengan diseños diferentes, la

consistencia entre los diseños facilita al usuario el uso de un sitio.

g) Un sitio web debe proveer de un feedback a los usuarios, de manera que

éstos siempre conozcan y comprendan lo que sucede en todos los pasos del

proceso.

Diseño liquido o fluido, plantillas ajustables según dispositivo

"Diseño líquido o fluido" (Responsive Web Design)

Es la técnica para crear plantillas que automáticamente se ajustan al tamaño

de la pantalla en las que están siendo navegadas, utilizando la definición de

reglas de medios de destino definidas dentro de las nuevas características del

CSS3

En el pasado el diseño de la interfaz se basaba en resoluciones aproximadas

de 960 pixeles, y esto funcionaba porque un 99% de los usuarios podían

adaptarse y leer fácilmente esta resolución, independientemente de la

máquina, el navegador, o el sistema operativo que estaban utilizando. Los

tiempos cambiaron y cada vez son más los usuarios que utilizan dispositivos

móviles para navegar. Ante esto las empresas empezaron a diseñar dos

aplicativos, para diferentes tipos de dispositivos, una versión full y una

versión más liviana para dispositivos móviles que intentaban cubrir todo el

contenido de la versión original. Está técnica tiene ciertas desventajas

porque exige un mayor esfuerzo, la sensación de no tener todo en la versión

móvil y la creciente diversidad de modelos con una igual cantidad de

tamaños.

Se tiene que tener en cuenta que la venta de "smartphones", está

despegando y superará muy pronto a la venta de PC (tanto de escritorio

como portátiles). Actualmente basados en las estadísticas de 20 personas

que visitan tu sitio web, por lo menos 1 de ellos lo hace por medio de un

dispositivo con pantalla de menos de 3 pulgadas. Esto ha disparado el

diseño amigable-móvil en el que se crean diseños que se ajustan a cada

tamaño de pantalla.

En respuesta a esto se tiene el Diseño Liquido o Fluido, no tienen un ancho

fijo, y permiten que cada navegador lo adapte a su tamaño. Usando está

técnica puedes eliminar la necesidad de crear diseños especiales por cada

dispositivo. Permite con un simple código mostrar el contenido en un

ilimitado número de medios.

Diseño web híbrido

Se habla de diseño híbrido cuando en una web se combinan áreas con ancho

fijo y otras con ancho variable. El resultado final es realmente una web de

diseño líquido que conserva las proporciones en determinadas áreas.

Diseño Web Para Móvil

Por qué necesita una Pagina Web Móvil

Porque cada vez más sus clientes y sus prospectos están utilizando la

Tecnología Móvil...

Sabes que cada vez hay más personas buscando productos y servicios a

través de los dispositivos móviles.

En el año 2013, más personas usaron sus dispositivos móviles en lugar de

Computadoras Personales y Laptops para acceder a internet.

Las búsquedas desde dispositivos móviles se han CUADRUPLICADO desde el

año 2010.

Para el año 2015, habrá tan solo un dispositivo Móvil por cada PERSONA en el

mundo.

Algunas características que puede tener su Sitio Web Móvil Haga que sus visitantes puedan ver con detalle su mejor Menú.

Permita que sus visitantes o clientes hagan reservaciones desde su móvil sin

problemas.

Con un solo clic sus visitantes pueden llegar hasta su establecimiento desde

donde se encuentren con el mapa asistido.

Mantenga informado a sus clientes de los eventos más importantes de su

empresa.

Brinde cupones móviles a sus clientes para aumentar las promociones de sus

productos o servicios.

Logre tener más contacto con sus clientes. Ahora con un solo clic ellos

pueden llamarle sin necesidad de copiar y pegar números telefónicos.

Razones por las que tiene que tener un Sitio Web Adaptado para

Dispositivos Móviles:

91% de los usuarios de TELEFONOS INTELIGENTES han buscado productos,

servicios y empresas en sus teléfonos móviles.

95% de los usuarios de Teléfonos Inteligentes han buscado información sobre

negocios locales en su Área.

9 de cada 10 Búsquedas Móviles llevan a una Acción. 70% realiza la Acción en UNA

HORA

Casi todos los usuarios que buscan información en dispositivos móviles REALIZAN

UNA ACCION en 24 horas.

Por primera vez en la historia, las personas están tomando importantes decisiones

de NEGOCIOS, COMPRAS y ESTILO DE VIDA usando teléfonos inteligentes y

dispositivos móviles.

Patrones de Comportamiento

Los patrones de diseño son la base para la búsqueda de soluciones a

problemas comunes en el desarrollo de software y otros ámbitos referentes

al diseño de interacción o interfaces. Un patrón de diseño es una solución a

un problema de diseño. Para que una solución sea considerada un patrón

debe poseer ciertas características. Una de ellas es que debe haber

comprobado su efectividad reusable, lo que significa que es aplicable a

diferentes problemas de diseño en distintas circunstancias.

Patrones de Comportamiento del Software

Chain of Responsibility (Cadena de responsabilidad): Permite establecer la

línea que deben llevar los mensajes para que los objetos realicen la tarea

indicada.

· Command (Orden): Encapsula una operación en un objeto, permitiendo

ejecutar dicha operación sin necesidad de conocer el contenido de la misma.

· Interpreter (Intérprete): Dado un lenguaje, define una gramática para

dicho lenguaje, así como las herramientas necesarias para interpretarlo.

· Iterator (Iterador): Permite realizar recorridos sobre objetos

compuestos independientemente de la implementación de estos.

· Mediator (Mediador): Define un objeto que coordine la comunicación

entre objetos de distintas clases, pero que funcionan como un conjunto.

· Memento (Recuerdo): Permite volver a estados anteriores del sistema.

· Observer (Observador): Define una dependencia de uno-a-muchos

entre objetos, de forma que cuando un objeto cambie de estado se notifique

y actualicen automáticamente todos los objetos que dependen de él.

· State (Estado): Permite que un objeto modifique su comportamiento

cada vez que cambie su estado interno.

· Strategy (Estrategia): Permite disponer de varios métodos para resolver

un problema y elegir cuál utilizar en tiempo de ejecución.

· Template Method (Método plantilla): Define en una operación el

esqueleto de un algoritmo, delegando en las subclases algunos de sus pasos,

esto permite que las subclases redefinan ciertos pasos de un algoritmo sin

cambiar su estructura.

· Visitor (Visitante): Permite definir nuevas operaciones sobre una

jerarquía de clases sin modificar las clases sobre las que opera.

Patrones Estructurales.

Propósito:

Proporcionar una interfaz de alto nivel, unificada a un conjunto de interfaces

en un subsistema, haciendo más fácil de usar todas aquellas, minimizando

las comunicaciones y dependencias entre el liente y los subsistemas.

Intención:

Su objetivo es reducir al mínimo la comunicación y las dependencias entre los

subsistemas; una manera de lograr este objetivo es introducir un objeto que

proporciona la fachada de una sola interfaz simplificada a la más general de

las instalaciones de un subsistema.

Motivación:

Estructurar un sistema en subsistemas ayudando a reducir la complejidad,

estructurando un entorno de programación.

Aplicabilidad:

Proporciona una interfaz sencilla a un subsistema complejo, – a medida que

un subsistema evoluciona va teniendo más clases, más pequeñas, más

flexibles y configurables, – existen clientes que no necesitan tanta flexibilidad

y que quieren una visión más simple del subsistema ,– sólo los clientes que

necesiten detalles de más bajo nivel accederán a las clases detrás de la

fachada, puesto que cuando hay muchas dependencias entre los clientes y

las clases de implementación de una abstracción es cuando la fachada

desacopla el subsistema de los clientes y de otros subsistemas, mejorando la

independencia de subsistemas y la portabilidad.

Para estructurar un sistema en capas –la fachada define el punto de entrada

de cada nivel, – se pueden simplificar las dependencias obligando a los

subsistemas a comunicarse únicamente a través de sus fachadas.

Los participantes:

Facade:

Conoce qué clases son responsables de las peticiones y así, delega

las peticiones a los objetos apropiados.

Subsystem:

Implementa la funcionalidad del subsistema, realiza el trabajo solicitado por

el objeto Façade y no conoce, ni mantiene referencia alguna del objeto

mismo Facade.

Colaboraciones:

Los clientes se comunican con el subsistema haciendo peticiones a

la Fachada, que las envía a los objetos del subsistema apropiados (la

fachada podría también traducir su interfaz a la de las interfaces del

subsistema), de modo que los clientes que usan la fachada no tienen que

acceder a los objetos del subsistema directamente.

Consecuencias:

Oculta a los clientes los componentes del subsistema, reduciendo el número

de objetos con los que tienen que tratar los clientes.

Disminuye el acoplamiento entre un subsistema y sus clientes, un menor

acoplamiento facilita el cambio de los componentes del subsistema sin

afectar a sus clientes –

Las fachadas permiten estructurar el sistema en capas, reduciendo las

dependencias de compilación. No evita que las aplicaciones puedan usar las

clases del subsistema si lo necesitan, eligiendo entre facilidad de uso

y generalidad.

El acoplamiento débil permite variar los componentes del subsistema, sin

que ello afecte a sus clientes.

La reducción de las dependencias de compilación es de vital importancia en

los grandes sistemas de software.

Una fachada también puede simplificar los sistemas de portar a otras

plataformas, ya que es menos probable que la construcción de un

subsistema requiere de la construcción todos los demás.