El programa está dirigido a PyMEs, que estén interesadas en acceder a servicios de capacitación y asistencia técnica destinados a generar y/o fortalecer sus estrategias de promoción, marketing, comunicación y ventas a través de internet, y que cumplan con los requisitos de poseer número de cuit y estar facturando. Mejorando mi sitio web y comunicando mi empresa. Diseño: ideas creativas que ayudan a vender ¿Cómo debo pensar la estructura de mi sitio web para atraer a más clientes?

1. DISEÑO WEB 2.0
Ideas Creativas que Ayudan a Vender
PRESENTACIÓN PARA EL
PROGRAMA DE CAPACITACIÓN

2. WEB 2.0
Por donde empezar?
• Dominio
• Hosting
• Identidad
2 de 36

3. IDENTIDAD
Diseño Web 2.0

4. IDENTIDAD
Ideas Creativas que Ayudan a Vender
• Cómo veo a mi empresa?
• Cómo quiero que los demás vean a mi empresa?
• A quien quiero llegar?
4 de 36

5. ELEMENTOS DE COMUNICACIÓN
Ideas Creativas que Ayudan a Vender
EL
COLOR
5 de 36

6. ELEMENTOS DE COMUNICACIÓN
Ideas Creativas que Ayudan a Vender
LA
FORMA
6 de 36

7. ELEMENTOS DE COMUNICACIÓN
Ideas Creativas que Ayudan a Vender
LA
TIPOGRAFÍA
7 de 36

8. ELEMENTOS DE COMUNICACIÓN
Ideas Creativas que Ayudan a Vender
LAS
IMÁGENES
8 de 36

9. ELEMENTOS DE COMUNICACIÓN
Ideas Creativas que Ayudan a Vender
EJEMPLO
9 de 36

10. WEB 2.0
Ideas Creativas que Ayudan a Vender

11. INTRODUCCIÓN
WEB 2.0
El termino web 2.0 hace referencia a una serie de aplicaciones s y
páginas web que utilizan la inteligencia colectiva para
proporcionar servicios interactivos en red.
Permite a los usuarios, interactuar y colaborar entre sí como
creadores de contenido generados por si mismos en una
comunidad virtual, a diferencia de sitios web donde los usuarios
se limitan a la observación pasiva de los contenidos que se ha
creado para ellos.
11 de 36

12. WEB 1.0 vs WEB 2.0
Un Gran Cambio
WEB 1.0
WEB 2.0
• En su mayoría sólo de lectura
• En 1996, 250.000 sitios
• Dinámicas de lectura y escritura
• En 2010 + de 95.000.000 sitios
12 de 36

13. INTRODUCCIÓN
WEB 2.0
Ejemplos de Web
2.0 son las
comunidades web,
los servicios web, las
aplicaciones, los
servicios de red
social, los servicios
de alojamiento de
videos, las wikis,
blogs, mashups y
falcsonomías.
13 de 36

14. ESTILOS GRÁFICOS
WEB 2.0
DISEÑO
SIMPLE
El diseño es más
sencillo y la
navegación más
dinámica.
14 de 36

15. ESTILOS GRÁFICOS
WEB 2.0
CONTENIDO
EN
MÓDULOS
Diseño con estructura
de cabecera, columnas,
barras laterales y píe
de página.
logo
menú de navegación
identificación de secciones
menú
de
secciones
menú > de > rastros
TÍTULO DE SECCIÓN
área de contenido
área de
interacción
píe de página
15 de 36

16. ESTILOS GRÁFICOS
WEB 2.0
CABECERA
DESTACADA
En la cabecera
generalmente aparece
el logotipo y el menú
de navegación.
16 de 36

17. ESTILOS GRÁFICOS
WEB 2.0
TEXTOS
GRANDES
Con textos más
cortos nos permite
aumentar el tamaño
del mismo. Facilita la
asimilación del
contenido.Transmitir
ideas.
17 de 36

18. ESTILOS GRÁFICOS
WEB 2.0
COLORES
FUERTES
La utilización de
colores fuertes logrará
secciones claras y bien
definidas. Facilitando la
navegación al usuario.
18 de 36

19. ESTILOS GRÁFICOS
WEB 2.0
EFECTOS DE
IMAGEN
La utilización de
sombras, degrades,
colores brillantes,
bordes redondeados,
reflejos, volumen y
sombras, destacan
contenido.
19 de 36

20. ESTILOS GRÁFICOS
WEB 2.0
ICONOS
GRANDES
La utilización de un
correcto sistema
iconográfico facilita la
navegación del sitio
web. Agregándole
mayor dinamismo.
20 de 36

21. DISEÑO A MEDIDA
vs CMS

22. DISEÑO WEB A MEDIDA
CARACTERÍSTICAS
• Requieren un diseño y desarrollo personalizado
• Demandan mayor tiempo de trabajo para el diseño, maquetado
e implementación.
• Tiene un costo elevado de desarrollo.
• Las actualizaciones y modificaciones de diseño deben
gestionarse por un diseñador web.
22 de 36

23. DISEÑO WEB A MEDIDA
EJEMPLO
23 de 36

24. DISEÑO WEB A MEDIDA
EJEMPLO
24 de 36

25. DISEÑO WEB A MEDIDA
EJEMPLO
25 de 36

26. DISEÑO WEB CON CMS
CARACTERÍSTICAS
• Se trabaja el diseño sobre la estructura de un template o
plantilla.
• Lleva menos tiempo de trabajo para el diseño, maquetado e
implementación.
• El costo de desarrollo es menor.
• Requieren constantemente actualizaciones de nuevas
versiones.
• Son más flexibles a los cambios.
• Constantemente se desarrollan nuevos módulos que permiten
actualizar nuestra web de forma más rápida.
Ejemplos de CMS: Wordpress, Joomla, Drupal, Magento,
Opencart, etc.
26 de 36

27. DISEÑO WEB CON CMS
Sitio Web Desarrollado en Joomla: Web Organización de Eventos Nac. E Internac.
27 de 36

28. DISEÑO WEB CON CMS
Sitio Web Desarrollado en Wordpress: Web de Consultora
28 de 36

29. DISEÑO WEB CON CMS
Sitio Web Desarrollado en Wordpress: Blog de Noticias
29 de 36

30. DISEÑO WEB CON CMS
Sitio Web Desarrollado en Wordpress, Eliminando la Estructura de Template
30 de 36

31. DISEÑO WEB CON CMS
Sitio e-commerce Desarrollado en Joomla
31 de 36

32. DISEÑO WEB CON CMS
Sitio e-commerce Desarrollado en MercadoShops
32 de 36

33. DISEÑO WEB CON CMS
Sitio e-commerce Desarrollado en Magento
33 de 36

34. TIPS QUE MARCAN LA DIFERENCIA
Pequeñas Acciones Grandes Cambios
• Ideas Creativas
• Tener en cuenta la percepción del cliente
• Estrategia y difusión
• Opciones para la interacción con los usuarios
• Diseño simple “Menos es Más”
• Correcta utilización de los recursos disponibles
34 de 36

35. CONSULTAS??

36. PRESENTACIÓN PARA EL
PROGRAMA DE CAPACITACIÓN
MUCHAS GRACIAS!!
DISEÑO WEB 2.0
Ideas Creativas que Ayudan a Vender
WWW.UNICONE.COM.AR
INFO@UNICONE.COM.AR