ESTÁNDARES WEB Y LA W3C

Transcripción

1 ESTÁNDARES WEB Y LA W3C

2 W3C WORLD WIDE WEB CONSORTIUM

3 ESTÁNDARES WEB WEB VENTAJAS

4 COMPATIBILIDAD INTERNET ES INFORMACIÓN. EL DESARROLLADOR DEBE POR TANTO PREOCUPARSE DE QUE LA INFORMACIÓN EN SU WEB SEA COMPATIBLE CON TODAS LAS PLATAFORMAS POSIBLES. UN USO CORRECTO DE LOS ESTÁNDARES PROPICIA ESTA COMPATIBILIDAD.

5 USABILIDAD CADA SITIO WEB TIENE UN OBJETIVO POR EL QUE HA SIDO GENERADO. UNA BUENA CODIFICACIÓN MEDIANTE LENGUAJES DE MARCADO ESTÁNDARES GENERA SITES MÁS USABLES Y TAMBIÉN ACCESIBLES.

6 ACCESIBILIDAD XHTML Y CSS VÁLIDOS ASEGURAN QUE EL SITIO ESTÉ CONSTRUIDO SEPARANDO CONTENIDO Y DISEÑO. CONSEGUIMOS ASÍ UN SITIO MUCHO MÁS ACCESIBLE PARA CUALQUIER PLATAFORMA O USUARIO.

7 NAVEGACIÓN MÁS RÁPIDA AL SER LOS ARCHIVOS DE TAMAÑO MÁS REDUCIDO Y SEPARAR LOS ESTILOS DE CONTENIDOS MEDIANTE CSS, SE REDUCEN SUSTANCIALMENTE LOS TIEMPOS DE CARGA POR PARTE DE USUARIOS CON CONEXIONES MÁS LENTAS.

8 POSICIONAMIENTO LOS BUSCADORES COMO GOOGLE O YAHOO Y SUS MOTORES DE BÚSQUEDA, NO MIRAN POR EL DISEÑO DEL SITIO, SINO POR UNA ESTRUCTURACIÓN CORRECTA DE LOS CONTENIDOS. MEJORA EL POSICIONAMIENTO EN LA WWW Y AUMENTA EL NÚMERO DE VISITAS.

9 SEPARAR EL DISEÑO DEL CONTENIDO

10 HTML + CSS

11 HTML HYPERTEXT MARKUP LANGUAGE

12 CSS CASCADING STYLE SHEETS

13 DÓNDE TRABAJAMOS TODO ESTO?

14 SUBLIME TEXT, CODA, TEXTMATE, CSS EDIT, ETC.

15 DREAMWEAVER

16 WYSIWYG

17 WYSIWYG WHAT YOU SEE IS WHAT YOU GET

18 VISUAL

19 VICIO

20

21

22 NAVEGADORES AQUÍ COMIENZA EL CALVARIO

23

24

25

26

27

28

29 RECOMENDACIÓN? UTILIZAR NAVEGADORES QUE VALIDEN ESTÁNDARES

30 DCU DISEÑO CENTRADO EN EL USUARIO

31 USABILIDAD DEL INGLÉS USABILITY, ES UNA MEDIDA EMPÍRICA Y RELATIVA ACERCA DE LO FÁCIL, RÁPIDO Y AGRADABLE QUE ES UTILIZAR UN DETERMINADO PRODUCTO O SERVICIO.

32 EMPÍRICA PORQUE NO SE BASA EN OPINIONES O SENSACIONES SINO EN PRUEBAS (DEL INGLÉS TESTS) DE USABILIDAD, REALIZADAS EN LABORATORIO U OBSERVADAS MEDIANTE TRABAJO DE CAMPO.

33 RELATIVA PORQUE EL RESULTADO NO ES NI BUENO NI MALO, SINO QUE DEPENDE DE LAS METAS PLANTEADAS (EJ.POR LO MENOS EL 80% DE LOS USUARIOS DE UN DETERMINADO GRUPO O TIPO DEFINIDO DEBEN PODER INSTALAR CON ÉXITO EL EN N MINUTOS SIN MÁS AYUDA QUE LA GUÍA RÁPIDA) O DE UNA COMPARACIÓN CON OTROS SISTEMAS SIMILARES.

34 DISEÑAR ES ORGANIZAR ELEMENTOS DE MODO QUE CUMPLAN UNA NECESIDAD PARTICULAR DE LA MEJOR MANERA FORMA POSIBLE (CHARLES EAMES)

35 USABILIDAD MEDIR - ANALIZAR -ESTUDIAR - CONOCER - MODIFICAR

36 DON T MAKE ME THINK!

37

38 USABILIDAD ENTIENDE A LA ORGANIZACIÓN Y AL USUARIO LOGRA EL EQUILIBRIO NECESARIO ANTICIPA LA FORMA DE PENSAMIENTO DEL USUARIO SIENTA LAS BASES DE LA APLICACIÓN FINAL

39 DISEÑO WEB

40 PARA QUIENES? PÚBLICO OBJETIVO

41 QUÉ? ARQUITECTURA DE LA INFORMACIÓN

42 CÓMO? DISEÑO DE INTERACCIÓN DISEÑO DE INTERFAZ

43 FORMULACIÓN DEL PROYECTO BRIEF DEL PROYECTO INFORMACIÓN DEL PROYECTO DEFINICIÓN DE AUDIENCIAS

44 BECHMARK ANÁLISIS DE COMPETENCIA SITIOS RELACIONADOS ANÁLISIS DE REFERENTES

45 ARQUITECTURA DE LA INFORMACIÓN ÍNDICE DE CONTENIDOS CARDSORTING MAPA DE NAVEGACIÓN

46 DISEÑO DE INTERFAZ WIREFRAMES PALETA CROMÁTICA DEFINICIÓN DE TIPOGRAFÍAS MOCK-UPS

47 DISEÑO DE FRONT-END HTML + CSS VALIDACIÓN DE ESTÁNDARES PRUEBAS DE NAVEGADORES EVALUACIÓN DE USO

48

49 PERFILES DE USUARIOS

50 CÓMO PODEMOS SABER CON SEGURIDAD QUE NUESTRAS PÁGINAS ESTÁN APARECIENDO DE LA MANERA EN QUE LO PROYECTAMOS?

51 CONOCER AL USUARIO

52 LUEGO DE LEER GUÍAS DE ESTILO, ARTÍCULOS, DIRECTRICES DE USABILIDAD, CONOZCO Y ENTIENDO LO SUFICIENTEMENTE AL USUARIO COMO PARA DISEÑAR PRODUCTOS WEB USABLES

53 ERROR!

54 DISEÑO CENTRADO EN EL USUARIO ES AQUEL EN EL QUE TODO EL PROCESO DE DISEÑO SE ENCUENTRA CONDUCIDO POR EL USUARIO Y NO POR EL GURÚ DE TURNO.

55 NO CONFUNDIR LAS DIRECTRICES DE USABILIDAD, NORMALMENTE ELABORADAS POR PROFESIONALES CON EXPERIENCIA EN DETECTAR PROBLEMAS DE USO, SON DE GRAN UTILIDAD, PERO CADA PROYECTO WEB, CADA USUARIO, CADA CONTEXTO DE USO... SON ÚNICOS, Y POR TANTO LA ÚNICA FORMA DE DISEÑAR UN PRODUCTO 100% USABLE (SI ES QUE ESTO EXISTE) ES ESTUDIANDO TODAS ESTAS VARIABLES PARA CADA PROYECTO WEB EN CONCRETO.

56 INFORMACIÓN DESCRIPTIVA EDAD, SEXO, TRABAJO, POSICIÓN, NIVEL DE ESTUDIOS, EXPERIENCIA EN INTERNET

57 CONTEXTO DE USO LUGAR DE ACCESO AL PRODUCTO WEB, TIEMPO DISPONIBLE/DESTINADO PARA SU USO, HARDWARE Y SOFTWARE EMPLEADO

58 PREFERENCIAS DEL USUARIO NECESIDADES Y OBJETIVOS

59 TA REA :)

60 ANÁLISIS DE SITIO USUARIOS - INTERFAZ - INTERACCIÓN TOMAR UNO DE LOS BUENOS SITIOS OBSERVADOS DETERMINAR PÚBLICO OBJETIVO QUIÉNES SON, QUÉ GUSTAN, QUÉ HACEN, QUÉ LES INTERESA, CÓMO SE COMPORTAN ANTE EL SITIO ANALIZAR SU INTERFAZ GRILLA CONSTRUCTIVA, TAMAÑOS, COLORES, TIPOGRAFÍAS, ETC. ANALIZAR SU INTERACCIÓN CÓMO SE ENTREGA LA INFORMACIÓN, CANTIDAD DE ELEMENTOS DE MENÚ, PROFUNDIDAD DE NAVEGACIÓN, SEGMENTACIÓN DE INFORMACIÓN