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
![Page 1: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/1.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Usabilidad y Accesibilidad para la WebUAWEB A.C.
Taller de Gestiónde Proyectos Web
![Page 2: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/2.jpg)
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
![Page 3: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/3.jpg)
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
![Page 4: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/4.jpg)
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
![Page 5: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/5.jpg)
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
![Page 6: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/6.jpg)
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
![Page 7: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/7.jpg)
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
![Page 8: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/8.jpg)
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
![Page 9: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/9.jpg)
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
![Page 10: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/10.jpg)
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?
![Page 11: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/11.jpg)
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
![Page 12: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/12.jpg)
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
![Page 13: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/13.jpg)
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
![Page 14: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/14.jpg)
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
![Page 15: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/15.jpg)
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”
![Page 16: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/16.jpg)
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
![Page 17: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/17.jpg)
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
![Page 18: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/18.jpg)
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
![Page 19: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/19.jpg)
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
![Page 20: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/20.jpg)
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
![Page 21: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/21.jpg)
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
![Page 22: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/22.jpg)
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
![Page 23: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/23.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Primera Pausa10:45 horas
![Page 24: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/24.jpg)
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
![Page 25: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/25.jpg)
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
![Page 26: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/26.jpg)
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
![Page 27: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/27.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
![Page 28: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/28.jpg)
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
![Page 29: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/29.jpg)
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
![Page 30: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/30.jpg)
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
![Page 31: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/31.jpg)
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/
![Page 32: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/32.jpg)
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
![Page 33: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/33.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
![Page 34: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/34.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Listar elementos
LogotipoSloganBuscadorAgenda / ProgramaExpositoresAlumnosInscripcionesContacto…
![Page 35: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/35.jpg)
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
![Page 36: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/36.jpg)
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.
![Page 37: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/37.jpg)
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.
![Page 38: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/38.jpg)
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
![Page 39: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/39.jpg)
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
![Page 40: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/40.jpg)
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
![Page 41: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/41.jpg)
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.
![Page 42: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/42.jpg)
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.
![Page 43: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/43.jpg)
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/
![Page 44: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/44.jpg)
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…
![Page 45: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/45.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Segunda Pausa13:00 horas
![Page 46: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/46.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Día 1, TARDE
![Page 47: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/47.jpg)
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
![Page 48: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/48.jpg)
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
![Page 49: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/49.jpg)
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
![Page 50: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/50.jpg)
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
![Page 51: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/51.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
800x6001024x768
4 MB!!!!
![Page 52: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/52.jpg)
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
![Page 53: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/53.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Jerarquía Visual
![Page 54: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/54.jpg)
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
![Page 55: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/55.jpg)
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
![Page 56: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/56.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
![Page 57: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/57.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
![Page 58: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/58.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Experiencia de Usuario
![Page 59: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/59.jpg)
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
![Page 60: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/60.jpg)
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
![Page 61: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/61.jpg)
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
![Page 62: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/62.jpg)
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
![Page 63: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/63.jpg)
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/
![Page 64: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/64.jpg)
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
![Page 65: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/65.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
![Page 66: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/66.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Tercera Pausa16:30 horas
![Page 67: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/67.jpg)
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
![Page 68: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/68.jpg)
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
![Page 69: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/69.jpg)
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
![Page 70: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/70.jpg)
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
![Page 71: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/71.jpg)
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
![Page 72: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/72.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
![Page 73: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/73.jpg)
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
![Page 74: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/74.jpg)
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
![Page 75: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/75.jpg)
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
![Page 76: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/76.jpg)
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.
![Page 77: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/77.jpg)
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.
![Page 78: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/78.jpg)
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.
![Page 79: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/79.jpg)
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.
![Page 80: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/80.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
www.guiaweb.gob.cl
![Page 81: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/81.jpg)
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/
![Page 82: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/82.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Tercera Pausa19:00 horas
![Page 83: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/83.jpg)
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
![Page 84: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/84.jpg)
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
![Page 85: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/85.jpg)
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
![Page 86: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/86.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
![Page 87: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/87.jpg)
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
![Page 88: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/88.jpg)
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….
![Page 89: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/89.jpg)
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
![Page 90: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/90.jpg)
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
![Page 91: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/91.jpg)
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/
![Page 92: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/92.jpg)
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.
![Page 93: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/93.jpg)
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
![Page 94: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/94.jpg)
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>
![Page 95: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/95.jpg)
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
![Page 96: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/96.jpg)
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?
![Page 97: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/97.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Taller de Gestión de Proyectos Web8 y 9 de noviembre 2007.
Miremos sitios…
![Page 98: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/98.jpg)
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
![Page 99: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/99.jpg)
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/
![Page 100: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/100.jpg)
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
![Page 101: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/101.jpg)
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
![Page 102: Taller de Gestión de Proyectos Web de clase mundial](https://reader035.vdocumento.com/reader035/viewer/2022081401/557b3dc3d8b42a16488b5212/html5/thumbnails/102.jpg)
Monterrey, noviembre 2007 / Paulo Saavedra V. / [email protected]
Usabilidad y Accesibilidad para la WebUAWEB A.C.
Muchas gracias!