– Diseño web y Usabilidad FERNANDO BASTO CORREA Derechos Reservados©

Presentación del tema: "– Diseño web y Usabilidad FERNANDO BASTO CORREA Derechos Reservados©"— Transcripción de la presentación:

1 www.fernandobasto.com – contacto@fernandobasto.com Diseño web y Usabilidad FERNANDO BASTO CORREA www.fernandobasto.com Derechos Reservados©

2 www.fernandobasto.com – contacto@fernandobasto.com Crece publicidad online en Colombia La publicidad en Internet empezó a reaccionar. Así se desprende de las cifras que reveló el más reciente sondeo de la firma Interactive Advertising Bureau (IAB), capítulo Colombia, desarrollado por PricewaterhouseCoopers. http://www.semana.com/noticias-economia/crece- publicidad-online-colombia/123722.aspx La importancia del medio crece día a día

3 www.fernandobasto.com – contacto@fernandobasto.com La Publicidad Online Potencia El Poder de los Medios Tradicionales El estudio, ejecutado por la consultora independiente NFO Infratest, analiza 15 de las mayores acciones de marca desarrolladas en Reino Unido, Francia y Alemania, y entre sus principales conclusiones destaca que la publicidad online amplía en gran medida el número de personas expuestas a las campañas planificadas en medios como la televisión, medios impresos o la radio. www.forobuscadores.com/publicidad-online-articulo.php La importancia del medio crece día a día

4 www.fernandobasto.com – contacto@fernandobasto.com La importancia del medio crece día a día El pago por clic, una herramienta esencial para las ventas Para los 117 responsables de marketing entrevistados por Miva, el pago por clic es ante todo un instrumento para las ventas. El 70% de los encuestados lo emplea principalmente con el fin de aumentar las ventas en sus tiendas online. http://www.marketingdirecto.com/noticias/noticia.php?idnoticia=23129

5 www.fernandobasto.com – contacto@fernandobasto.com Entendiendo el mundo actual ¿Quién dice que hoy el mundo no es así?

6 www.fernandobasto.com – contacto@fernandobasto.com Para tener en cuenta Internet es una alternativa interesante para anunciarse En el periódico lees la publicidad En la radio oyes la publicidad En la televisión miras la publicidad Internet te deja interactuar con publicidad

7 www.fernandobasto.com – contacto@fernandobasto.com El Sitio web El Punto de partida Pero… ¿qué pongo yo en la Red?

8 www.fernandobasto.com – contacto@fernandobasto.com Todo producto puede ser rico en información Para el comprador: –Disponibilidad –Precio –Costos de Entrega –Características y beneficios –Experiencias de otros usuarios Recordar siempre que la clave es la INFORMACIÓN: Hay que ofrecer la mejor que pueda dar, y recoger y usar la que me quieran ofrecer. Para el vendedor: Para el vendedor: –Historia del cliente –Preferencias financieras –Actitud –Satisfacción con productos anteriores

9 www.fernandobasto.com – contacto@fernandobasto.com Errores típicos No hay llamada a la acción - Dejar escapar al cliente Demasiados anuncios, demasiado movimiento No hay cristiano que lo encuentre Falta el numero de teléfono Falta información Look and Feel inconsistente Penalizar al que compra online Entre muchos más

10 www.fernandobasto.com – contacto@fernandobasto.com ¿Pero entonces cual es la diferencia entre un Diseño bonito y un Diseño útil, funcional, efectivo y en general que sea apropiado para los negocios?

11 www.fernandobasto.com – contacto@fernandobasto.com FASE 1 - RECOPILACIÓN DE INFORMACIÓN Comprensión de la empresa y sus productos. Comprensión del usuario. Análisis de sites competitivos. DISEÑO BASADO EN EL USUARIO * * Tomado de: www.condoconsulting.biz

12 www.fernandobasto.com – contacto@fernandobasto.com FASE 2 - PLANIFICACIÓN Análisis de la información recopilada. Definición de objetivos y estrategia. Preparación del brief creativo. DISEÑO BASADO EN EL USUARIO

13 www.fernandobasto.com – contacto@fernandobasto.com FASE 3 – CONTENIDO Y ESTRUCTURA Definición de la estructura del site. Acuerdo sobre el contenido. Redacción. DISEÑO BASADO EN EL USUARIO

14 www.fernandobasto.com – contacto@fernandobasto.com FASE 4 – DISEÑO Y PROGRAMACIÓN Proceder con el diseño. Programar. DISEÑO BASADO EN EL USUARIO

15 www.fernandobasto.com – contacto@fernandobasto.com FASE 5 – TESTEO Y CORRECIÓN Exponer el site al usuario final. Modificar. Publicar. DISEÑO BASADO EN EL USUARIO

16 www.fernandobasto.com – contacto@fernandobasto.com

17

18

19 Entonces … ¿Qué es Usabilidad? ¿Cómo lo harían si fueran Cine Colombia?

20 www.fernandobasto.com – contacto@fernandobasto.com 36 CONSEJOS PARA TENER SITIO WEB EXITOSO La tarea principal es convertir el sitio web en algo de utilidad para los visitantes (los clientes potenciales); y adicionalmente, que la construcción del sitio es sólo uno de los pasos para que este sea útil. Se necesitan tres grandes bloques de acción: la construcción, la gestión y actualización del sitio, la promoción y la mejoría permanentes.

21 www.fernandobasto.com – contacto@fernandobasto.com PAUTAS PARA WEB SITE: 1 a 3. Planeación, Metas, Competencia y Público. Tres aspectos que son la base del sitio web. Antes de contratar diseñadores, redactores y hosting nunca es tarde para hacer un ejercicio de planeación. Defina sus metas ¿qué piensa lograr con el sitio web? ¿Vender más, mejorar la su imagen?, posicionamiento. hay que ser ambicioso, pero realista Analice, además, la competencia: qué ha hecho, sus logros y sus errores, qué tanto ha invertido en su presencia en la Web. Esto le dará pautas para su propio sitio y le permitirá evaluar aciertos y errores de aquellos. No olvide a su público objetivo.

22 www.fernandobasto.com – contacto@fernandobasto.com CONSTRUCCIÓN En el tema de la construcción juega un papel preponderante la facilidad de uso, por encima del diseño. 4. Defina una estructura lógica del sitio: Cree secciones adecuadas para distribuir los contenidos, y si estos son muy abundantes, cree subsecciones dentro de aquellas. Haga la estructura del sitio en un organigrama; luego adicione líneas en forma de flujograma para construir la navegación. 5. De la importancia debida al menú de navegación: este es clave para facilitar la navegación; debe ser de fácil acceso y atractivo visualmente –sin ser recargado–. Elementos interactivos.

23 www.fernandobasto.com – contacto@fernandobasto.com

24

25 Después …

26 www.fernandobasto.com – contacto@fernandobasto.com http://www.useit.com/alertbox/reading_pattern.html Patrón de la F en usabilidad

27 www.fernandobasto.com – contacto@fernandobasto.com DISEÑO: 6. Sea coherente, el diseño debe reflejar personalidad de la empresa y permitir su fácil identificación. 7. Sea creativo pero no se enloquezca; el diseño no debe sacrificar la facilidad de navegación y de lectura (menor nº de clics =mayor consulta de los usuarios). 8. Siga las tradiciones en diseño; conocer las pautas generales (colores, tipos de letras, fondos, etc.) 9. Evite utilizar lo último en formatos y tecnologías, pues no todos los computadores tiene las más recientes versiones del software. 10. Priorice la facilidad de uso sobre el impacto grafico o multimedia. 11. No disguste a sus visitantes; abusando de las páginas emergentes, cursores animados, que lleguen aburrir.

28 www.fernandobasto.com – contacto@fernandobasto.com - Los colores primarios, puros, brillantes, son demasiado comunes, por lo que dan muy poca información al ojo. Por esto no conviene basarse nunca en ellos para construir nuestras páginas. - El color de los enlaces conviene que sea el azul estándar del navegador o al menos permanecer subrayados y con un color bien diferenciado de los del resto de elementos textuales de la página.

29 www.fernandobasto.com – contacto@fernandobasto.com

30

31 ColorSignificadoSu uso aportaEl exceso produce BLANCO Pureza, inocencia, optimismoPurifica la mente a los más altos niveles--- LAVANDA EquilibrioAyuda a la curación espiritualCansado y desorientado PLATA Paz, tenacidadQuita dolencias y enfermedades--- GRIS EstabilidadInspira la creatividad Simboliza el éxito --- AMARILLO Inteligencia, alentador, tibieza, precaución, innovación Ayuda a la estimulación mental Aclara una mente confusa Produce agotamiento Genera demasiada actividad mental ORO FortalezaFortalece el cuerpo y el espírituDemasiado fuerte para muchas personas NARANJA EnergíaTiene un agradable efecto de tibieza Aumenta la inmunidad y la potencia Aumenta la ansiedad ROJO Energía, vitalidad, poder, fuerza, apasionamiento, valor, agresividad, impulsivo Usado para intensificar el metabolismo del cuerpo con efervescencia y apasionamiento Ayuda a superar la depresión Ansiedad de aumentos, agitación, tensión PÚRPURA SerenidadÚtil para problemas mentales y nerviosos Pensamientos negativos AZUL Verdad, serenidad, armonía, fidelidad, sinceridad, responsabilidad Tranquiliza la mente Disipa temores Depresión, aflicción, pesadumbre AÑIL VerdadAyuda a despejar el camino a la conciencia del yo espiritual Dolor de cabeza VERDE Ecuanimidad inexperta, acaudalado, celos, moderado, equilibrado, tradicional Útil para el agotamiento nervioso Equilibra emociones Revitaliza el espíritu Estimula a sentir compasión Crea energía negativa NEGRO Silencio, elegancia, poderPaz. SilencioDistante, intimidatorio http://www.webtaller.com/maletin/articulos/significado_de_los_colores.php

32 www.fernandobasto.com – contacto@fernandobasto.com

33

34

35

36 12. Ponga a prueba su sitio; evalúelo, obtenga sugerencias. 13. Diseñe el sitio para todos los navegadores. 14. Use las nuevas tecnologías, pero bien, de tal forma que no perjudique al navegante. 15. La redacción debe ser clara, sencilla y con un lenguaje adecuado para el público objetivo. Si, por ejemplo, su empresa ofrece cursos de vacaciones para adolescentes, no utilice un lenguaje demasiado serio, ni tampoco infantil. 16. Cuide al máximo la calidad de los textos, tanto en la corrección gramatical y ortográfica como en el desarrollo mismo de los temas. 17. Evite los párrafos muy largos, y si es posible, sepárelos con una línea en blanco, para facilitar la lectura.

37 www.fernandobasto.com – contacto@fernandobasto.com 18. Evite los textos demasiado extensos y que requieran navegar demasiado hacia abajo. En ese caso, dé la posibilidad de descargarlos (en formatos como Word y PDF) o divídalos por capítulos). 19. Actualice permanentemente. No pretenda iniciar su sitio con un mar de contenidos; añada unas gotas de nuevos textos o imágenes. Esto hará que los visitantes quieran regresar para ver qué hay de nuevo. 20. El contenido del sitio debe ser siempre actual. Esto demuestra su interés o el de su empresa hacia los visitantes de la página. 21. Siempre trate a sus visitantes con respeto, utilizando las pautas de la netiqueta. Incluso si su sitio es personal y usted es un adolescente rebelde. 22. Utilice material gráfico original o de uso libre. Cuídese de tomar contenidos con derechos reservados (lo mismo aplica para los textos).

38 www.fernandobasto.com – contacto@fernandobasto.com Las fallas técnicas podrían echar por la borda todo el esfuerzo y la inversión puestos en su sitio web. Tenga en cuenta lo siguiente: 23. Contrate un buen servicio de hosting que le ofrezca agilidad en la carga de las páginas, una capacidad suficiente para incluir todos los contenidos que requiere, un límite de tráfico alto y un buen soporte técnico. 24. Ofrezca seguridad. Exija de su proveedor o del webmaster (el responsable del sitio) que ponga el tema de seguridad en primer plano. Esto aplica para todos los sitios, no solo para los bancos y las tiendas virtuales. 25. Si cree que se justifica, incluya en su sitio avances como un canal RSS.

39 www.fernandobasto.com – contacto@fernandobasto.com Crear un grupo de seguidores del sitio web no es fácil, pero en esto puede residir la clave del éxito. 26. Foros, weblogs, chats: en estos espacios los visitantes del sitio pueden discutir sobre temas relacionados, y al haber una interacción personal, se crean lazos de amistad, discusiones, grupos de trabajo, etc., que generan fidelidad y hacen que los sitios se visiten con mayor frecuencia.

40 www.fernandobasto.com – contacto@fernandobasto.com

41 27. Eventos en línea: chats con personajes importantes o expertos en un tema, concursos o transmisiones en vivo (por narración de texto, audio o video) hacen que la gente se reúna en torno a los sitios que los ofrecen. 28. Realice encuestas en línea entre sus usuarios, averigüe su nivel de satisfacción y tome nota de sus sugerencias. 29. Contacto directo: dé una dirección de correo electrónico de contacto, y responda oportunamente a las inquietudes de los usuarios. 30. Valores agregados: dé a sus visitantes la mayor cantidad de información sobre su compañía, productos y servicios, pero también entregue artículos de interés, noticias y novedades.

42 www.fernandobasto.com – contacto@fernandobasto.com La promoción es indispensable, pero aparece en el último paso. No promocione el sitio hasta tanto no esté completo. 31. Incluya su sitio en los principales buscadores de la Web, en especial en Google. Si no logra que aparezca entre las primeras opciones al hacer una búsqueda relacionada, acuda a servicios de optimización. 32. Promociónelo en sitios web de alto tráfico, ya sea haciendo canjes de pauta publicitaria (banners, por ejemplo) o pagando por su publicación. 33. Utilice servicios de publicidad contextual, como Google AdWords (adwords.google.com).

43 www.fernandobasto.com – contacto@fernandobasto.com El éxito de un sitio también radica en que no permanezca igual por mucho tiempo. 34. Renueve, de cuando en cuando, el diseño (ajuste en los colores, una sección nueva, una fotografía distinta..) que exista una retroalimentación. 35. Invierta permanentemente en el sitio (hacer mercadeo) 36. Y recuerde: ¡un sitio web nunca está terminado!.

44 www.fernandobasto.com – contacto@fernandobasto.com

45

46

47

48

49

50

51

52 Como ya hemos dicho …. Es hora de actuar !!!

53 www.fernandobasto.com – contacto@fernandobasto.com ¡ GRACIAS ! www.internetizando.com