taller de gestión de proyectos web de clase mundial
DESCRIPTION
Con Paulo Saavedra, experto en diseño y gestión de sitios web de gobierno. Es uno de los autores de la Guía para Desarrollo de Sitios Web de Gobierno (Chile), documento en español de referencia internacional. 8 y 9 de noviembre, 2007 Instalaciones de la Universidad de Monterrey Monterrey, Nuevo León, MéxicoTRANSCRIPT
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Usabilidad y Accesibilidad para la WebUAWEB A.C.
Taller de Gestiónde Proyectos Web
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Día 1, Mañana
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
8 de noviembre de 2007Mas de 130 eventos40 países40.000 personas involucradas
3 eventos en México, 1 en MTY
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Módulo 1: Gestión, contenido y diseño de proyectos Web
Gestión del proyectoPreguntas básicas Equipos de trabajo Definiciones para el diseño
Producción y manejo de contenidosConceptos básicos Diseño de contenidos Arquitectura de información
Diseño visualPrincipios de diseño y diagramación Buenas prácticas y estándares
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Módulo 1Gestión del Proyecto
Conceptos básicosPreguntas básicasEquipo de trabajoDefiniciones para el diseño
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
¿Qué es un proyecto?
Es la suma de esfuerzos que en forma temporal se utilizan para generar un PRODUCTO O SERVICIO en particular o UNICO.Tiene comienzo y finalGenera entregables UNICOSSe desarrolla en etapas
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Componentes de la Administración de Proyectos
Habilidades claveLiderazgo, Comunicación, Negociación, Solución de problemas, Lograr objetivos
ConocimientosTécnicos y Administrativos
HerramientasTécnicas
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Elementos relacionados
TiempoCalidadAlcanceEntornoRecursosCosto
BUSCAR LA BUSCAR LA SATISFACCISATISFACCIÓÓN DE N DE
TODOS LOS TODOS LOS INTERESADOSINTERESADOS
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Ciclo de vida de un proyecto
1. Inicio*
2. Planeación*
3. Ejecución*
4. Control*
5. Cierre*N
IVEL
DE
ACT
IVID
AD
INICIO TIEMPO
*Etapas del proyecto
TERMINO
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Preguntas básicas
¿Para qué necesita el sitio Web la institución?
¿Para qué necesita el sitio Web la comunidad?
¿Qué es lo que buscan las personas en mi institución?
¿Qué información de la institución es útil para la comunidad?
¿Qué imagen de la institución quiero proyectar en mis usuarios?
¿Qué servicios interactivos entregaré a través del Sitio Web?
¿Quiénes pueden ayudarme a realizar el proyecto?
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Preguntas Básicas
OBJETIVOS
AUDIENCIA
TECNOLOGIA
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
•Información•Servicios•documentos
•Autoridades•Gerencias•Divisiones
•Stakeholder•Internos•Externos
•Clientes•Ciudadanos•Publico
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Para encontrar el camino
Saber lo que quiero lograrCuales son los objetivos del proyectoCómo se integra con la visión y misión institucional
Saber a quién me dirijoQuiénes son, tipos de usuarios y perfiles.
Saber qué puedo ofrecerInformación, productos y servicios
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Definir objetivos
Estudiar la misión y visión de la institución
Comprender metas objetivas y priorizarEstudias planes y programas en ejecución
Identificar prioridades y enfocar el proyecto
Identificar productores de información
Relacionar canales de comunicación interna y sus flujos
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Identificar necesidades y servicios
Una institución de Gobierno no debe intentar resolver en un único proyecto todos las necesidades.
Servicios y trámites Gestores de informaciónProcesos, analizar y crear diagramascontenidos y proyectos “publicables”
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Equipo de Trabajo
Creación del Comité Web Integrar áreas gestión, informática y comunicacionesJefe operacionalReuniones semanales Política editorialDocumentación de compromisos
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Equipo de Trabajo
Rol de la autoridadVincularse con el proyectoAvalar el proyecto y las decisionesApoyar al Comité Web
¿Cómo seducir a la autoridad?Datos cuantitativos (ahorro)Hitos mediáticosBeneficios a mediano plazo
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Equipo de Trabajo
Competencias internas Web MasterEncargados de implementar el sitioGestores de contenido
Capacitación
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Definiciones para el diseño
Definiciones de AudienciaCapacidad físicaCapacidad técnicaNecesidades de informaciónUbicación geográfica
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Casos de uso
Extraído del diseño de softwareConsiste en actores y casos de uso Representan usuarios y sistemasComportamiento del sistema
Caso de uso
Actor/Usuario
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Pasajero
Reservar Vuelo
Cancelar reserva Aerolínea
Descripción del Caso de Uso
- Pasajero solicita una reservación de un ticket a un vendedor- Vendedor consulta disponibilidad en la Aerolínea- Aerolínea informa que hay ticket disponibles y entrega detalles del vuelo- Vendedor entrega al pasajero la información de los detalles del vuelo- Pasajero solicita el asiento de su preferencia- Vendedor reserva el asiento- Vendedor confirma la reserva con el pasajero- Vendedor solicita el pago al pasajero y ofrece un método de pago- Pasajero paga al vendedor- Vendedor envía el pago a la Aerolínea- Aerolínea entrega la confirmación final del ticket al vendedor- Vendedor emite el ticket al pasajero•Nombres: Clases o atributos
•Verbos: operaciones posibles
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
¿Para qué un diagrama?
Formularios de contactoBúsquedas y resultados de búsquedasSistemas de navegaciónModelos para trámites en línea
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Primera Pausa10:45 horas
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Módulo 1Producción y manejo de contenidos
Diseño de contenidosArquitectura de información CARD SORTING
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diseño de contenidos
Considerar a todos los tipos de usuarioPriorizar y jerarquizar el contenidoEstudiar todos los bloques de informaciónLenguaje ciudadano
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Claves del Diseño de Información
El tema central de la página debe ser CLARODecir siempre de quién es la página es básicoNunca olvidar la naturaleza del medio (WEB)Siempre indicar la fecha de publicación
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
http://www.lenguajeciudadano.gob.mx
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
¿Qué es Arquitectura de Información?
El arte y la ciencia de estructurar y clasificar sitios Web e intranets con el fin de ayudar a los usuarios a encontrar y manejar la información.
Fotografía: Javier Velasco
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Arquitectura de Información, paso 1
Recopilar todo el contenido existenteDetallar el contenido nuevo necesarioDeterminar la estructura del sitio
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Arquitectura de Información,paso 2
Analizar el contenidoCrear wireframesJerarquizar contenidoDeterminar servicios
http://alquimistas.evilnolo.com/
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
http://www.w3.org/WAI/EO/2005/10/perspective
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Listar elementos
LogotipoSloganBuscadorAgenda / ProgramaExpositoresAlumnosInscripcionesContacto…
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
LogoBarra de navegación
Novedades UAWEB
Buscar
RSS
Materiales Destacados
Programa de actividades
Registro
Expositores
Información Corporativa y de contacto
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Definición del Contenido
Utilice como primer insumo la información obtenida de la definición de objetivos y audiencia.Considere por ejemplo:
Información institucional jerarquizada (horarios, teléfonos, direcciones, directores, organigrama, etc.)Productos / Servicios, todo lo que se pueda hacer en el sitio, trámites, etc.Novedades, noticias, información relevante, fechas destacadas, etc.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Organización del Contenido
Se trata de establecer niveles jerárquicos del contenido con el objeto de centrarse en el usuario y no en la organizaciónConsiderar
Información institucional jerarquizada (horarios, teléfonos, direcciones, directores, organigrama, etc.)Productos / Servicios, todo lo que se pueda hacer en el sitio, trámites, etc.Novedades, noticias, información relevante, fechas destacadas, etc.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Organización del Contenidopor Temática
PaísRegiónCiudadComuna
DíaSemanaMesAño
ABCD
Orden GeográficoOrden CronológicoOrden Alfabético
Con los elementos agrupados en un solo lugar, el usuario puede encontrar rápidamente lo que está buscando
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Organización del Contenidopor Categorías
ChileGobiernoInstituciónTecnologíaBeneficios
Lista de serviciosHacer un trámitePagar un servicio
CorporativoClientesGobiernoPrivados
LibrosArchivosMúsicaSalud
TópicoTareaPúblicoProducto
Facilita la navegación y permite el aprendizaje por asociación. Los elementos pueden estar clasificados en más categorías
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
¿Qué es “Card Sorting”?
Consiste en observar cómo los usuarios agrupan y asocian entre sí un número predeterminado de tarjetas etiquetadas con las diferentes categorías temáticas del sitio Web. De esta forma, es posible organizar y clasificar la información de un sitio Web conforme a las preferencias de sus usuarios
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Tipos de “Card Sorting”
Card Sorting Abierto: El usuario puede agrupar las categorías libremente en el número de conjuntos que crea necesario Card Sorting Cerrado: Los grupos o conjuntos están predefinidos y etiquetados y el usuario únicamente deberá colocar cada categoría en el grupo que crea corresponda.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Consejos Prácticos
Seleccione al menos 5 personas: deben tener características y perfiles acordes con el público objetivo del sitio Web Explique el objetivo de la prueba, y que este no es la evaluación de los propios participantes. Indique a los participantes cuál debe ser el criterio de agrupación de las categorías: por similaridad. Entregue a los usuarios las tarjetas con las diferentes categorías, asegúrese que cada conjunto entregado esté desordenado (barajado). En el caso de “card sorting” de tipo abierto, una vez terminada la prueba, puede pedir a los participantes que den nombre a cada uno de los grupos creados.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Card Sorting: Conclusiones
Facilita la categorización de contenidos y sirve como ayuda para:
decisiones etapa de diseño conceptual (abierto); yorganización de categorías en etapas de evaluación de usabilidad (card sorting cerrado).
http://www.websort.net/
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diseña para una Web únicaSi diseñas el contenido teniendo en cuenta los diferentes dispositivos, reducirás costos, tu página será más flexible y podrá satisfacer las necesidades de más personas.
http://www.w3c.es/Divulgacion/Tarjetas/MWBP/
Buenas prácticas…
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Segunda Pausa13:00 horas
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Día 1, TARDE
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Módulo 1Diseño Visual
Estructuras de sitioPrincipios de diseño y diagramaciónBuenas prácticas y estándares
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Estructura del Sitio
http://www.webstyleguide.com
COMPLEJOAudiencias
Capacitadas
SIMPLEContenido
Básico, Capacitación
LINEAL, NARRATIVOEstructura predecible
No-LINEAL, HIPERLINKFlexible, puede ser confuso
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diagramas de Sitio
http://www.webstyleguide.com
Diagrama Conceptual Diagrama de archivos
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Estructura de páginas
600 píxeles
350 píxeles
535 píxeles
670 píxeles
Monitores de 15” (640x480)SAFE AREA: 600x350
Hoja Carta SAFE AREA: 535x670
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
800x6001024x768
4 MB!!!!
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diseño y Diagramación
Regla de oro: La Web tiene baja resolución
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Jerarquía Visual
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
DiagramaciónSin puntos focalesSin Estructura grafica
Estructura visual,Contraste puntos focales
Básico Mejor
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Layout base de un sitio
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Experiencia de Usuario
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diseño de la Experiencia de Usuario
Industria AutomotrizEstudios de mercadoEntrevistas a UsuariosIngenieríaErgonomíaInterfazDiseño VisualPruebasGran Lanzamiento
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Elementos de la Experiencia de Usuario (en el Web)
Web como aplicación
Web como hipertexto
Jesse James Garrett, 2000
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diseño de sitios
http://www.webstyleguide.com
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Buenas prácticas
Diseña para una Web únicaCoherencia temáticaAprovechar capacidadesEvitar problemas en la implementaciónPruebasMinimiza el ruidoHaz obvio lo clickeable
Evitar los riesgos conocidosVentanas emergentesTablas anidadasDiseño con tablasEspaciar con gráficosMarcosMapas de imagen
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Servicios del Sector PúblicoComunidad Europea
eAccesibility of public sector services in theEuropean Union, Noviembre 2005
436 Sitios evaluados (25 estados)64% no provee etiqueta ALT en imágenes34% usa frames y no provee adecuadamente contenido para NOFRAMES99% contiene HTML no valido30% contienen características y opciones de navegación que no pueden ser usadas vía teclado.(atajos)
¿Suena conocido?
http://www.cabinetoffice.gov.uk/
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diseño Web y Estándares
Diseño para el acceso rápidoBuenas prácticas (peso, layout, frames, audio, imagenes, etiquetas, plug-ins)Estándares Internacionales (html, CSS, separar contenido y presentación)
Diseño accesibleSitios accesibles para todos, no canales “especiales”Funcionamiento en diferentes plataformas, degradar el sitio “amigablemente”
Diseño de experiencia de usuariosDiagramas de interacción, diseño de interfacesPruebas heurísticas (Artículo DNX) y test de usabilidad (SIDAR)
Atención de UsuariosGenerar estrategias de atención y feedback con usuariosConsiderar siempre al usuario como centro del negocio
Puesta en MarchaPlan de pruebas, presencia en buscadores, derechos del usuario
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Tercera Pausa16:30 horas
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Módulo 2:Usabilidad para sitios usables
Básicos del diseño centrado en el usuario Diseño centrado en el usuarioIntroducción a la usabilidad Métodos de evaluación Herramientas de apoyo
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diseño Centrado en el Usuario
Adivinar lo que quieren las personas y
construir un sitio para ellos es caro; si adivinas
mal, hay que volver a hacerlo todo.
Christina Wodtke, 2002
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
DCU, pasos básicos
1.Averigua para quién es el sitio.2.Habla con esas personas.3.Diseña el sitio para ellos.4.Prueba un prototipo del sitio con ellos.5.Cambia el diseño de acuerdo a lo aprendido.6.Prueba el sitio final con ellos.
Christina Wodtke, 2002
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
“Ignorar la usabilidad es invitar al error”
Requerimientodel Usuario
ProductoFinal
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
¿Qué es USABILIDAD…?
Es la utilidad, facilidad de uso, facilidad de aprendizaje y satisfacción de un sistema o producto para conseguir objetivos específicos.
Sirve para “medir” si un “algo” (o su interface) es...Fácil de aprenderFácil de entender y recordarEficiente
Placentero, no traumático
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Métodos de Usabilidad
Seleccionar el método apropiado depende de tres condiciones:
Relación Tiempo – RecursosSi no cuenta con acceso directo a usuariosSi hay Capacidades limitadas
http://www.usabilitynet.org/tools/methods.htm
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Métodos de Usabilidad
http://www.usabilitynet.org/tools/methods.htm
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Problemas frecuentes...Dependencia de JavaScriptPantallas o ventanas sin un título o encabezadoMensajes de error y de operación mal redactadosEstado de vínculos poco claro URL o Dominio difícil de memorizarDiversidad de formatos de ingreso de datos (RUT)Falta declaración de pasos y número de pantallasManejo diverso de identidad corporativa Faltan espacios (ventanas) de confirmación de datos para ejecutar alguna solicitud. (pagar, revisar, modificar, etc.)Diferenciación de campos requeridos en un formulario
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Etiquetas de campos no son descriptivas de la información que el usuario debe ingresar.Sugerencia: Usar etiquetas simples y claras.
Funcionamiento estresante de los elementos interactivos. Al seleccionar un checkbox se borran las opciones ingresadas en los combos.Sugerencia: Las acciones ejercidas sobre campos posteriores no deben alterar el funcionamiento de campos anteriores.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Es imposible volver a páginas anteriores con las herramientas del navegador. Cada vez que el usuario lo intenta la página expira. Esto es sumamente molesto, dado que el usuario puede perder todo lo avanzado en muchos pasos anteriores. Además le impide corregir información capturada antes en un proceso que contiene muchas páginas.Sugerencia: Corregir el funcionamiento de “volver” para que no expire la sesión ni pierda datos.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Se utilizan abreviaciones que no son explicadas al usuario.
Sugerencia: Al ser un trámite que admite intervención de usuarios extranjeros, las abreviaciones deben ser explicadas -al menos en la columna derecha- como una forma de evitar posibles dudas o errores.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
No se admiten caracteres especiales en un campo importante, que no depende de si el usuario desea o no incluir el caracter, sino que dependen de datos reales, emanados del "mundo físico".
Sugerencia: En este campo debieran admitirse caracteres especiales, sobre todo considerando el tipo de dato (ej: una empresa llamada "Ñandú"). De no ser posible, advertir al usuario sobre este inconveniente y las razones de porqué no se pudo solucionar el problema.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
www.guiaweb.gob.cl
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Herramientas de Apoyo
La red permite tener siempre un link a manoWeb Developer Tool Bar (Firefox)
http://chrispederick.com/work/web-developer/
Web Accessibility Tools (Internet Explorer)http://www.wat-c.org/
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Tercera Pausa19:00 horas
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Día 2, Mañana
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Módulo 3: Estándares de diseño
Separar el contenido de la presentación, CSS5 beneficios del “código estándar”Diseño sin tablas XHTML Usabilidad = accesibilidad
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Contenido / Presentación
Contenido CSS/XHTML Dispositivos
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
5 beneficios de código estándar1.Mismo contenido en diferentes dispositivos2.Mejor desempeño y despliegue3.Compatible con todos los browsers4.Manejo flexible5.Facilita la distribución de contenido
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Diseño de CSS
DISEÑAR PARA FIREFOX… ES ESTANDARDespués, Explorer
Cómo? Con HACKS para IEhttp://www.google.com.mx/search?client=firefox-a&rls=org.mozilla%3Aes-AR%3Aofficial&channel=s&hl=es&q=css+hacks+for+IE&meta=&btnG=Buscar+con+Google2.430.000 resultados….
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
¿Porqué no diseñar con tablas?
Porque las tablas son para presentar datosPorque son una tentación fácil pero equivocadaPorque usarlas implica menos accesibilidadPorque hacen que los sitios no sean flexiblesPorque impide un sitio más funcional
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Aplicación de CSS
http://somerandomdude.net/srd-projects/sanscons/Selección de Skins en bloggerTemplates Joomla
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
http://www.simmons.edu/gradstudies/
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
¿Qué es xhtml?
Versión más estricta y limpia de HTMLSu objetivo es remplazar a HTML ante su limitación de uso con herramientas basadas en XMLCombina la sintaxis de HTML, diseñado para mostrar datos, con la de XML, diseñado para describir los datos.
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
¿Cómo funciona?
Documentos deben estar bien formados<p>Ejemplo de elementos mal <em>anidados</p>.</em>
Atributos y elementos deben ir en minúsculas <BODY>Ejemplo incorrecto</BODY>
Valores de las etiquetas siempre entre comillas <table rows=3> ejemplo incorrecto
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
IMPORTANTE
Existen varias versiones de XHTML (1.0, 1.1, Básico)Para utilizar una versión concreta, se debe incluir:
Definición del Tipo de Documento (DTD) que se pretende utilizar.
<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es"><head><title>Título</title></head><body> . . . </body></html>
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
A mayor USABILIDAD mayor ACCESIBILIDAD
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Preguntas…
¿Estándar implica ahorro?¿qué ahorro?¿Evangelizar o taparse los ojos?
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Miremos sitios…
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Links Recomendados
Web Developer Toolbar (Firefox)http://chrispederick.com/work/web-developer/
Web Accessibility Toolbar (Internet Explorer)http://www.visionaustralia.org.au/info.aspx?page=614#Download
¿Porqué Jacob Nielsen no usa imágenes en su sitio?
http://www.useit.com/about/nographics.html
www.useit.com
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Usabilidad y Accesibilidadhttp://www.cadius.org/http://www.sidar.org/http://www.usabilitynet.org/http://usableweb.com/http://www.usability.gov/http://universalusability.com/resources.html
Guías y Buenas prácticashttp://www.w3c.orghttp://www.guiaweb.gob.cl
Hojas de Estilohttp://www.alistapart.com/http://www.csszengarden.com/tr/espanol/http://www.sitepoint.com/article/style-web-forms-csshttp://www.howtocreate.co.uk/tutorials/css/introductionhttp://www.thenoodleincident.com/tutorials/box_lesson/boxes.htmlhttp://somerandomdude.net/srd-projects/sanscons/
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Arquitectura de Informaciónhttp://www.adaptivepath.com/http://iainstitute.org/http://blog.jjg.net/http://jjg.net/ia/visvocab/spanish.htmlhttp://louisrosenfeld.com/home/
Herramientashttp://www.opensourcecms.com/http://www.webaim.org/simulations/screenreaderhttp://www.fonttester.com/http://web.archive.org/collections/web.htmlhttp://juicystudio.com/services/colourcontrast-es.php#contrasthttp://www.wat-c.org/http://www.howtocreate.co.uk/http://www.bradsoft.com/topstyle/tslite/index.asp
XHTMLhttp://www.w3c.es/Divulgacion/Guiasbreves/XHTML
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
No olvidar
Pensar en grandeComenzar pequeñoEscalar rápidoGenerar valorEscuchar ….a los usuarios
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Usabilidad y Accesibilidad para la WebUAWEB A.C.
Muchas gracias!